Polymer app-route: intercept refresh page

Question

I am struggling with getting out of the current situation: we have a polymer SPA (A) deployed on a certain server and bound to a certain url: http://example.com/A, we do need to show legacy pages of the old application for the time being, in order to do so, a new application (B) has been developed and bound to a different url (http://example.com/B).

What B does is to frame the pages of the legacy app and exposing a button whose aim is to go back to the previous location by accessing the document.referrer value and reloading the page, problem is that being A an SPA, the URL does not exist on the server.

More in detail:

1. The user logs in the application A (http://example.com/A/overview)
2. The user uses the SPA and ends up on a certain url managed by the routing (http://example/A/stuff/we/sell/jackets)
3. In the page http://example.com/A/stuff/we/sell/jackets there is a link to the application B, framing the legacy application's page showing the jackets
4. The user clicks the link and goes to http://example.com/B/legacy/jackets, at this moment the document.referrer equals http://example.com/A/stuff/we/sell/jackets
5. The user clicks on the button to close the view, application B sets the location of the window to the document.referrer attempting to land the user from where he/she came from.
6. Being the application A an SPA the url http://example.com/A/stuff/we/sell/jackets does not exist on the server and the user gets (correctly) a 404.

So the question is: is there any way to intercept the change of the window.location variable in the app routing to avoid the full refresh of the page and land the user in the page where the link was?

Britnibrito

Answer 1

If I understand this correctly then this seems to be a problem with your server configuration.

If you do have an SPA you want all URL to go to your app-shell (usually your index.html).

Example:

http-root
├─ some-folder
│  └─ index.html
└─ index.html

If you have for example an apache running you can go to:

• http://example.com/index.html
• http://example.com/some-folder/index.html

If you go to http://example.com/stuff/we/sell you will get an error as stuff is not a valid directory.

In your SPA you will probably have some routing system that will move you around and does changes to the Url without ever doing a reload. So if you use your SPA and then do a real reload you should still end up at the place you were before.

How that will work depends on your server. For apache, for example, you can provide rewrites via .htaccess.

<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /
RewriteRule ^index\.html$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.html[L]
</IfModule>

Using this no matter what your url is you will always end up at the http-root index.html. Then your SPA can take over; read the url and show the appropriate data.

imho solving this on the server is the appropriate solution to your problem.

Neves

That is correct, the point is that the SPA needs to know where the user was at the moment he/she went on the frame-app in order to 'restore' the routing . in your specific example (which is correct as-is): the user would be back at the index.html page (in my original question: example.com/A/overview), whitout the SPA knowing that the user was in (keeping reference to my question) example.com/A/stuff/we/sell/jackets. – Britnibrito

apparently I still don't really understand what u try to do? you end up here right? http://example.com/A/stuff/we/sell/jackets so apache says it's not a valid file but hey I have a "catch" all thing... so I will just send you the content of index.html but leave the url as is... then your SPA get's started as normal reads the url and can decide what to show... what should solve your problem right? if not maybe you can describe it in a different way? maybe some screenshots? also not sure what a you mean by "close a view" is it a dialog? – Neves

apologies if it was not clear.. I miss tho, in your new comment, how can you do that: so I will just send you the content of index.html but *leave the url as is* – Britnibrito

that really depends on the server system you are using. e.g. in the above example for apache you can go to http://example.com/something/new/ but you will still get the HTML from http://example.com/index.html – Neves

Answer 2

I do agree with @daKmoR actually you should never recive 404 form the server - you could get that from polymer app.

Get a file and if it doesn't exist then try index. It looks different in each server. What server you are using ? I can help with IIS and nginx.

Impenitent