해결 방법 'Redirect가 CORS 정책에 의해 차단됨:'Access-Control-Allow-Origin' 헤더가 없으십니까?

해결 방법 'Redirect가 CORS 정책에 의해 차단됨:'Access-Control-Allow-Origin' 헤더가 없으십니까?

나는 앱으로 작업을 하고 있다.Vue js내 설정에 따라 나는 변화를 설정할 때 변수에 내 URL을 전달해야 한다.

<!-- language: lang-js -->

    $.get('http://172.16.1.157:8002/firstcolumn/' + c1v + '/' + c1b, function (data) { 
      // some code...
    });

그러나 내 앱이 URL을 누르면 다음과 같은 메시지가 표시된다.

Failed to load http://172.16.1.157:8002/firstcolumn/2017-03-01/2017-10-26: Redirect from 'http://172.16.1.157:8002/firstcolumn/2017-03-01/2017-10-26' to 'http://172.16.1.157:8002/firstcolumn/2017-03-01/2017-10-26/' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:8080' is therefore not allowed access.

AWD가 서버 담당자에게 재구성(현지 개발을 위한 실행 불가능한 솔루션)을 시키는 것에 대해 언급한 것 외에 다음과 같은 Change-Origin Chrome 플러그인을 사용한다.

모이시프 오린 & 코르스 체인저

당신은 당신의 것을 만들 수 있다.local dev server (ex: localhost:8080)에서 온 것으로 보이다172.16.1.157:8002 or any other domain.

고마워, 크롬에 대한 내선 번호로 해결했어.

CORS 허용: 액세스-제어-허용-오리진

서버를 제어할 수 있는 경우 PHP:

<?PHP
header('Access-Control-Allow-Origin: *');
?>

http:///172.16.157:8002/에서 서버를 관리하는 사람에게 호스트 이름을 Access-Control-Allow-Origin 호스트에 추가하도록 요청하면 서버는 응답과 함께 다음과 유사한 헤더를 반환해야 한다.

Access-Control-Allow-Origin: yourhostname:port

Chrome에 이 문제가 있을 때는 Extension이 필요하지 않다.
콘솔에서 크롬 시작:

.exe --user-data-dir="C:/Chrome dev 세션션" --disable-web-security"

모든 탭을 Chrome으로 닫고 다시 시작해야 할 수도 있다.

안녕, 만약 내가 제대로 이해했다면 너는 너의 페이지가 아닌 다른 도메인으로 XMLHtpRequest를 하고 있어.그래서 브라우저가 보통 보안상의 이유로 같은 출처에서 요청을 허용하기 때문에 차단하고 있다.도메인 간 요청을 하려면 다른 작업을 수행해야 한다.그것을 달성하는 방법에 대한 자습서는 CORS 사용이다.

당신이 우체부를 사용할 때 그들은 이 정책에 의해 제한되지 않는다.Cross-Origin XMLHtpRequest에서 인용됨:

일반 웹 페이지는 XMLHtpRequest 개체를 사용하여 원격 서버에서 데이터를 주고받을 수 있지만 동일한 오리진 정책에 의해 제한된다.연장은 그렇게 제한되지 않는다.처음 원본 간 권한을 요청하는 한, 확장자는 원본 이외의 원격 서버와 통신할 수 있다.

npm 사용:

크로스 오리진 요청을 허용하려면 '코어'를 설치하십시오.

npm i cors

서버 측에서 추가:

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

권한을 하려면, 사스하스 코르스 를 코르스 를 가하면 된다.<Directory><Location><Files>또는<VirtualHost>의 apache.conf apache(httpd.conf) 의 섹션은 다음과 같다..htaccess파일:

헤더 집합 Access-Control-Allow-Origin "*"

그리고 아파치를 다시 시작해

헤더를 변경하려면 mod_headers를 사용해야 한다.Mod_headers는 Apache에서 기본적으로 사용 가능하지만, 사용 가능한지 확인할 수 있다.

나는 Vue.js와 SpringBoot 프로젝트에서도 같은 문제를 가지고 있었다.만약 누군가가 스프링과 함께 일한다면 당신은 이 코드를 추가할 수 있다:

@Bean
public FilterRegistrationBean simpleCorsFilter() {  
    UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();  
    CorsConfiguration config = new CorsConfiguration();  
    config.setAllowCredentials(true); 
    // *** URL below needs to match the Vue client URL and port ***
    config.setAllowedOrigins(Collections.singletonList("http://localhost:8080")); 
    config.setAllowedMethods(Collections.singletonList("*"));  
    config.setAllowedHeaders(Collections.singletonList("*"));  
    source.registerCorsConfiguration("/**", config);  
    FilterRegistrationBean bean = new FilterRegistrationBean<>(new CorsFilter(source));
    bean.setOrder(Ordered.HIGHEST_PRECEDENCE);  
    return bean;  
}   

이 글에서 해결 방법을 찾았다. Spring Boot 및 Vue.js로 간단한 CRUD 앱 빌드

외부 도메인에 요청을 하는 경우172.16.1.157:8002/교차 오리진 예외를 부여하는 이유가 바로 당신의 로컬 개발 서버로부터입니다.머리글을 허용해야 하는 경우Access-Control-Allow-Origin:*프런트엔드와 백엔드 모두에서 또는 같은 도메인에서 백엔드와 프런트엔드를 호스트하지 않는 한 이 확장 코르스 헤더 전환 - 크롬 확장을 사용하십시오.

