javascript 尝试使用导入的js函数启动html页面时出现“从源”null“访问脚本已被CORS策略阻止”错误

clj7thdc 于 2023-01-11 发布在 Java

关注(0)|答案(5)|浏览(877)

我得到了这个错误，而试图启动一个html页面使用的javascript文件导入一个函数从另一个文件：

Access to script at 'file:///C:/Users/bla/Desktop/stuff/practice/jsPractice/funcexecute.js' 
from origin 'null' has been blocked by CORS policy: 
Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https.

Failed to load resource: net::ERR_FAILED

下面是html代码：

<!DOCTYPE html>
<html>
<head>
    <meta charset='utf-8'>
    <meta http-equiv='X-UA-Compatible' content='IE=edge'>
    <title>Page Title</title>
    <meta name='viewport' content='width=device-width, initial-scale=1'>

</head>
<body>
    <script type = 'module' src='funcexecute.js'></script>

</body>
</html>

js文件，该文件是从html：（执行函数. js）

import sumup from '/funcfile.js';
console.log(sumup(1,2));

导入模块：（函数文件. js）

function sumup(num1, num2){
    return num1+num2;
}
export default sumup;

我该如何解决这个问题？（即时通讯使用vscode）

JavaScript

来源：https://stackoverflow.com/questions/59912641/access-to-script-from-origin-null-has-been-blocked-by-cors-policy-error-whil

5条答案

按热度按时间

dauxcl2d1#

如果不使用服务器，则不能将脚本文件用作模块。Take a look here

以下是一些选项

使用Live Server（VS代码扩展）
从节点使用http-server模块（通过npm安装，然后从项目目录运行http-server .）
使用来自python的http.server包
使用wamp（或lamp）服务器

简而言之，不能将type="module"与 file 协议一起使用

赞(0）回复(0）举报 2023-01-11

v1l68za42#

右键单击Visual Studio代码中的 index.html 文件，选择使用Live Server打开。
这将解决您的问题。
JS中的导出/导入只能在服务器上工作，它们不能在本地机器上工作（有不同的代码）。
我已经在我的YouTube频道上创建了一个循序渐进的video。

赞(0）回复(0）举报 2023-01-11

j2cgzkjk3#

type = "module"通常与webpack一起使用。
1.如果不使用Webpack，则需要启动静态服务
u可以使用http-server -p 8003启动服务

赞(0）回复(0）举报 2023-01-11

6psbrbz94#

导致此问题的原因是正在直接打开该文件;所以似乎有几种方法可以解决这个问题。一个是禁用Chrome的安全性，尽管我尝试了很多次，但我还是无法让它放弃这个幽灵：我围绕Chrome的-disable-web-security标记尝试了各种组合。
第二种选择是在本地托管站点，有那么一小会儿我考虑过使用IISExpress;但幸运的是，我偶然发现了这个工具，它为您在本地托管了一个站点。
它可以作为npm包安装：npm install--global http-server安装后，只需导航到相关目录，然后键入http-server：

C:\repos\webanimations\animated-columns-optimised>http-server
Starting up http-server, serving ./
Available on:
  http://192.168.1.79:8080
  http://127.0.0.1:8080
  http://172.17.230.225:8080
Hit CTRL-C to stop the server

然后，您可以导航到特定页面;例如：

http://127.0.0.1:8080/columns

而且没有更多的CORS错误（还不太起作用，但这是一个完全不同的故事）。

赞(0）回复(0）举报 2023-01-11

cvxl0en25#

将脚本链接中的type="module"替换为type="JavaScript"。

赞(0）回复(0）举报 2023-01-11

我来回答

javascript 尝试使用导入的js函数启动html页面时出现“从源”null“访问脚本已被CORS策略阻止”错误

5条答案

相关问题

热门标签

最新问答