>웹 프론트엔드 >JS 튜토리얼 >도메인 간 AJAX 요청에 대한 CORS 제한을 우회하려면 어떻게 해야 합니까?

도메인 간 AJAX 요청에 대한 CORS 제한을 우회하려면 어떻게 해야 합니까?

Patricia Arquette
Patricia Arquette원래의
2024-12-14 13:36:12538검색

How Can I Bypass CORS Restrictions for Cross-Domain AJAX Requests?

AJAX를 사용하여 도메인 간 엔드포인트 로드

소개

CORS(교차 원본 리소스 공유) 제한으로 인해 AJAX 요청이 다른 곳에서 데이터를 검색하는 것이 방해될 수 있습니다. 도메인. 이 기사에서는 CORS 제한 사항을 극복하기 위한 대체 접근 방식을 검토합니다.

CORS 제한 이해

보안 조치로 인해 브라우저는 동일한 도메인 내의 AJAX 요청을 제한하는 동일 출처 정책을 시행합니다. 다른 도메인, 하위 도메인, 포트 또는 프로토콜에 대한 요청은 일반적으로 차단됩니다.

JSONP 방지

JSONP를 사용하여 도메인 간 데이터를 검색하려면 서버가 스크립트 형식으로 응답을 제공해야 합니다. 예상 데이터가 HTML인 경우 JSONP를 사용하는 것은 적합하지 않습니다.

대체 솔루션

1. CORS 프록시 대안:

  • CORS Anywhere: 프록시된 요청에 CORS 헤더를 추가합니다.
  • 원본에 상관없이 도메인 간 JSONP 액세스를 제공합니다.
  • CORS 프록시 : 모든 CORS 요청을 활성화하는 Node.js 프록시 홈페이지.

2. 동일 출처 제한 우회:

  • 타사 프록시 사용(보안 문제로 인해 권장되지 않음).
  • 교차 도메인 요청을 처리하기 위한 백엔드 프록시 생성 .

CORS 프록시 예

CORS Anywhere:

$.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;
  }
});

원본에 관계없이:

$.ajaxSetup({
    scriptCharset: "utf-8",
    contentType: "application/json; charset=utf-8"
});

$.getJSON('http://whateverorigin.org/get?url=' + 
    encodeURIComponent('http://google.com') + '&callback=?',
    function (data) {
        console.log(" > " , data);
        $("#viewer").html(data.contents);
});

결론

이러한 대체 접근 방식은 CORS에 의해 직접 요청이 제한되는 경우 도메인 간 AJAX 요청을 허용합니다. 최상의 솔루션 선택은 특정 사용 사례와 보안 고려 사항에 따라 달라집니다.

위 내용은 도메인 간 AJAX 요청에 대한 CORS 제한을 우회하려면 어떻게 해야 합니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.