服务器端302重定向后如何设置document.referrer？

为啥会出现这种情况 #

浏览器有严格的Referer安全规则：如果www.y.com和www.x.com协议不一致（比如一个HTTP一个HTTPS），跨协议重定向时浏览器会自动清空Referer；另外，你之前给服务A的请求加Referer头没用，因为页面的document.referrer是浏览器根据跳转链路自动生成的，不是服务端能直接修改的。

能解决的几种办法 #

1. 统一两个域名的协议（最靠谱） #

把www.y.com和www.x.com都改成HTTPS。协议一致的情况下，浏览器默认会保留跳转来源，www.x.com页面的document.referrer就会自动显示www.y.com。

2. 给服务A的302响应加Referrer-Policy头 #

在服务A返回302重定向的时候，同时返回Referrer-Policy: strict-origin-when-cross-origin（或者更宽松的origin-when-cross-origin、unsafe-url），让浏览器知道跨域重定向时要保留Referer。
比如用Nginx配置的话：

location / {
    return 302 https://www.x.com;
    add_header Referrer-Policy "strict-origin-when-cross-origin";
}

3. 用JS跳转代替302重定向 #

如果改不了协议或者服务A的响应头，就让服务A返回一个带JS跳转的HTML页面，这样浏览器会正常传递Referer：
页面代码示例：

<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="refresh" content="0; url=https://www.x.com">
    <script>
        window.location.href = "https://www.x.com";
    </script>
</head>
</html>

4. 手动在跳转URL里带来源参数 #

要是上面的方法都用不了，就在服务A的重定向地址里加个来源参数，比如把Location改成https://www.x.com?from=www.y.com，然后在www.x.com的页面里用JS读取这个参数：

const from = new URLSearchParams(window.location.search).get('from');
// 之后可以用这个from值代替document.referrer的作用

内容的提问来源于stack exchange，提问作者Uri Amiel t