CORS가 .js 콘텐츠를 가져 오기 - 자바 스크립트

Question

브라우저 (플러그인을 통해)에서 실행되는 코드에서 다양한 .js 파일의 내용을 가져 오려고합니다.

XMLHttpRequest을 사용하여 동일한 서버에있는 .js 파일을 가져 오는 데 아무런 문제가 없습니다.하지만 CORS를 사용하려고하는 다른 도메인의 .js 파일 내용을 가져와야하지만 이

작동하도록하는 것 이것은 내가 실행하면 내 코드

// Create the XHR object. 
function createCORSRequest(method, url) { 
    var xhr = new XMLHttpRequest(); 
    if ("withCredentials" in xhr) { 
    // XHR for Chrome/Firefox/Opera/Safari. 
    xhr.open(method, url, true); 
    } else if (typeof XDomainRequest != "undefined") { 
    // XDomainRequest for IE. 
    xhr = new XDomainRequest(); 
    xhr.open(method, url); 
    } else { 
    // CORS not supported. 
    xhr = null; 
    } 
    return xhr; 
} 

// Make the actual CORS request. 
function makeCorsRequest(url) { 

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

    // Response handlers. 
    xhr.onload = function() { 
    return xhr.responseText; 
    }; 

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

    xhr.send(); 
} 

이다 '. 요청하는 중에 오류가 발생했습니다'

url = `https://......./javascript.js' 
res = makeCORSTRequest(url) 

내가 얻을 오류 경고 및 콘솔 로그

XMLHttpRequest는 https://......./javascript.js을로드 할 수 없습니다. 아니요 요청한 리소스에 'Access-Control-Allow-Origin'헤더가 있습니다. 따라서 원점 'https://.....com'은 액세스 할 수 없습니다.

Answer 1

귀하의 브라우저는 요청을하는 서버가 상호 출처 요청 수신을 명시 적으로 나타내고 있음을 나타낼 때 프런트 엔드 자바 스크립트 코드가 교차 출처 요청에서 응답에 액세스하도록 허용합니다. 답장에 Access-Control-Allow-Origin 응답 헤더를 보냅니다.

https://developer.mozilla.org/en-US/docs/Web/HTTP/Access_control_CORS 자세한 내용이 있습니다.

사이트가 Access-Control-Allow-Origin 응답 헤더를 보내지 않는 경우 CORS 프록시를 사용하여 사이트 교차 출처의 콘텐츠를 얻을 수있는 유일한 방법입니다. 자세한 내용은 "No 'Access-Control-Allow-Origin' header is present on the requested resource"의 대답을 참조하십시오.

브라우저는 출처 크로스 요청에 대한 제한을 적용하는 유일한 클라이언트이며 웹 응용 프로그램에서만 브라우저를 시행합니다.

이 표시된 경우에도 그렇습니다. 요청한 리소스에 'Access-Control-Allow-Origin'헤더가 없습니다. Origin ... 따라서 devtools 콘솔에 액세스 메시지가 허용되지 않으면 devtools의 네트워크 탭으로 이동하여 응답을 볼 수 있습니다.

서버가 응답을 보내고 브라우저가 응답을 받았기 때문에 브라우저가 프런트 엔드 JavaScript 코드가 응답을 보내는 서버가 응답하지 않기 때문에 응답에 액세스하는 것을 거부하기 때문입니다 응답 헤더를 Access-Control-Allow-Origin으로 전송하여 교차 출처 요청

파이썬 등에서 요청을 할 때 응답을 얻을 수있는 이유는 브라우저 이외의 클라이언트가 Access-Control-Allow-Origin 응답 헤더가없는 경우 코드가 응답에 액세스하는 것을 거부하지 않기 때문입니다. 그러나 브라우저는 항상 그렇게 할 것입니다.

그리고 서버가 모든 요청을 차단하거나 거부하는 것은 아닙니다. 서버는 항상 요청을 받고 응답을 보냅니다. 유일한 차이점은 서버가 응답에 Access-Control-Allow-Origin 헤더를 전송하는지 여부입니다.