source

CORS 헤더 'Access-Control-Allow-Origin'이 없습니다.

gigabyte 2023. 4. 4. 21:23
반응형

CORS 헤더 'Access-Control-Allow-Origin'이 없습니다.

asp.net 폼에서 이 함수를 호출하고 있으며, ajax를 호출하는 동안 firebug 콘솔에서 다음 오류가 나타납니다.

차단된 발신지 간 요청:동일한 오리진 정책에 따라 http://anotherdomain/test.json의 원격 리소스를 읽을 수 없습니다(이유: 'Access-Control-Allow-Origin'이 누락됨).

var url= 'http://anotherdomain/test.json';
        $.ajax({
            url: url,
            crossOrigin: true,
            type: 'GET',
            xhrFields: { withCredentials: true },
            accept: 'application/json'
        }).done(function (data) {
            alert(data);                
        }).fail(function (xhr, textStatus, error) {
            var title, message;
            switch (xhr.status) {
                case 403:
                    title = xhr.responseJSON.errorSummary;
                    message = 'Please login to your server before running the test.';
                    break;
                default:
                    title = 'Invalid URL or Cross-Origin Request Blocked';
                    message = 'You must explictly add this site (' + window.location.origin + ') to the list of allowed websites in your server.';
                    break;
            }
        });

나는 다른 방법을 시도해 보았지만 여전히 해결책을 찾지 못했다.

참고: 서버 측(API/URL)을 변경할 수 있는 서버 권한이 없습니다.

이 문제는 일반적으로 다른 도메인의 리소스에 액세스하려고 할 때 발생합니다.

이는 모든 사용자가 해당 도메인의 리소스에 자유롭게 액세스하지 않도록 하는 보안 기능입니다(예를 들어 해적 도메인에 있는 웹 사이트와 동일한 복사본을 가지기 위해 액세스할 수 있습니다).

응답의 헤더는 200OK일지라도 다른 오리진(도메인, 포트)이 리소스에 액세스하는 것을 허용하지 않습니다.

양쪽 도메인의 소유자일 경우 이 문제를 해결할 수 있습니다.

해결책 1: 경유.htaccess

이것을 변경하려면 , 다음의 URL 에 기입해 주세요..htaccess필요한 도메인 파일:

    <IfModule mod_headers.c>
    Header set Access-Control-Allow-Origin "*"
    </IfModule>

1개의 도메인에만 액세스 권한을 부여하는 경우.htaccess는 다음과 같습니다.

    <IfModule mod_headers.c>
    Header set Access-Control-Allow-Origin 'https://my-domain.example'
    </IfModule>

솔루션 2: 헤더를 올바르게 설정

요청된 파일의 응답 헤더로 설정하면 모든 사용자가 리소스에 액세스할 수 있습니다.

Access-Control-Allow-Origin : *

또는

Access-Control-Allow-Origin : http://www.my-domain.example

서버측에서는 이것을 .php의 맨 위에 둡니다.

 header('Access-Control-Allow-Origin: *');  

특정 도메인 제한 액세스를 설정할 수 있습니다.

header('Access-Control-Allow-Origin: https://www.example.com')

추가:

dataType: "jsonp",

뒷줄:

type: 'GET',

이 문제를 해결해야 한다.

이것이 너에게 도움이 되길 바란다.

백엔드에서 Express js를 사용하는 경우 패키지를 설치한 후 다음과 같이 서버에서 사용할 수 있습니다.

const cors = require("cors");
app.use(cors());

이것으로 문제가 해결되었습니다.

아래와 같이 서버측 코드를 수정해야 합니다.

public class CorsResponseFilter implements ContainerResponseFilter {
@Override
public void filter(ContainerRequestContext requestContext,   ContainerResponseContext responseContext)
    throws IOException {
        responseContext.getHeaders().add("Access-Control-Allow-Origin","*");
        responseContext.getHeaders().add("Access-Control-Allow-Methods", "GET, POST, DELETE, PUT");

  }
}

위의 답변을 보고 왜 이 문제가 발생하는지 알 수 있을 것입니다.

self.send_header('Access-Control-Allow-Origin', '*')

서버 측에 위의 행을 추가하면 됩니다.

이 방법은 효과가 있었습니다.

js: 를 사용하지 않고 다른 도메인 페이지의 콘텐츠를 다운로드하는 php 파일을 만듭니다.

<?
//file name: your_php_page.php
echo file_get_contents('http://anotherdomain/test.json');
?>

그런 다음 아약스(jquery)로 실행합니다.예를 들어:

$.ajax({
  url: your_php_page.php,
  //optional data might be usefull
  //type: 'GET',
  //dataType: "jsonp", 
  //dataType: 'xml',
  context: document.body
}).done(function(data) {

  alert("data");
  
}); 

이 Chrome Extension을 사용하여 로컬브라우저에서 CORS를 무효로 할 수 있습니다.

CORS 허용: 접근 제어-원점 크롬 확장

언급URL : https://stackoverflow.com/questions/31276220/cors-header-access-control-allow-origin-missing

반응형