javascript - ajax 加载页面上的 JS 与服务器端代码和 HTML 不同步

Question

我有一个主要使用 AJAX 调用加载的网站。 javascript 和 CSS 文件仅在页面首次加载时加载一次。

我的问题是 javascript/CSS 可能与 HTML 和服务器端代码不同步。该页面可以使用旧版本的 javascript 文件(从页面首次加载时开始)，而服务器端代码和 ajax 加载的 HTML 文件始终使用最新的代码和文件。

处理这个问题有哪些策略？

我考虑过按设定的时间间隔轮询服务器并询问是否有更新版本的 JS。然后，如果有，则重新加载页面。但是，这似乎会变得丑陋，页面会在尴尬的时刻突然重新加载，而不是例如由于用户发起的调用而重新加载。

此外，对 javascript 进行了一些更改，但不一定需要重新加载页面。例如，更改可能会影响与用户所在页面/模块不同的页面/模块。

在每次 Ajax 调用时重新加载 javascript 是不可行的

我可以想象出丑陋的解决方案，但我想我应该先问一下。

编辑(回应评论和建议的答案)

让 JS 恢复同步的唯一方法是重新加载页面，然后页面加载新的 JS。向旧页面添加新的 JS 是行不通的，因为它不会删除任何旧的函数、监听器等。我不是在问如何重新加载页面或如何加载 javascript。我要求一种知道何时执行此操作的策略，尤其是以一种对用户来说不显得尴尬的方式。人们是否会加入轮询来询问是否有新的 JS 版本？然后他们会突然(从用户的 Angular )重新加载页面吗？即使选项卡隐藏，他们也会进行轮询吗？这是服务器的问题吗？他们在哪里跟踪最新所需的 JS 版本？或者，他们是否会询问每个 AJAX 请求 - 嘿，我应该重新加载吗？他们为此编写了一个特殊的函数吗？他们是否使所有新的 html/服务器代码向后兼容 js？

有人处理过这个问题，你是怎么做的？

Answer 1

两种可能的解决方案包括

• 调用 $.getScript() 从服务器端检索、更新 document 中的变量以匹配 document 中的变量在调用 $.ajax(/* settings */) 之前；

• 或者可以使用 Web Workers 更新原始 document 变量，以匹配 $.ajax(/* settings * 的 beforeSend 处的服务器端变量/)

在任一方法的第一步的结果中，中止 $.ajax() 调用，调用错误处理程序，通知用户，向服务器发送有关错误的消息。