1
resposta

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at http://localhost:3000/photos/upload. (Reason: CORS request did not succeed).

Boa noite!

Não estou conseguindo fazer a requisição de upload da imagem, conforme explicado no vídeo. No meu caso, a requisição não completa e eu recebo a seguinte mensagem no console do Firefox:

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at http://localhost:3000/photos/upload. (Reason: CORS request did not succeed).

Já passei por esse problema em outras arquiteturas e resolvi modificando o cabeçalho de resposta do servidor. Tentei fazer o mesmo no alurapic-api, modificando o arquivo config/express.js adicionando

app.use(function (req, res, next) {
    res.setHeader('Access-Control-Allow-Origin', '*');
    res.setHeader('Access-Control-Allow-Methods', 'GET, POST, PUT, DELETE');
    res.setHeader('Access-Control-Allow-Headers', 'Content-Type');
    res.setHeader('Access-Control-Allow-Credentials', true);
    next();
});

após

app.set('secret', 'your secret phrase here');
app.set('upload', upload);

mas o erro permanece.

Alguém poderia me socorrer ou dar uma dica de onde eu possa ter errado na configuração?

1 resposta

Fala ai Alysson, tudo bem? Tente liberar todos os métodos e cabeçalhos também:

app.use(function (req, res, next) {
    res.setHeader('Access-Control-Allow-Origin', '*');
    res.setHeader('Access-Control-Allow-Methods', '*');
    res.setHeader('Access-Control-Allow-Headers', '*');
    next();
});

Caso não funcione, você pode tentar usar a biblioteca cors (o que recomendo): https://www.npmjs.com/package/cors

Espero ter ajudado.