2017-12-31 22 views
0

저는 각도 4를 프론트 엔드로 사용하고 laravel (홈 스테이 드 mydomain.test)을 백엔드로 사용합니다.Laravel CORS 오류 (비밀 번호 포함)

barryvdh/laravel-고르 구성 파일 (cors.php 설정 파일) :

return [ 

    /* 
    |-------------------------------------------------------------------------- 
    | Laravel CORS 
    |-------------------------------------------------------------------------- 
    | 
    | allowedOrigins, allowedHeaders and allowedMethods can be set to array('*') 
    | to accept any value. 
    | 
    */ 

    'supportsCredentials' => true, 
'allowedOrigins' => ['http://localhost:4200'], 
'allowedHeaders' => ['Content-Type','Accept'], 
'allowedMethods' => ['GET','POST','PUT', 'PATCH', 'OPTION'], 
'exposedHeaders' => ['Content-Disposition', 'x-total-count', 'x-filename', '*'], 
'maxAge' => 0, 
'hosts' => ['*'], 

각 4 내가 laravel의 API 백엔드에 각 4에서 쿠키를 보낼 때 오류가 아래 크롬 브라우저에 표시 요청 :

refreshToken(){ 

    const headers = new Headers({ 'Content-Type': 'application/x-www-form-urlencoded', 'Authorization': 'Bearer ' + this.getToken()}) 
    let options = new RequestOptions({ headers: headers, withCredentials: true }); 
    return this.http.post(API_DOMAIN + 'refresh', JSON.stringify({}), options) 
     .map(
     (response) => { 
      console.log(response.json()); 
      return response.json() 
     }, 
    ) 
    } 

브라우저 오류 :

Failed to load http://mydomian.test/api/refresh: Response to preflight request doesn't pass access control check: The value of the 'Access-Control-Allow-Origin' header in the response must not be the wildcard '*' when the request's credentials mode is 'include'. Origin 'http://localhost:4200' is therefore not allowed access. The credentials mode of requests initiated by the XMLHttpRequest is controlled by the withCredentials attribute.

+0

허용 헤더에 *를 넣으면 안됩니다. 허용 된 모든 요청 헤더를 지정해야합니다. allowHeaders => [ 'Content-Type, Accept']'' –

+0

@DevangNaghera allowedHeaders를 추가했지만 오류가 여전히 존재합니다! – Zione01

답변

0

이 코드를 넣어 년 그냥 어떤 laravel의 고르 필요하지 않습니다 : 는 각도 응용 프로그램의 루트에 proxy.conf.json을 만듭니다. 내부 경로와 객체를 넣어 :

{ 
    "/api": { 
    "target": "http://mydomian.test/", 
    "secure": false 
    } 
} 

난 그냥 내 모든 백엔드 URI를 api.php 내부에 있기 때문에 여기에 정의/API가 있습니다. http://localhost:4200/api/someitems/1과 같은 모든 호출은 http://mydomian.test/api/someitems/1으로 프록시됩니다. 그런 다음 package.json을 편집하고 스크립트 안의 start 값을 ng serve --proxy-config proxy.conf.json으로 변경하십시오. 이제 npm run start가 proxy로 시작합니다. 이 프록시에서 내가 가진 문제점은 URL (http://mydomian.test/)을 IP로 해결한다는 것입니다. IP로 Laravel을 호출하면 nginx 서버는 도메인 이름을 받아야하기 때문에 무엇을해야할지 모릅니다. nginx는 동일한 IP상의 여러 웹 사이트를 허용하므로 도메인 이름을 수신하거나 도메인 이름이없는 모든 호출을 리디렉션하는 기본 웹 사이트를 가져야합니다. Angular의 프록시에서 여전히 고정되어 있지 않은 경우 Laravel 시스템에서/etc/nginx/sites-available으로 이동하면 mydomian.test 설정 파일이 있습니다. 그것은 들어있다 80; 거기서 줄을 긋고, 기본값 80을 듣기 위해 바꿔라.

이제 API_DOMAIN 변수를 http://localhost:4200으로 변경 (또는 모두 제거)하고 CORS를 사용 중지 할 수 있습니다.

0

당신은 단순히 당신의 .htaccess 파일 내가이 문제를 해결

RewriteEngine On 
RewriteCond %{REQUEST_FILENAME} !-f 
RewriteCond %{REQUEST_FILENAME} !-d 
RewriteRule^index.php [QSA,L] 

Header add Access-Control-Allow-Origin "*" 
Header add Access-Control-Allow-Credentials true 
Header add Access-Control-Allow-Headers "authorization,language,Content-Type" 
Header add Access-Control-Allow-Methods "GET,POST,OPTIONS,DELETE,PUT" 
+0

localhost에서 구현 된 웹 앱! htaccess 안에 이러한 코드를 추가했지만 오류가 여전히 존재합니다! – Zione01