익스프레스 JS CORS 브라우저

Question

를 통해 요청시 - 나는 (여권 strava)를 strava를 사용하여 인증하는 데 사용되는 REST 게터를 한

나는 API의 URL을 호출 할 때 직접 (http://localhost:3000/api/auth/strava) - 연결이 성공하고 프로필 정보를 검색 할 수 있습니다. 나는 이것이 CORS에와 있다는 관련이 있음을 이해한다 오류

XMLHttpRequest cannot load https://www.strava.com/oauth/authorize?response_type=code&redirect_uri=http%3A%2F%2Flocalhost%3A3000%2Fapi%2Fauth%2Fstrava%2Fcallback&client_id=9769. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:3000' is therefore not allowed access. 

을 던진거야 -이가 백엔드를 통해 HTML 버튼의 브라우저 위젯을 통해, 즉 온 클릭을 호출하고 라우팅 그러나 , 헤더 "Access-Control-Allow-Origin"이 포함되어야하지만, 헤더에 적절한 값을 추가하면 아무런 유감이 없습니다.

나는 크롬을 사용하여 호출을 가로 채기 위해 시도 : // 그물 내부를 확인하는 액세스 제어 - 허용 - 원산지 밖으로 제거 및 통화의 변화 발견되는 경우 - API를 통해 직접 호출 할 때

을 - 위젯을 통해 라우팅 할 때,

1097271 URL_REQUEST http://localhost:3000/api/auth/strava 
1097273 DISK_CACHE_ENTRY http://localhost:3000/api/auth/strava 
1097275 HTTP_STREAM_JOB https://www.strava.com/ 
1097276 CONNECT_JOB ssl/www.strava.com:443 
1097277 CONNECT_JOB ssl/www.strava.com:443 
1097278 SOCKET ssl/www.strava.com:443 
1097279 CONNECT_JOB ssl/www.strava.com:443 
1097280 CONNECT_JOB ssl/www.strava.com:443 
1097281 SOCKET ssl/www.strava.com:443 
1097282 DISK_CACHE_ENTRY https://www.strava.com/oauth/authorize?response_type=code&redirect_uri=http%3A%2F%2Flocalhost%3A3000%2Fapi%2Fauth%2Fstrava%2Fcallback&client_id=9769 
1097283 HTTP_STREAM_JOB https://www.strava.com/ 
1097285 URL_REQUEST http://localhost:3000/api/auth/strava 
1097288 DISK_CACHE_ENTRY http://localhost:3000/api/auth/strava 
1097290 HTTP_STREAM_JOB https://www.strava.com/ 
1097291 DISK_CACHE_ENTRY https://www.strava.com/oauth/authorize?response_type=code&redirect_uri=http%3A%2F%2Flocalhost%3A3000%2Fapi%2Fauth%2Fstrava%2Fcallback&client_id=9769 
1097292 HTTP_STREAM_JOB https://www.strava.com/ 
1097293 DISK_CACHE_ENTRY http://localhost:3000/api/auth/strava/callback?state=&code=7b5722c72f079ee2ac5dfeb7d5140cdc6375f5cc 

그러나 다음과 같이 호출은

1097337 URL_REQUEST http://localhost:3000/api/auth/strava 
1097339 DISK_CACHE_ENTRY http://localhost:3000/api/auth/strava 
1097344 URL_REQUEST https://www.strava.com/oauth/authorize?response_type=code&redirect_uri=http%3A%2F%2Flocalhost%3A3000%2Fapi%2Fauth%2Fstrava%2Fcallback&client_id=9769 
1097346 DISK_CACHE_ENTRY https://www.strava.com/oauth/authorize?response_type=code&redirect_uri=http%3A%2F%2Flocalhost%3A3000%2Fapi%2Fauth%2Fstrava%2Fcallback&client_id=9769 
1097347 HTTP_STREAM_JOB https://www.strava.com/ 
1097348 CONNECT_JOB pm/ssl/www.strava.com:443 
1097349 CONNECT_JOB pm/ssl/www.strava.com:443 
1097350 HOST_RESOLVER_IMPL_JOB www.strava.com 
1097352 SOCKET pm/ssl/www.strava.com:443 
1097353 CONNECT_JOB pm/ssl/www.strava.com:443 
1097354 SOCKET pm/ssl/www.strava.com:443 

내가 꺼내 듯 차이를 다음과 같이 호출은 추가 전화 번호

1097344 URL_REQUEST https://www.strava.com/oauth/authorize?response_type=code&redirect_uri=http%3A%2F%2Flocalhost%3A3000%2Fapi%2Fauth%2Fstrava%2Fcallback&client_id=9769 

이것은 이전 시나리오에서 작성되지 않았습니다.

이러한 관찰은 여권 - strava 패키지뿐만 아니라 여권 - 페이스 북 패키지도 마찬가지입니다. 그러므로, 나는이 상태에 들어가기 위해 내가하고있는 잘못된 잘못된 점이 있다고 생각한다.

모든 도움을 주시면 감사하겠습니다.

Answer 1

CORS에 대해 이미 알고 있으므로 자세한 내용을 알아 보겠습니다.

기본적으로 문제는 REST server이며, 브라우저가 불평하지 않도록 적절한 내용으로 응답 패킷의 헤더를 설정해야합니다. 불행히도 이것은 보안 기능입니다.

서버 코드에서 위의 작업을 수행 할 함수를 정의하고 HTTP가 통과 할 때 구문 분석해야하는 미들웨어 계층의 1로 설정해야합니다.

예 :

var express = require('express'); 
var app = express(); 

var httpAccessControlPolicy = function(req, res, next) { 
    res.setHeader('Access-Control-Allow-Origin', '*'); 
    res.setHeader('Access-Control-Allow-Methods', 'GET, POST, OPTIONS, PUT, PATCH, DELETE'); 
    res.setHeader('Access-Control-Allow-Headers', 'Content-type,Accept,X-Access-Token,X-Key,Authorization'); 
    res.setHeader('Access-Control-Allow-Credentials', false); 

    next(); 
}; 

app.use(httpAccessControlPolicy); 

예. 주석 기자 1이 지적한대로 npm 모듈 cors도 작업을 수행 할 수 있습니다.

CORS : 당신이 그것을 사용하려는 경우이 사용 예보고 될 수 https://www.npmjs.com/package/cors

: 당신은 당신의 서버에 CORS 헤더를 사용하려면이 플러그인을 사용할 수 있습니다

var express = require('express') 
    , cors = require('cors') 
    , app = express(); 

app.use(cors()); 

app.get('/products/:id', function(req, res, next){ 
    res.json({msg: 'This is CORS-enabled for all origins!'}); 
}); 

app.listen(80, function(){ 
    console.log('CORS-enabled web server listening on port 80'); 
});