为什么无法在我的本地apache2服务器中加载js文件？

Question

在我的本地域的网页中，两者
jq.src = "https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.js";
jq.src = http://127.0.0.1/js/jquery-3.3.1.min.js
可以加载。

在stackoverflow的网页中，右键单击以进入chrome的inspect--console。

const jq = document.createElement('script');
jq.src = "https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.js";
document.head.appendChild(jq);
jq.addEventListener('load', () => {
  console.log("hello world");
  console.log($ === jQuery);
});

可以加载远程jquery.js文件，现在将其替换为本地js文件-http://127.0.0.1/js/jquery-3.3.1.min.js。
为什么无法在我的本地apache2中加载js文件？

Answer 1

您要访问的站点可以为JavaScript应用安全策略-包括调试器。我认为您所看到的是与您访问的网页相关联的内容安全策略的应用。

您可以在页面标题中看到它。在Chrome（以explained here的形式）中，您可以查看随页面发送的html标头：

打开开发人员面板，选择“网络”标签，然后重新加载页面。

对于stackoverflow，请在“名称”列下查找“ stackoverflow.com”-如果最初是通过http加载的，则可能会有两个，因此找到一个是https-可能是第二个。单击一个，然后选择右侧的“标题”标签。您将在响应标题中看到以下内容：

content-security-policy: upgrade-insecure-requests

这是here的说明。

基本上，它告诉浏览器所有http请求都应该“升级”为https。因此，当您尝试访问http://127.0.0.1/...时，浏览器会将请求升级到https://127.0.0.1/...，您的本地服务器可能未设置为处理该请求。

这不仅限于Chrome浏览器-所有现代浏览器should do this。

例如，我浏览了一些使用Safari的网站，并且在某些情况下，收到了错误消息，例如在GitHub上：

Refused to load https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.js because
it does not appear in the script-src directive of the Content Security Policy.

这是您可以阅读的关于here的另一种内容安全策略。

Answer 2

尝试 jq.setAttribute('src',"https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.js"); jq.setAttribute('crossOrigin',"Anonymos") jq.onload=onFinish;