我有一些簡(jiǎn)單的代碼試圖發(fā)出 ajax 請(qǐng)求。我嘗試使用 .txt 文件并發(fā)現(xiàn) CORS 錯(cuò)誤。然后我嘗試使用帶有 header("Access-Control-Allow-Origin: *"); 的 php 文件 因?yàn)槲衣犝f這是在任何瀏覽器上允許所有 ajax 調(diào)用的最簡(jiǎn)單方法。我瀏覽了許多 SO 帖子并到處搜索,似乎找不到解決方案。這是我的文件。我將包含 .txt 文件,但我已經(jīng)明白為什么該文件不起作用。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 控制臺(tái)顯示的內(nèi)容就緒狀態(tài):1ajax1.html:1 從源“null”訪問“file:///Users/macbookuser/Desktop/traversy/ajax/sample.php”處的 XMLHttpRequest 已被 CORS 策略阻止:跨源請(qǐng)求僅支持協(xié)議方案:http,數(shù)據(jù),鉻,鉻擴(kuò)展,https。ajax1.html:46 請(qǐng)求錯(cuò)誤 ajax1.html:56 GET file:///Users/macbookuser/Desktop/traversy/ajax/sample.php net::ERR_FAILED
1 回答

慕工程0101907
TA貢獻(xiàn)1887條經(jīng)驗(yàn) 獲得超5個(gè)贊
我認(rèn)為這是一個(gè)相當(dāng)不言自明的錯(cuò)誤。跨源請(qǐng)求僅支持錯(cuò)誤消息中引用的特定協(xié)議列表(url 開頭的單詞,在 :// 之前),并且您從不以以下之一開頭的 url 請(qǐng)求文件允許的協(xié)議:file://不在列出的協(xié)議中;
這是怎么發(fā)生的?好吧,您的 html 中的 url 是相對(duì)的,并且因?yàn)槟鷦倓傇?Web 瀏覽器中直接打開了 html 文件(在本地磁盤上),所以瀏覽器地址欄中的 url 顯示“file://...”并且 Ajax 對(duì)相對(duì) URL 的任何請(qǐng)求也將使用此協(xié)議,因此它使用的是文件協(xié)議而不是 http??缭凑?qǐng)求不能以這種方式運(yùn)行。
將文件托管在 Web 服務(wù)器上,在瀏覽器中打開指向 html 文件的 http url,然后重試
- 1 回答
- 0 關(guān)注
- 124 瀏覽
添加回答
舉報(bào)
0/150
提交
取消