JQuery를 사용하여 원격 파일을 읽는 방법 (jqXHR 읽기 오류가 발생 함)

Question

원격 파일을 읽으려고합니다.

var jqxhr = $.get('http://stackoverflow.com/feeds/question/10943544', function() { 
 
         alert('success'); 
 
         }) 
 
    .done(function() { 
 
        alert('second success'); 
 
        }) 
 
    .fail(function(jqXHR, textStatus, errorThrown) { 
 
        // alert('error'); 
 
        console.log('Error: (' + errorThrown + ')'); 
 
    }) 
 
    .always(function() { 
 
    alert('finished'); 
 
    });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

그러나 그것은 단지 "항상" "실패"트리거와 나는 이유를 이해하고 싶습니다; 나는 the example on the jquery.get() documentation page을 사용하고 있습니다 내 질문 : 읽을 수있는 오류를 어떻게 얻을 수 있습니까? 현재 console.log("Error: (" + errorThrown + ')');은 Error:()만을 산출합니다.

보너스 질문 : 왜 실패합니까? JS/JQuery를 사용하여 원격 (RSS) 파일을 읽는 방법은 무엇입니까?

Answer 1

Same Origin Policy 중 하나입니다.이 문제는 대부분의 AJAX 요청에 있으며 보안 수단으로 사용됩니다. jqXHR()을 보면 이 0 인 것을 알 수 있습니다. readyState은 요청이 실패하거나 정책 제한 또는 잘못된 요청 인 경우 항상 0이됩니다. 제한 사항으로 인해 오류 메시지 자체가 트리거되지 않으므로 error 메시지가 비어 있습니다.

var jqxhr = $.get("http://stackoverflow.com/feeds/question/10943544", function(res) { 
 
    alert("success"); 
 
    }) 
 
    .done(function() { 
 
    alert("second success"); 
 
    }) 
 
    .fail(function(jqXHR, textStatus, errorThrown) { 
 
    // alert("error"); 
 
    console.log("Error: (" + errorThrown + ')'); 
 
    }) 
 
    .always(function(jqXHR) { 
 
    console.log(jqXHR); 
 
    });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

이 해결하기 위해, this answer에 나와있는 플러그인의 수는 있습니다. 또한 상태 :

이 문제를 해결하는 가장 좋은 방법은 프록시가 다른 도메인의 서비스를 가리 않도록 때문에하지 백 엔드에서 백엔드에 자신의 프록시를 만드는 것입니다 동일한 원산지 정책 제한이 존재합니다. 다음 코드에 도시 ​​된 바와 같이

그러나, 당신은 할 수 없어 가정, 가장 쉬운 방법은, CORS Anywhere proxy 사용하는 것이다 (결과를 통해 오는 동안 소요 참고) :

이 도움이

$.ajaxPrefilter(function(options) { 
 
    if (options.crossDomain && jQuery.support.cors) { 
 
    var http = (window.location.protocol === 'http:' ? 'http:' : 'https:'); 
 
    options.url = http + '//cors-anywhere.herokuapp.com/' + options.url; 
 
    //options.url = "http://cors.corsproxy.io/url=" + options.url; 
 
    } 
 
}); 
 

 
$.get(
 
    'http://stackoverflow.com/feeds/question/10943544', 
 
    function(response) { 
 
    console.log("> ", response); 
 
    $("#viewer").html(response); 
 
    } 
 
);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

희망! :)