How to set authorization header in HTML form of GET method

Question

I want to submit an HTML form to a server that accepts the form data in queryString along with the authorization header. The server then sends back the HTML document after performing some calculations on the data and authorization headers.

Restrictions

1. I can't use JavaScript features like AJAX or fetch because the form submission gets an HTML response that needs to be opened on the browser.
2. For internal reasons, the form also requires the GET method.

Response

The response received is an HTML document containing JavaScript containing sessionStorage.setItem('data', 'value') which is scoped only to the source. The form exists in the parent.example.com source, and the received HTML document is in the child.example.com source. So we have to go to the child.example.com page like an HTML form redirect.

Answer 1

Client code cannot perform this operation.

The closest way is to have the server respond to the request with a 401 Unauthorized status and a WWW-Authenticate: Basic header, which causes the browser to prompt the user for input using its native UI Credentials, and after the user enters the credentials, repeat the request using the format for Basic Authentication and add Authorization.

---

As Phil mentioned in the comments, it sounds like the URL you want to request is indeed not designed for direct browser navigation.

Rather than trying to solve this problem, you may be better off changing the authentication system to something else (such as a cookie set in response to submission of a traditional login form)