2017-03-01 11 views
0

Cloudfront CDNからイメージを要求しています。いいえ 'アクセス制御許可元'

Access to Image at https://cdn.mywebsite/image.png from origin http://localhost:5000 has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin http://localhost:5000 is therefore not allowed access. The response had HTTP status code 403.

私は、サーバー用のExpressを使用していますし、アクセスを許可するには、次のそれでも運..

app.use((req, res, next) => { 
    res.setHeader('Access-Control-Allow-Origin', "*"); 
    res.setHeader('Access-Control-Allow-Methods', 'GET'); 
    res.setHeader('Access-Control-Allow-Headers', 'Content-Type'); 
    next(); 
}) 
を追加しました:私は、私はこのエラーを取得していたクライアントからの要求を行うたびに

アドバイスをいただければ幸いです!

============================================== ============================

更新

こんにちはjfriend00

@だから私の目標は何ですかCF CDNを介して保護されたコンテンツを配信する。

このため、以下のモジュールを使用して、署名されたCookieをクライアントに送信しています。この時点で、アクセス・コントロール・原産の許可エラーがコンソールに表示されているが <img src="https://cdn.mywebsite.com/image.png" crossorigin="anonymous" alt="test picture">

var cf = require('aws-cloudfront-sign') 
var options = {keypairId: 'keypairId', privateKeyPath: '/foo/bar'} 
var signedCookies = cf.getSignedCookies('https://cdn.mywebsite.com/*', options); 

for(var cookieId in signedCookies) { 
res.cookie(cookieId, signedCookies[cookieId]); 
} 

は、その後、私は単純にして画像を取得するために、CDNに、クライアントからの要求を作っています。

注:

直接ではなく、それをアクセスするとき、私は、ローカルホストまたはウェブサイトそれ自身からの要求を行う場合には、このsignedUrl作品
var signedUrl = cf.getSignedUrl('https://cdn.mywebsite.com/image.png', options) 

答えて

1

CORSヘッダーはリソースを提供しているサーバー上に存在する必要があります。したがって、CORSエラーを取得しているリソースがhttps://cdn.mywebsite/image.pngである場合、それはCORSアクセスを許可するホストです。 CORSをlocalhostに設定することで修正できません。

FYI、画像にアクセスするときは、CORSエラーを取得していることを奇妙に思えます。アクセスに<img>タグを使用すると、<img>タグは同じ発信元の制限を受けません。ブラウザJavascriptからのAjax呼び出しにも同じ原点制限が適用されます。

私はまた、あなたはまた、問題を引き起こす可能性があり、同じページにHTTPとHTTPSを混合することが表示されないこと。

Ajaxで画像をダウンロードしようとしていますか?このエラーの原因となっているクライアントコードを表示し、達成しようとしていることを説明してください。おそらくは別の解決策を提供することができます。

+0

こんにちは@ jfriend00正しい方向に私を指してくれてありがとう。私は私のスタックで迷子になっていた。私は私の質問を更新しました、もう一度ありがとう! – Dave

+0

@Dave - なぜ ''タグの' crossorigin = "anonymous" '属性を設定していますか?それが必要ですか? – jfriend00

+0

はい、その必要はありません! – Dave

関連する問題