터미널에서 이 명령을 실행한 다음 다시 테스트하십시오.

curl -H "origin: originHost" -v "RequestedResource"

예:

만약 내가originHost대등하다https://localhost:8081/그리고 나의RequestedResource대등하다https://example.com/

내 명령은 다음과 같을 것이다.

curl -H "origin: https://localhost:8081/" -v "https://example.com/"

만약 당신이 다음 줄을 알아차릴 수 있다면, 그것은 당신에게 효과가 있을 것이다.

< 액세스-제어-허용-해당: *

이게 도움이 되길 바래.

이 질문에 대한 승인된 답변은 유효하지 않다.

서버측 코드에 헤더를 설정해야 하는 경우

app.use((req,res,next)=>{
    res.setHeader('Acces-Control-Allow-Origin','*');
    res.setHeader('Acces-Control-Allow-Methods','GET,POST,PUT,PATCH,DELETE');
    res.setHeader('Acces-Contorl-Allow-Methods','Content-Type','Authorization');
    next(); 
})

Firefox 애드온, 어디에나 있는 코르스를 사용하여 이 문제를 일시적으로 해결할 수 있다.Firefox를 열고 Ctrl+Shift+A를 누른 다음 추가 기능을 검색하여 추가하십시오!

이걸 믿지 못할 거야, "url" 끝에 "."를 꼭 추가해.

이 코드와 비슷한 오류가 발생했어:

fetch(https://itunes.apple.com/search?term=jack+johnson)
.then( response => {
    return response.json();
})
.then(data => {
    console.log(data.results);
}).catch(error => console.log('Request failed:', error))

내가 받은 오류:

 Access to fetch at 'https://itunes.apple.com/search?term=jack+johnson'
 from origin 'http://127.0.0.1:5500' has been blocked by CORS policy:
 No 'Access-Control-Allow-Origin' header is present on the requested
 resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.

그러나 나는 많은 연구를 통해 내가 iTunes API 설명서에서 올바른 URL 주소를 복사하지 않은 것이 문제라는 것을 깨달았다.

그랬어야 했다.

https://itunes.apple.com/search?term=jack+johnson.

아닌

https://itunes.apple.com/search?term=jack+johnson

끝에 점이 있음

DNS와 문자 부호화에 관한 이슈를 인용하는 것이 왜 중요한지에 대한 큰 설명이 있지만, 사실은 당신이 아마도 신경 쓰지 않는다는 것이다.당신에게도 효과가 있을 수 있는 점을 추가해 보십시오.

내가 "."를 추가했을 때 모든 것이 매력적으로 작용했다.

너도 잘 됐으면 좋겠다.

@CrossOrigin(origins = "http://localhost:8081")제어기 클래스에서.

브라우저에 대한 보안을 사용자 정의하거나 보안 사용자 정의를 통해 사용 권한을 허용해야 한다.(현지 테스트에서는 비실용적임)에 대해 자세히 알아보려면 링크를 클릭하십시오.
https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS

설치:

npm i cors

그런 다음 cors()를 포함하십시오.

app.get("/list",cors(),(req,res) =>{

});

내가 이 오류를 발견한 이유는 다른 환경에 대한 경로를 업데이트하지 않았기 때문이다.

베르케 카안 세틴카야의 대답 외에.
서버를 제어할 수 있는 경우 ExpressJs에서 다음을 수행할 수 있다.

app.use(function(req, res, next) {
// update to match the domain you will make the request from
res.header("Access-Control-Allow-Origin", "YOUR-DOMAIN.TLD");
res.header("Access-Control-Allow-Methods", "GET,HEAD,OPTIONS,POST,PUT");
res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
next();
});

https://enable-cors.org/server_expressjs.html

이러한 오류는 다음과 같은 이유로 인해 발생할 수 있으므로 다음 단계를 따르십시오.로컬 호스트를 로컬 가상 시스템(호스트)과 연결하려면 다음과 같이 하십시오.여기서 http:///localhost:3001/을(를) http:///abc.test steps에 연결하십시오.

1.우리는 CORS를 허용해야 하며, 접근-제어-허용-오리진: 요청 헤더에 배치하면 작동하지 않을 수 있다. CORS 요청이 가능한 Google 확장을 설치하십시오.*

2.요청서에 제공한 자격 증명이 유효한지 확인하십시오.

3.부랑자가 공급되었는지 확인한다.로컬 호스트가 홈스테드의 db에 연결되도록 하려면 부랑자를 위로 이동하십시오.

4. 헤더의 내용 유형을 변경해 보십시오.헤더:{'Content-Type' : 'application/x-www-form-urlencoded; charset=UTF-8;응용프로그램/json' } 이 점은 매우 중요하다.

httpd.conf 파일에 아래 텍스트를 추가하기만 하면 이 문제가 해결될 것이다.

헤더 집합 Access-Control-Allow-Origin "*"

$.get('https://172.16.1.157:8002/firstcolumn/' + c1v + '/' + c1b, function (data) { 
  // some code...
});

그냥 "https"를 넣어라.

참조URL: https://stackoverflow.com/questions/46522749/how-to-solve-redirect-has-been-blocked-by-cors-policy-no-access-control-allow