我有一些简单的代码试图发出 ajax 请求。我尝试使用 .txt 文件并发现 CORS 错误。然后我尝试使用带有 header("Access-Control-Allow-Origin: *"); 的 php 文件 因为我听说这是在任何浏览器上允许所有 ajax 调用的最简单方法。我浏览了许多 SO 帖子并到处搜索,似乎找不到解决方案。这是我的文件。我将包含 .txt 文件,但我已经明白为什么该文件不起作用。ajax-1.html<!DOCTYPE html><html><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Ajax 1 - Text File</title></head><body> <button id="button">Get Text File</button> <br><br> <div id="text"> </div> <script> //create event listenerdocument.getElementById('button').addEventListener('click', loadText);function loadText() { //create an object const xhr = new XMLHttpRequest(); //open - type, url/file, async t/f xhr.open('get', 'sample.php', true); console.log('READYSTATE: ', xhr.readyState); //OPTIONAL - used for loaders xhr.onprogress = function () { console.log('READYSTATE: ', xhr.readyState); } xhr.onload = function () { console.log('READYSTATE: ', xhr.readyState); if (xhr.status == 200) { // console.log(this.responseText); document.getElementById('text').innerHTML = this.responseText; } else { document.getElementById('text').innerHTML = 'Not Found'; } } xhr.onerror = function () { console.log('request error'); } //sends request xhr.send(); } </script></body></html>示例.php<?php header("Access-Control-Allow-Origin: *"); echo "Some Lorem ipsum text";?>样本.txtlorem ipsum这是 chrome 控制台显示的内容就绪状态:1ajax1.html:1 从源“null”访问“file:///Users/macbookuser/Desktop/traversy/ajax/sample.php”处的 XMLHttpRequest 已被 CORS 策略阻止:跨源请求仅支持协议方案:http,数据,铬,铬扩展,https。ajax1.html:46 请求错误 ajax1.html:56 GET file:///Users/macbookuser/Desktop/traversy/ajax/sample.php net::ERR_FAILED
1 回答

慕工程0101907
TA贡献1887条经验 获得超5个赞
我认为这是一个相当不言自明的错误。跨源请求仅支持错误消息中引用的特定协议列表(url 开头的单词,在 :// 之前),并且您从不以以下之一开头的 url 请求文件允许的协议:file://不在列出的协议中;
这是怎么发生的?好吧,您的 html 中的 url 是相对的,并且因为您刚刚在 Web 浏览器中直接打开了 html 文件(在本地磁盘上),所以浏览器地址栏中的 url 显示“file://...”并且 Ajax 对相对 URL 的任何请求也将使用此协议,因此它使用的是文件协议而不是 http。跨源请求不能以这种方式运行。
将文件托管在 Web 服务器上,在浏览器中打开指向 html 文件的 http url,然后重试
- 1 回答
- 0 关注
- 127 浏览
添加回答
举报
0/150
提交
取消