window.location重定向有效，但浏览器历史记录中没有显示原始URL

Question

下面的代码运行良好。这是我的问题：窗口url重定向，但原始url没有记录在我的浏览器历史记录中。

例如，如果我访问"http://example.com/page1"，浏览器重定向到"http://example.com/test"，因为它应该。但是，我需要访问的原始url("http://example.com/page1")显示在我的浏览器历史记录中，这样我就可以在不同的功能中调用它。

在重定向之前，有没有办法让访问的原始url登录到我的浏览器历史记录中？

<!-- script to enable age verification cookies and ensure people have age checked -->
<script type="text/javascript">
$(document).ready(function(){
if (window.location =="http://example.com/home") {//do nothing
} else {
window.location = "http://example.com/test";
}
});
</script>

Answer 1

我认为您需要的是window.location.href。这会将以前的URL添加到浏览器历史记录中。

Answer 2

我自己也遇到过这种行为，这是因为我通过文件系统将页面加载到chrome中，即使用file://协议。我启动了一个HTTP服务器，并使用它来保存历史记录。

Answer 3

tl；博士，给我看看代码

var newUrl = "https://example.com.page2";
// Navigate to newUrl, adding a new entry to the Browser History
window.location.assign(newUrl);
window.open(newUrl, "_top");

带历史记录的JavaScript浏览器导航

至少有两种方法可以在保留浏览器历史记录的同时导航(重定向)。使用Vanilla JavaScript，其中一个可能就是我们正在寻找的：

1. 最简单：window.location.assign()-浏览器窗口API中位置对象的一部分
2. 最强大:window.open()-浏览器窗口API的一部分。window.open()比location.assign()强大得多，因为它不仅可以影响当前浏览器选项卡，还可以在<iframe>中使用，控制要控制的浏览上下文(选项卡、窗口或iframe)，以及更改窗口功能，包括窗口的默认大小和位置、是否打开最小弹出窗口等选项

请记住，window.open()存在警告和可用性/用户体验问题，因为它可以打开弹出窗口-与大多数浏览器阻止(Chrome、Firefox)的弹出窗口完全相同，因为广告商/垃圾邮件发送者滥用(d)window.open()提供的功能。如果使用得当，它仍然是一个可行的API。

浏览器历史记录也可以通过浏览器历史记录API直接管理和控制，包括读取、修改现有历史记录条目和添加新的历史记录条目。但是，历史API不控制导航，并且不能用于重定向。它经常与单页应用程序一起使用，如AngularJS、React、Vue.js、Svelte等。

以下大部分文本/描述直接来源于MDN Web文档。有关详细信息，请参阅附带的链接。我对MDN API参考资料中的描述和示例进行了轻微修改，使其与所问的问题更加相关。

window.location.assign()

来源/参考：https://developer.mozilla.org/en-US/docs/Web/API/Location/assign

window.location.assign()方法使窗口加载并显示指定URL处的文档。在导航发生之后，用户可以通过按下"window.location.assign()"键导航回称为CCD_11的页面；背面"；按钮

如果由于安全冲突而无法进行分配，则会抛出SECURITY_ERROR类型的DOMException。如果调用方法的脚本的来源与Location对象最初描述的页面的来源不同，则会发生这种情况，主要是当脚本托管在不同的域上时。

如果提供的URL无效，则抛出SYNTAX_ERROR类型的DOMException。

window.location.assign()语法

window.location.assign(url)

window.location.assign()参数

url：是一个字符串，包含要导航到的页面的URL。

window.location.assign()示例

var newUrl = "https://example.com.page2";
// Navigate to newUrl, adding a new entry to the Browser History
window.location.assign(newUrl);

window.open()

来源/参考：https://developer.mozilla.org/en-US/docs/Web/API/Window/open.

⚠️注意：我只包含了与极其多变的window.open()方法相关的极少量信息。我强烈建议您查看window.open()的完整文档。

Window界面的open()方法将指定的资源加载到指定名称下的新的或现有的浏览上下文(即选项卡、窗口或<iframe>)中。

window.open()语法

open()
open(url)
open(url, target)
open(url, target, windowFeatures)

window.open()参数

url:可选

指示要加载的资源的URL或路径的字符串。如果指定了空字符串("")或省略了此参数，则会在目标浏览上下文中打开一个空白页面。

target:可选

一个没有空格的字符串，指定资源加载到的浏览上下文的name。如果名称不能识别现有上下文，则会创建一个新上下文，并为其指定名称。还可以使用特殊的target关键字，_self、_blank、_CCD.29和_top。

此名称可以用作<a>或<form>元素的target属性。

windowFeatures:可选

一个字符串，包含以逗号分隔的窗口功能列表，格式为name=value，或者对于布尔功能，仅为name。

⚠️注意：有关"窗口功能"的完整参考，请参阅window.open()语法。

window.open()返回值

WindowProxy对象。返回的引用可以用于访问新窗口的属性和方法，只要它符合同源策略的安全要求。

window.open()描述

Window接口的open()方法将URL作为参数，并将其标识的资源加载到新的或现有的选项卡或窗口中。目标参数确定将资源加载到哪个窗口或选项卡，windowFeatures参数可用于控制新窗口的大小和位置，并将新窗口作为具有最少UI功能的弹出窗口打开。

请注意，远程URL不会立即加载。当window.open()返回时，窗口始终包含about:blank。URL的实际获取被推迟，并在当前脚本块完成执行后开始。窗口的创建和引用资源的加载是异步完成的。

window.open()基本示例

为了回答这个问题，window.open()的最小形式是浏览到一个新的URL，在相同的浏览器选项卡中，保留浏览器导航历史记录。

var newUrl = "https://example.com/page2";
// Navigate to newUrl, adding a new entry to the Browser History
window.open(newUrl, "_top");