我尝试在本地主机上使用fetch，但它不工作。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<script>
fetch("hi.txt").then(function(response){
response.text().then(function(text){
alert(text)
})
})
</script>
</body>
</html>
hi.txt文件与脚本文件在同一文件夹。
下面的错误显示在控制台中:
index.html:12 Fetch API cannot load file:///C:/~~~~/hi.txt. URL scheme "file" is not supported.
(~~~)是路径
因为你的URL是相对的(它只是"hi.txt")，它是针对页面的URL解决的代码正在运行。在您的示例中，这似乎是file:///something—也就是说，您直接从文件系统加载的文件，而不是通过从服务器请求它。Chrome不允许从file方案中抓取。file方案的起源是null。Chrome团队对同源策略的解释是，没有一个源，甚至它自己，应该匹配null。(在我看来这是一个合理的解释，但是意见可以不同。)
当进行web开发时，您希望通过服务器进程工作，因为直接从文件系统加载的页面与从服务器加载的页面在几个有时是微妙的方式上表现不同。
有几种方法可以做到这一点:
- 使用IDE的特性(如果使用的话)和/或对其进行扩展。例如，对于VSCode，有"live server"扩展，可以很容易地从一个最小的服务器运行你的代码。
- 使用本地运行的实际web服务器进程。有简单的，很容易安装。
- 使用各种"快速启动"脚手架工具，通常通过
npm(和Node.js)为您设置简单的项目，您可以使用一个命令在开发模式下本地构建和运行项目。
嗨，你是这样运行文件的-右键单击HTML文件，打开浏览器。这样你就告诉浏览器从你保存的文件位置打开你的html文件。检查你的浏览器url栏，你会得到这样的东西:C:/xampp/htdocs/xyz.html所以这是你的本地目录文件系统。所以现在你必须首先启动你的服务器，如xampp或任何你已经安装的服务器，然后你输入这个localhost/filename或/子文件夹名和/文件名，如果你已经存放在子文件夹…然后按回车键。简而言之，你需要向服务器查询就像在PHP文件中调用.....
一样您可以创建一个本地web服务器(XAMPP)并在那里上传您的hi.txt文件。如果您这样做了，请替换
fetch("hi.txt")
fetch("http://127.0.0.1/hi.txt")