Non 'Accès-Contrôle-Autoriser-Origine'

Question

Je demande une image de Cloudfront CDN. chaque fois que je fais une demande du client j'obtiens cette erreur:

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.

J'utilise exprès pour le serveur et ont ajouté les éléments suivants pour permettre l'accès, mais toujours pas de chance ..

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(); 
}) 

Un conseil serait grandement apprécié!

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

Mise à jour

Salut @ jfriend00

Alors, que mon objectif est de servir du contenu protégé sur CF CDN. Pour cela, j'envoie des cookies signés au client en utilisant le module suivant ci-dessous.

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]); 
} 

Je fais simplement une demande du client au cdn pour aller chercher l'image avec: <img src="https://cdn.mywebsite.com/image.png" crossorigin="anonymous" alt="test picture">

À ce stade, l'accès-Control-Allow-Origin erreur est affiché dans la console.

Note:

var signedUrl = cf.getSignedUrl('https://cdn.mywebsite.com/image.png', options) 

Ce signedUrl fonctionne directement lors de l'accès mais pas si je fais la demande de localhost ou le site Web elle-même.

Answer 1

Les en-têtes CORS doivent être sur le serveur qui sert la ressource. Donc, si la ressource sur laquelle vous obtenez l'erreur CORS est https://cdn.mywebsite/image.png, alors c'est l'hôte qui doit autoriser l'accès CORS. Vous ne pouvez pas résoudre ce problème en autorisant CORS sur localhost.

FYI, il semble étrange que vous obteniez une erreur CORS lors de l'accès à une image. Si vous utilisez la balise <img> pour l'accès, la balise <img> ne sera pas soumise aux mêmes restrictions d'origine. Les mêmes restrictions d'origine s'appliquent aux appels Ajax effectués à partir du navigateur Javascript.

Je n'ai pas non plus l'impression que vous mélangez http et https dans la même page, ce qui peut aussi causer des problèmes.

Etes-vous en train d'essayer de télécharger l'image avec Ajax? Veuillez montrer votre code client qui cause cette erreur et expliquer ce que vous essayez d'accomplir et peut-être que nous pouvons offrir une solution différente.