窗口位置重定向起作用，但原始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>

- user1546779

---

在更改位置之前将其保存在全局变量中怎么样？或者您可以使用目标为_self或_top的window.open。 - MrOBrian

我可能会在哈希或查询字符串中传递它。 - Blazemonger

抱歉，当涉及到jQuery / JavaScript时，我有点业余...我该如何将其保存为全局变量或将window.open作为_self或_top目标？在重定向之前使用这两种方法之一是否可以确保原始URL保存在浏览器的历史记录中？非常感谢帮助新手。 - user1546779

@MrOBrian，我刚试了一下，也没用。由于某种原因，它无法将原始URL加载到浏览器的历史记录中... window.open('http://www.example.com/test','_self','', false); - user1546779

@MrOBrian 我在Chrome和Safari中进行了检查。它们都没有在历史记录中保存原始URL。这是我的代码的另一个版本...你注意到还有其他可能导致这种情况发生的问题吗？ `<script type="text/javascript"> $(document).ready(function(){ if (window.location =="http://example.com/") { } else { window.open('http://example.com/test','_self','', false); } }); ` - user1546779

Answer 1

我认为你需要的是window.location.href。它将前一个URL添加到浏览器历史记录中。

- Silver Gonzales

---

在其他地方阅读时，似乎将window.location设置为与设置window.location.href基本相同。是否有文档记录的区别？ - Cincinnati Joe

Answer 2

我曾经遇到过这种情况，因为我通过文件系统加载页面到Chrome中，即使用file://协议。我启动了一个HTTP服务器，并使用它来保留历史记录。

- 1j01

Answer 3

简而言之，只要给我代码。

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() - 位于 Location 对象中的一部分，属于 浏览器窗口 API。
2. 最强大：window.open() - 位于 浏览器窗口 API 中。 window.open() 比 location.assign() 更加强大，因为它不仅可以影响当前浏览器选项卡，还可以在 <iframe> 中使用，控制要控制的 浏览上下文（选项卡、窗口或 iframe），以及更改 窗口特性 - 包括诸如窗口的默认大小和位置、是否打开最小化弹出窗口等选项。

请记住，window.open() 存在注意事项和可用性/用户体验问题，因为它可以打开弹出窗口——大多数浏览器阻止的确切相同的弹出窗口（Chrome，Firefox），因为广告商/垃圾邮件发送者滥用了 window.open() 提供的功能。当正确使用时，它仍然是一个可行的API。

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

下面大部分文本/描述都直接来自MDN Web Docs。请参阅附带的链接获取更多信息。我已稍微修改了 MDN API 参考中的描述和示例，使其更相关于所提出的问题。

window.location.assign()

来源/参考：https://developer.mozilla.org/en-US/docs/Web/API/Location/assign < p > window.location.assign() 方法会导致窗口加载并显示指定URL的文档。导航完成后，用户可以通过按“返回”按钮返回调用 window.location.assign() 的页面。

如果由于安全性问题而无法进行分配，则会抛出 SECURITY_ERROR 类型的{{link2： DOMException }}。当脚本的源与最初由{{link3： Location }}对象描述的页面的源不同时，这种情况通常发生在脚本托管在不同域上时。

如果提供的URL无效，则会抛出 SYNTAX_ERROR 类型的{{link2： 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: 可选

一个字符串，不含空格，指定正在加载资源的浏览上下文的名称。如果名称未标识现有上下文，则创建一个新上下文并赋予指定的名称。也可以使用特殊的 target 关键字，包括 _self、_blank、_parent 和 _top。

这个名称可以用作<a>或<form>元素的target属性。 windowFeatures：可选项

一个字符串，其中包含以name=value形式表示的逗号分隔的窗口特性列表，对于布尔特性，只需使用name即可。

注意：请参阅window.open()语法以获取Window Features的完整参考。

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");

- Rick B

---

只是好奇，window.location.assign(newURL)和window.location = newURL是否产生完全相同的效果？ - Tommy Tang