CORSリクエストのステータスコードを取得

Question

return CORSリクエストのレスポンスコードはどうですか？私はonloadイベントからそれを得ることができますが、私はそれを取り出して、returnを作ることができないので、私は値のチェックのためにそれを捕まえることができます。ここで

はhttp://www.html5rocks.com/en/tutorials/cors/に基づいて私のコードです：私たちは他の関数へのパラメータとしてJavaScriptで関数を渡すと、内部から非同期的にそれらを呼び出すことができるよう

createCORSRequest: function(method, url) { 
    var xhr = new XMLHttpRequest(); 
    if ("withCredentials" in xhr) { 

     // Check if the XMLHttpRequest object has a "withCredentials" property. 
     // "withCredentials" only exists on XMLHTTPRequest2 objects. 
     xhr.open(method, url, true); 

    } else if (typeof XDomainRequest != "undefined") { 

     // Otherwise, check if XDomainRequest. 
     // XDomainRequest only exists in IE, and is IE's way of making CORS requests. 
     xhr = new XDomainRequest(); 
     xhr.open(method, url); 

    } else { 

     // Otherwise, CORS is not supported by the browser. 
     xhr = null; 

    } 
    return xhr; 
    }, 

    makeCorsRequest: function() { 
    // All HTML5 Rocks properties support CORS. 
    var me = this; 
    var url = 'http://google.com'; 
    var sCode = ''; 

    var xhr = me.createCORSRequest('GET', url); 
    console.log('xhr', xhr); 
    if (!xhr) { 
     alert('CORS not supported'); 
     return; 
    } 

    // Response handlers. 
    xhr.onload = function() { 
     var text = xhr.responseText; 
     var sCode = xhr.status; 
     // var title = getTitle(text); 
     // alert('Response from CORS request to ' + url + ': ' + xhr.status); 
    }; 

    xhr.onreadystatechange = function() { 
     console.log(this.status); 
     sCode = this.status; 
    } 

    xhr.onerror = function() { 
     alert('Woops, there was an error making the request.'); 
    }; 

    xhr.send(); 
    return sCode; // this returns an empty string or the initial value set to it and not from `onload` event 
    } 

Answer 1

一つのアプローチは、JSでのコールバックを使用する可能性があります。

私はあなたのコードを少し変更して非同期的に応答させ、関連するコメントを追加しました。下記のcallbackの使用を守ってください。

//make few changes to make it asynchronous. 
makeCorsRequest: function(callback) { 
    // All HTML5 Rocks properties support CORS. 
    var me = this; 
    var url = 'http://google.com'; 
    var sCode = ''; 

    var xhr = me.createCORSRequest('GET', url); 
    console.log('xhr', xhr); 
    if (!xhr) { 
     callback('CORS not supported'); 
     return; 
    } 

    // Response handlers. 
    xhr.onload = function() { 
     var text = xhr.responseText; 
     var sCode = xhr.status; 
     // var title = getTitle(text); 
     // alert('Response from CORS request to ' + url + ': ' + xhr.status); 
     callback(null, text); 
    }; 

    xhr.onreadystatechange = function() { 
     console.log(this.status); 
     callback(this.status); 
    } 

    xhr.onerror = function() { 
     callback('Woops, there was an error making the request.'); 
    }; 

    xhr.send(); 
    } 

//this function would be the callback, it would be called 'Asynchronously' form XHR events with err or real data. First parameter generally indicates error. 
function handleCorsResponse(err, data) { 
    //check if error occurred 
    if (err) { 
     //error handling here 
    } 

    //if no error occurred, proceed. 
    console.log(data); 
} 

//let's call `makeCorsRequest` with `handleCorsResponse` as a parameter. 
$payments.makeCorsRequest(handleCorsResponse); 

注：より良いと推奨される方法はPromiseを使用することでしょう。