Javascript：使用 location.assign 后全局变量变为空

Posted 2023-02-16

【中文标题】Javascript：使用 location.assign 后全局变量变为空

【英文标题】：Javascript : Global variables become null after using location.assign

【发布时间】：2014-05-25 11:55:08

【问题描述】：

我用这种方式有2个html和3个js文件

globals.js --> 
    testIndex = 1;

login.html
    //includes global.js and login.js. Fires event() function on a button click

login.js
    function event()
     
         window.testIndex = 2;
         window.location.assign('index.html')
    

index.html
    //includes globals.js and index.js
    fires init() function onLoad

index.js
    function init()
    
         alert(window.testIndex);
    

分配工作正常，但 index.html 中的警告框始终显示为 1。当我使用 window.location.assign 时，我的全局变量正在重新初始化。我需要传递一些变量（其中一些不是纯文本字符串，所以不能使用 url）。我该怎么办？

【问题讨论】：

我试过这个：在 global.js 中使用了 window.testIndex = 1 尝试在 index.html 中删除 global.js 的包含（认为在同一个窗口中再次包含该文件可能会产生问题）

一些浏览器已经有一个 window.event 属性，它引用了最后创建的 event 对象。通常。所以创建一个名为 event 的函数并不是一个好主意。 ;-)

你设置一个全局属性，然后加载一个不同的文档，这将创建一个新的全局（窗口）对象。

是的。那么如何在不同的文档中维护一些变量呢？顺便说一句， event() 只是一个例子。这些不是真正的函数名称。

【参考方案1】：

在多个页面中保存变量的最简单方法是使用 HTML5 sessionStorage。但是，此功能仅在现代浏览器 (IE8+) 中可用。 请参阅 here (html5polyfill.com) 了解适用于旧版浏览器的 polyfill。

更多关于 sessionStorage 的信息可以在here (MDN)找到。

sessionStorage 示例：

globals.js --> 
    sessionStorage['testIndex'] = 1;

login.html
    //includes global.js and login.js. Fires event() function on a button click

login.js
    function event()
     
         sessionStorage['testIndex'] = 2;
         window.location.assign('index.html')
    

index.html
    //includes globals.js and index.js
    fires init() function onLoad

index.js
    function init()
    
        alert(sessionStorage['testIndex']);
    

如果您需要存储非字符串对象，请先使用JSON.stringify() 将它们转换为它们的字符串表示形式，然后使用JSON.parse() 将它们读回。

【讨论】：

嗨 Tribex，感谢您的回答。这类似于我刚刚发现的 localStorage 以及我正在寻找的那种。但是我确实需要传递对象。所以我使用了字符串化和解析。但是在第二个 html 文件中，解析后，当我尝试调用该对象的函数时，萤火虫说没有这样的函数。

没问题！我只是在做一个使用 localStorage 的项目。而且我很遗憾地说，JSON 是一种数据交换格式，因此无法存储函数。考虑到这一点，您永远不必存储函数，只需存储数据。如果你真的必须，把函数写成一个字符串（然后你可以存储和检索）并使用eval()解析它。

好的。明白了。无功能存储。但后来我又无处可去。问题是我有 websocket 对象，它在 login.html 中与服务器建立连接。打开 websocket cconnection 后，我想将此 websocket 对象传递给我的 index.html 并使用它将数据（令牌）发送到服务器。现在，如果我不能将函数定义和全部传递给 index.html，那么我该如何使用它的方法来发送数据。

我对WebSockets做的不多，但是你不能创建一个新的连接吗？ （我认为您有充分的理由不这样做）Here 是一个解决您的问题的 SO 问题。

创建新的身份验证连接意味着再次发送登录凭据。这不会是最佳的。那里没有 login.html 的意义。我也可以将用户名和密码传递给 index.html 并只在那里创建一个连接......