Html vs JSP - get request header token value

Question

I am working on a Java application. The front end will be Angular2 .

If I try to open the home page of my application ( index.html is configured in web.xml as the default page ). The access URL should be http: // localhost: 8080 / MyWebApp .

Then I took the standard organization authentication page for authentication. If authentication is complete, the HTTP authorization token will be set in the request header, and finally the control will display my application home page.

If I use jsp , I can get the request header as,

String authHeader = request.getHeader("authorization"); out.println("<h2>HTTP Authorization header:</h2>"); if (authHeader == null) { out.print("No authorization header"); } else { out.print("<textarea readonly id='authHeader' rows=\"5\" cols=\"80\">" + authHeader + "</textarea>"); } 

But we use html as front end, because of angular 2 .

So, for my scenario, how can I get the request header and .

Please feel free to edit my question if this is not clear.

Answer 1

You cannot get the header value from client-side JavaScript . The only exceptions are the User-Agent and Referrer headers, as the browser provides values ​​in the document and navigator objects.

You said that you are working on a Java application with the Angular 2 interface, and another application provides a token (it may be useful to indicate whether this is something standard, for example OAuth2). I assume this is a custom token. I believe that you also meant that you have a server component, a servlet.

What you can do is implement authentication using servlets (or even JSPs) and then redirect back to your Angular 2 application, passing the token to the URL as a request parameter. The URL is easy to read in Angular 2 . However, this is not very safe, even if you use something like JWT . Alternatively to the URL, you can use the Set-Cookie header and then read the cookie from Angular.

What would be almost safe is user authentication using the server side (servlet or even JSP). Then create a one-time token that is passed to the URL as a request parameter when redirecting to your HTML page. Then again use the one-time token in the server call to get the real authentication token using the correct REST call from Angular 2 with the request and response.

Depending on how much control you have and what authentication the auth application is using, you might take a look at OAuth2. It focuses on many different authentication scenarios. In particular, the implicit OAuth2 provisioning flow is used to authenticate users only from client applications. Even if you cannot use it, it will give you some ideas.

Answer 2

When you use server-side authorization, your server places permissions with permissions on your HTML pages. But you can also put these tokens in response to your site with server-side meta tags. And then access to the meta tags via js.

 <meta name="_csrf" content="${_csrf.token}"/> <meta name="_csrf_header" content="${_csrf.headerName}"/> 

Meta tags are similar to response headers and can populate or override response headers. Read this post, please Spring Protected CSRF token not working with AJAX call and form in the same JSP

Answer 3

You can handle this on the server side (JSP expressions work on the server side), create a handler method on the server where you can check the header, and then redirect to the Angular application.

Answer 4

I think we can use the HTTP HEAD method as a JQUERY AJAX request on your HTML page.

https://en.wikipedia.org/wiki/Hypertext_Transfer_Protocol

The HEAD method requests a response that is identical to the GET response, but without the response body. This is useful for retrieving the meta-information written in the response headers without transferring the entire content.

  ajaxRequest = $.ajax({ type: "HEAD", async: true, url: 'index.jsp', success: function(message){ var headerValue =ajaxRequest.getResponseHeader('Content-Length')]); } }); 

Answer 5

There are various ways to solve this problem, since I ran into it long before what I prefer;

When authentication is completed on the login page and a token is created, I store it in the HTML repository, do it in localStorage.

The main thing is that you should understand that your views should not be directly accessible , and before accessing the page (view) there must be authentication (or there may be authorization).

So what you can do is set a URI to access any page, consider this:

 http://host/appname/pageName 

And when you connect to this URI through an ajax call, add the token that is stored in localStorage in the headers. And check all the authentication and authorization actions , and if success returns the view (as the name of the page suggested in the URI), otherwise return the login view.

Answer 6

If you understood correctly,

Angularjs is a client-side platform and is designed to work inside the browser without any server intervention, reducing its load, serving the application logic. All operations that must be performed using angular will only be initiated on the client side by the browser after loading HTML and javascript. The scope of angular is limited only to this area, since this is not a drawback, this is the actual intent of the client-side frameworks.

Regarding response request headers, you can only access AJAX request headers

The following are solutions to these problems : -

• If you use tomcat or any container application to serve the application or hosting the angular code, you can use the HTML JSP code, since the JSP is processed in the html container package before passing it to the client side .I think this solution will work in your case based on my conclusion from your question.
• Otherwise, configure a service that processes success and failure handlers from the authentication server, and from angular you need to poll the feed to get the request header value.