發送 Ajax 請求以使用純 javascript 從 json 文件中獲取 json 數據

Question

我想用純 JS 發送 AJAX 請求，而不使用服務器或在 Chrome 瀏覽器中閑置安全性。

這是我的代碼：

if(document.getElementById("showJson")){
    document.getElementById("showJson").addEventListener("click", init);
}

function init(){
    loadJSON(function (response){
        var actual_JSON = JSON.parse(response);
    });
}

function loadJSON(callback) {   
    var xobj = new XMLHttpRequest();
        xobj.overrideMimeType("application/json");
    xobj.open('GET', 'my_data.json', true); // Replace 'my_data' with the path to your file
    xobj.onreadystatechange = function () {
          if (xobj.readyState == 4 && xobj.status == "200") {
            // Required use of an anonymous callback as .open will NOT return a value but simply returns undefined in asynchronous mode
            callback(xobj.responseText);
          }
    };
    xobj.send(null);  
    console.log(xobj);
 }

這是 JSON 文件“學生”：

[{
    "name" : "Mohamed Kamel",
    "age" : 24,
    "grade" : 100
},{
    "name": "hamada",
    "age" : 20,
    "grade":90
},{
    "name" : "ali",
    "age" : 23,
    "grade" : 80
}]

Answer 1

你不能。

出於安全原因，下載文件必須僅通過用戶許可才能完成。

但是你為什么要這樣做呢？ 服務器讀取文件和發送內容或發送文件沒有區別（性能）。 服務器以兩種方式讀取文件。

Answer 2

看起來您遇到了“跨源”問題。 如果您請求的文件在另一個域上，則可能會設置“strict-origin-when-cross-origin”的基本標頭。 如果該站點的所有者希望能夠與任何人共享該 JSON 文件，他們應該將名稱從 .json 更改為 .php 並將其添加到其標題中。

header("Access-Control-Allow-Origin: *");