Read header parameters in url from webapi in angular 4

Question

I have a website http://header.com which calls API to save some data and return URL of website http://post.header.com with header parameters. The application in http://post.header.com should read the headers from url returned from API. Tried using cookies and localstorage but none of them worked (empty) I want to hide the parameters from URL. Please suggest me

Answer 1

If I understand the question correctly you are trying to achieve the following scenario:

1. User opens http://header.com (Web1) in a web browser and POSTs some data to your API.
2. The API returns a URL as the response and some parameters.
3. The web application on Web1 takes the URL and redirects the browser to http://post.header.com (Web2) (or opens it in a new tab/window).
4. Web2 shall use the parameters from the result that was returned by the API and do something with them.
5. At no point do you want to have those parameters in the browser's address bar.

If my understanding is wrong, please ignore the rest of this answer. In that case, please edit your question and describe the scenario in more detail.

These are the facts that have to be considered when trying to solve this:

1. Because you are using different domains, LocalStorage will not be shared between them (as you've found out), so it cannot be used to send parameters. See here: In HTML5, is the localStorage object isolated per page/domain?
2. You cannot send HTTP headers with a URL to be opened in a web browser. That is simply not how browsers work.
3. Originally Cookies were not designed to be shared among different domains but this changed. You should be able to set the domain header.com in the Cookie and subdomains (e.g. post.header.com) should be able to use it. See here for details: Share cookie between subdomain and domain

Possible solution / work arounds:

1. You can try the cookie option by setting the Domain (see above point 3).
2. If you can open Web2 in a new tab/window (instead of redirecting the current window), then Web1 can use window.postMessage to send messages (and parameters) to Web2. Web2 can use a listener to react to that message. Example code here: How can I send an event from parent window to its child window?
3. You can use a cache (e.g. MemoryCache) in your Web API and store Key-Value-Pairs, i.e. Guid plus object with parameters. You would then return the Key to your client, which then redirects to http://post.header.com?key=<Key>. Web2 could use the key and get the parameters from the API. With this method you still have a URL parameter but the actual parameters are not part of the URL.