Javascriptを使用してREST APIから返されたJSONデータを読み取る

Question

次のコードは、JSONファイルから取得したい値を通知するものです。 。問題は、それが以下:(バック私に何かを与えていないのは、JSONファイルのリンクされています、Soil Grids APIはあなたの土壌の洞察力を与えるために使用されるAPIがわからない場合は

https://rest.soilgrids.org/query?lon=5.39&lat=51.57 

です。陸地の特定の緯度と経度

私は認めざるを得ないが、私が間違っているかわからない以下の私のコードです：。

var soil = new XMLHttpRequest(); 
 

 
function testFunction(){ 
 
    soil.open("REST", "https://rest.soilgrids.org/query?lon=5.39&lat=51.57", false); 
 
    soil.send(null); 
 
    var r = JSON.parse(soil.response); 
 
    var majorreal = r.properties.TAXNWRBMajor; 
 
    alert(majorreal); 
 
    }

<button onclick="testFunction()">Submit</button>

プログラムが実行されるたびに、私はXMLHttpRequestをして、送信エラーが発生しますが...

"Uncaught NetworkError: Failed to execute 'send' on 
'XMLHttpRequest': Failed to load 'https://rest.soilgrids.org/query 
lon=5.39&lat=51.57'.", 

任意の助けいただければ幸い;）。

Answer 1

問題は、RESTメソッドがありません（https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest/openを参照してください）。

GETを使用してください。

var soil = new XMLHttpRequest(); 
 

 
function testFunction(){ 
 
    soil.open("GET", "https://rest.soilgrids.org/query?lon=5.39&lat=51.57", false); 
 
    soil.send(null); 
 
    var r = JSON.parse(soil.response); 
 
    var majorreal = r.properties.TAXNWRBMajor; 
 
    alert(majorreal); 
 
    }

<button onclick="testFunction()">Submit</button>

また同期呼び出しを使用する理由はありません。

Answer 2

一般的な規則は、以下のパターンに従うことです。これにより、準備完了状態のプロパティをチェックすることで、結果が得られたときに何かを行うことができます。

function testFunction(){ 
var soil = new XMLHttpRequest(); 
    soil.onreadystatechange = function() { 
    if (this.readyState == 4 && this.status == 200) { 
     console.log(this.responseText); 
     } 
    }; 
    soil.open("GET", "https://rest.soilgrids.org/query?lon=5.39&lat=51.57", false); 
    soil.send(null); 
}