2016-08-06 1 views
1

私はMEAN Stack User Registration and Login Example & Tutorialを私のアプリケーションのベースとして使用しています。これは、実行機能ですべてのリクエストに認証ヘッダを追加します。リクエストから承認ヘッダを削除するには

$http.defaults.headers.common['Authorization'] = 'Bearer ' + $window.jwtToken; 

私はCloudinaryに画像をアップロードしたいが、私はこのエラーを取得しています:

XMLHttpRequest cannot load https://api.cloudinary.com/v1_1/xxxx/upload . Request header field Authorization is not allowed by Access-Control-Allow-Headers in preflight response.

どのように私はのために特別にこのヘッダを削除することができます曇りのリクエスト?

答えて

9

リクエストのURLをチェックし、一致する場合はヘッダーをクリアするインターセプターが必要です。代わりに$http設定パラメータを使用することもできます。インターセプター使用

$http.post('https://api.cloudinary.com/v1_1/' + someId + '/upload', data, { headers: {} });

パラメータを使用して

.factory('cloudinaryInterceptor', function() { 
return { 
    request: function(config){ 
    var authHeader = config.headers('authorization'); 
    //Check for the host 
    var regex = /api.cloudinary.com/i; 
    if(regex.test(config.url)) 
    //Detach the header 
    delete config.headers.authorization; 
    return config; 
    } 
} 
}); 

する設定段階で迎撃をプッシュすることを忘れないでくださいを

$httpProvider.interceptors.push('cloudinaryInterceptor'); 
0

この質問は以前に聞かれました。答えはhereです。

When you start playing around with custom request headers you will get a CORS preflight. This is a request that uses the HTTP OPTIONS verb and includes several headers, one of which being Access-Control-Request-Headers listing the headers the client wants to include in the request.

You need to reply to that CORS preflight with the appropriate CORS headers to make this work. One of which is indeed Access-Control-Allow-Headers. That header needs to contain the same values the Access-Control-Request-Headers header contained (or more).

関連する問題