vivo 浏览器无法加载 js 的原因

使用 vivo 自带浏览器加载 H5 页面时，遇到 JS 无法加载的问题。H5 页面代码如下：

<!-- 省略 -->
<script src="https://cdn.bootcdn.net/ajax/libs/blueimp-md5/2.18.0/js/md5.js"></script>
<script src="https://ajax.aspnetcdn.com/ajax/jquery/jquery-3.5.1.min.js" type='text/javascript'></script>
<script type="text/javascript" src="./index.js"></script>
<!-- 省略 -->

// index.js
$(document).ready(function () {
    // ... 
});
// ... 

检查不同手机的结果后发现，vivo 浏览器中仅执行了第一行 alert 语句 (加载script)，而其他部分代码（包括 JS 文件的内容）均未执行。

原因解析

检查抓包时发现报了 304 错误，即请求内容无需再次传输，可直接使用缓存的内容。这可能是因为 vivo 浏览器使用了缓存，导致 JS 文件未重新加载。

解决方案

为了解决此问题，可以采取以下两种方法：

• 配置服务器禁止缓存：在服务器端配置相关规则，禁止缓存 JS 文件。
• 使用时间戳：在 JS 文件 URL 后面添加时间戳，例如：

url + '?t='+ (new Date()).getTime().toString();

这样，每次请求 JS 文件都会带上不同的时间戳，可以绕过缓存。

其他可能原因

除了缓存问题外，还有一种可能是 vivo 浏览器出于安全考虑禁止了 JS 的加载。在这种情况下，建议在 vivo 手机上安装 Edge 浏览器，尝试是否可以正常加载 JS。