요청시 AngularJS에서 헤더를 지정할 수 없습니다.

Question

내 응용 프로그램에 두 부분이 있습니다 - 각도 프론트 엔드 및 레일 서버. 도메인이 다르므로 기본적으로 요청이 작동하지 않습니다. 스택을 포함한 많은 스태프가 있지만 저에게는 효과적이지 않습니다.

이것은 각 컨트롤러의 내 방법 :

$scope.test =-> 
    # transform = (data) -> 
    # $.param data 

    $http.post('http://localhost:3000/session/create', 'token=some', 
    headers: 
     'Access-Control-Allow-Origin': 'http://localhost:9000', 
     'Access-Control-Allow-Methods': 'GET, POST, PUT, DELETE, OPTIONS', 
     'Access-Control-Allow-Headers': 'Content-Type, X-Requested-With' 
    # transformRequest: transform 
).success (responseData) -> 
    console.log(responseData) 

내가 데이터를 변환 주석, 서버 응답에 차이가 없다. 그런

내가 응용 프로그램을 구성 (일부 게시물에 이것을보고) :

.config ["$httpProvider", ($httpProvider) -> 
    $httpProvider.defaults.useXDomain = true 
    delete $httpProvider.defaults.headers.common["X-Requested-With"] 
] 

난 그 요청이 같은 아약스하지 되겠군요 (하지만 난 잘 모르겠어요).

하지만 내 요청에는 헤더가 없습니다. 일부 필드 Access-Control-Request-Headers:access-control-allow-origin, accept, access-control-allow-headers, access-control-allow-methods, content-type에서 그들은 모두 :

Request URL:http://localhost:3000/session/create 
    Request Method:OPTIONS 
    Status Code:404 Not Found 

    Request Headers 

    Accept:*/* 
    Accept-Encoding:gzip,deflate,sdch 
    Accept-Language:en-US,en;q=0.8,ru;q=0.6 
    Access-Control-Request-Headers:access-control-allow-origin, accept, access-control-allow-headers, access-control-allow-methods, content-type 
    Access-Control-Request-Method:POST 
    Connection:keep-alive 
    DNT:1 
    Host:localhost:3000 
    Origin:http://localhost:9000 
    Referer:http://localhost:9000/ 
    User-Agent:Mozilla/5.0 (Macintosh; Intel Mac OS X 10_8_5) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/31.0.1650.8 Safari/537.36 

    Response Headers 

    Content-Length:12365 
    Content-Type:text/html; charset=utf-8 
    X-Request-Id:2cf4b37b-eb47-432a-ab30-b802b3e33218 
    X-Runtime:0.030128 

크롬 콘솔 :

OPTIONS http://localhost:3000/session/create 404 (Not Found) angular.js:6730 
OPTIONS http://localhost:3000/session/create No 'Access-Control-Allow-Origin' header is  present on the requested resource. Origin 'http://localhost:9000' is therefore not allowed access. angular.js:6730 
XMLHttpRequest cannot load http://localhost:3000/session/create. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:9000' is therefore not allowed access. localhost/:1 

기타 중요하지 않은 정보 : 서버에서 :

class ApplicationController < ActionController::Base 
    before_filter :allow_cross_domain_access 

    protected 

    def allow_cross_domain_access 
    headers['Access-Control-Allow-Origin'] = '*'# http://localhost:9000 
    headers['Access-Control-Allow-Headers'] = 'GET, POST, PUT, DELETE' 
    headers['Access-Control-Allow-Methods'] = %w{Origin Accept Content-Type X-Requested-With X-CSRF-Token}.join(',') 
    headers['Access-Control-Max-Age'] = '1728000' 

    end 
end 

경로는 post "session/create" 분명하다. 그리고 세션 컨트롤러 :

class SessionController < ApplicationController 
    respond_to :json, :html, :js 

    def create 
    respond_with "logged in" 
    # render nothing: true 
    end 
end 

최신 1.2.0.rc-2 각도 버전을 사용합니다. this is my project on github

Answer 1

예제에서 요청 헤더와 응답 헤더가 섞여 있습니다.

CORS (Cross Domain Request)를 수행 할 때 일반 GET과 다른 것을 만들 때 (예 : POST 또는 사용자 정의 헤더 추가) 브라우저는 먼저 OPTIONS 요청을합니다.

이

OPTIONS http://localhost:3000/session/create 404 (Not Found) angular.js:6730 

서버는 다음 OPTIONS 요청의 응답에 적절한 헤더를 추가해야합니다 이것은 당신이 개발자 콘솔에서 볼 것입니다.

따라서 각도 통화에서 맞춤 헤더를 삭제할 수 있습니다. 다음으로 서버/응용 프로그램이 404를 반환하지 않고 OPTIONS 요청에 응답해야합니다.