Some time ago, I needed to obtain the source of the page through JavaScript. This operation is very simple. You can get it by using document.referrer. However, there are still many unexpected situations in actual applications, so let’s briefly sort it out here.
The first problem I encountered is that after going from the HTTPS page to the HTTP page, the value of document.referrer is empty. For security reasons, some important pages of many websites (such as Taobao’s login page) use the HTTPS protocol. If a user who is not logged in clicks on the link to page B (HTTP page) on page A (HTTP page), but page B requires the user to log in, so he jumps to the login page (HTTPS page), and then jumps back to B (HTTP page) after logging in, you will find that document.referrer cannot be retrieved on page B. In other words, if you want to restore the user access path according to referrer, if there is an HTTP page and an HTTPS page in the path, then the path will be broken from HTTPS to HTTP.
The root of this problem is the browser's security policy, and there seems to be no particularly good solution to rely on JavaScript alone. A roundabout idea is to use window.name, write the url of the current page into window.name on the HTTPS page, and then read it on the next page (HTTP page).
In addition to this situation, can the document.referrer be retrieved normally by jumping other pages? I searched and found that someone has compiled a list here, but it is not very complete, such as the case of IE6 that is not included. So I did it myself, installed N browsers in the virtual machine, and tested all the situations (it was really a physical job), and the results were shown in the table below:
| operate | IE6 | IE7 | IE8 | IE9 | Firefox | Chrome | Opera | Safari |
|---|---|---|---|---|---|---|---|---|
| Enter the URL directly in the address bar | "" | "" | "" | "" | "" | "" | "" | "" |
| Access URL from bookmark | "" | "" | "" | "" | "" | "" | "" | "" |
| Click the hyperlink from page A and jump to page B (target=”_self”) | √ | √ | √ | √ | √ | √ | √ | √ |
| Click the hyperlink from page A and jump to page B (target=”_blank”) | √ | √ | √ | √ | √ | √ | √ | √ |
| Right-click the hyperlink from page A and open page B in a new tab | - | √ | √ | √ | √ | √ | √ | "" |
| Right-click the hyperlink from page A and open page B in a new window | √ | √ | √ | √ | √ | √ | √ | "" |
| Drag the link to the address bar | "" | Unable to drag | Unable to drag | "" | "" | "" | "" | "" |
| Drag the link to the tab bar | - | "" | "" | "" | "" | "" | "" | "" |
| Use the browser's forward and back buttons | √ | √ | √ | √ | √ | √ | √ | √ |
| JS modify location.href | "" | "" | "" | √ | √ | √ | √ | √ |
| JS uses window.open | "" | "" | "" | "" | √ | √ | √ | √ |
| Server redirection (302 jump) | Targeting the previous page | Targeting the previous page | Targeting the previous page | Targeting the previous page | Targeting the previous page | Targeting the previous page | Targeting the previous page | Targeting the previous page |
| Page Meta Refresh | "" | "" | "" | "" | "" | Turning page | Turning page | Turning page |
The "√" in the above table means that the referrer can be retrieved normally, "" means that the referrer is empty.
Except for IE, other browsers are the latest versions that can be downloaded on the official website. Among them, Safari tested both the Windows version and the Mac version, and the conclusion is the same.
There are also some cases where no tests have been done, such as whether the referrer can be maintained under each browser when clicking Flash to jump.
Most of the situations in the above table are in line with expectations, but there seem to be several things to pay attention to:
1. In Safari, right-clicking to open the link will cause the referrer to be lost;
2. In IE, modifying location.href or using window.open to open the page will lose referrer (there is an exception in IE 9, using location.href to jump will not lose referrer);
3. When using meta jump, referrer will be lost under IE/Firefox.
Finally, a simple conclusion is: if you need to access the source through the document.referrer collection page, it is best not to use JS to jump or open a new window, nor to use meta to jump.