window.location.href 导致referer丢失

`window.location.href` 是JavaScript中用于获取或设置当前页面URL的一个属性。当你直接使用它来改变页面地址，比如 `window.location.href = 'new-url.com';` 时，通常浏览器会发送一个新的HTTP请求到新的URL，这个请求被称为"直接链接"，不会包含来源（即referrer）信息，因为这种跳转不是通过点击超链接或表单提交等常规用户交互产生的。

如果你需要保留当前页面的 referer 或者是为了跟踪来源，可以考虑使用其他方法，如：

1. 使用`<a>`标签的`href`属性，并让用户的点击触发跳转，这样就会自动携带referrer：

<a href="new-url.com" rel="noopener noreferrer">点击跳转</a>

2. 如果是在服务器端进行重定向，可以将referer信息作为查询字符串或cookie的一部分传递。

3. 使用JavaScript的Fetch API或者其他库（如axios），它们提供更精细的控制，可以在发起请求时手动添加头信息，包括referer：

fetch('new-url.com', {headers: {'Referer': document.referrer}});

相关问题

window.location.href附带headers

window.location.href是JavaScript中的一个属性，用于获取或设置当前页面的URL地址。它返回一个字符串，包含了完整的URL地址，包括协议、域名、端口号、路径和查询参数等信息。

然而，window.location.href并不能直接附带headers。headers是HTTP请求中的一部分，用于传递额外的信息给服务器。在浏览器中，headers通常是由浏览器自动添加的，包括User-Agent、Referer等。

如果你想在发送HTTP请求时附带headers，可以使用XMLHttpRequest对象或fetch API来发送请求，并在请求的headers中添加自定义的headers。下面是一个使用XMLHttpRequest对象发送带有自定义headers的请求的示例：

var xhr = new XMLHttpRequest();
xhr.open('GET', window.location.href);
xhr.setRequestHeader('Custom-Header', 'value');
xhr.send();

在上述示例中，我们通过调用`setRequestHeader`方法来设置自定义的header，然后通过`send`方法发送请求。

如果你使用的是fetch API，可以使用Headers对象来设置headers。下面是一个使用fetch API发送带有自定义headers的请求的示例：

fetch(window.location.href, {
  headers: {
    'Custom-Header': 'value'
  }
})
  .then(response => {
    // 处理响应
  })
  .catch(error => {
    // 处理错误
  });

在上述示例中，我们通过传递一个包含自定义headers的对象作为fetch函数的第二个参数来发送请求。

window.location.href携带请求头

在浏览器环境下，window.location.href属性用于获取或设置当前页面的 URL。它返回一个字符串，表示当前页面的完整 URL 地址。

根据浏览器的同源策略，JavaScript代码只能访问与当前页面具有相同协议、主机和端口的资源。因此，通过window.location.href发送请求时，请求头是无法直接设置的。请求头是在发送HTTP请求时由浏览器自动添加的，包含诸如User-Agent、Referer、Accept等信息。

如果你想在发送请求时设置自定义的请求头，可以使用XMLHttpRequest对象或fetch API。这两种方法都允许你手动设置请求头。例如，使用XMLHttpRequest对象发送GET请求并设置自定义请求头的示例代码如下：

var xhr = new XMLHttpRequest();
xhr.open('GET', 'https://example.com', true);
xhr.setRequestHeader('Custom-Header', 'header value');
xhr.send();