We are developing a single page Angular2/NodeJS app which will have a web based form for our users to fill and submit.We do not have any Web based application for our users to login to (so no SSO), but our users logs into our partner Apps, which can be a web application or mobile device each having its own authentication mechanism. Our partner apps basically calls our api to get various contents and show that in their UI. Now one of our content will have the link to the new form app that we are developing.
We want to secure the call to the Form app in such a way that the request can only be triggered from our partner apps and from no place else. The partner apps cannot stop the user from copying the url but we want to make sure that the request came in from our partner apps.
What is the best way to achieve this with minimal to no coding for our partners as we have no control over their development or release cycles. Few of the options we are evaluating
Option 1 :
Check the http header, Referer. https://en.wikipedia.org/wiki/HTTP_referer. This may not be the right solution as a) it can be easily spoofed (https://stackoverflow.com/questions/14854117/php-allow-access-to-specific-referrer-url-page-only) and b) The client can be a mobile app and decide to not send the header
Option 2 :
Another option would be our partners to pass a token as a hidden parameter. So assuming any non tech savvy user will not look into the page source to find what the token is. Ofcourse this may need some dev activity from our partners which we would like to avoid.
Are there any other elegant solution which we can try