Node-vibrant: Não funciona na origem cruzada

Criado em 3 set. 2019 · 9Comentários · Fonte: Vibrant-Colors/node-vibrant

Estou usando o vibrante no navegador e as imagens estão em um servidor diferente daquele que serve meu aplicativo; na verdade, são fotos do Google Places. Eu tentei carregar uma corda ou um mas sempre recebo um erro de origem cruzada. Meu navegador é o Firefox.

Acho que imagens de origem cruzada são um cenário comum, como você faz isso funcionar?

Cross-Origin Request Blocked:
The Same Origin Policy disallows reading the remote resource at
https://maps.googleapis.com/maps/api/place/js/PhotoService.G...
(Reason: CORS header ‘Access-Control-Allow-Origin’ missing).

Luca

good first issue

Fonte

lucafaggianelli

👍1

Comentários muito úteis

Alguma atualização sobre isso?

jooohyunpark em 3 set. 2020

👍4 ❤1

Todos 9 comentários

Usar cors em qualquer lugar funcionou para mim. Tudo o que você precisa fazer é acrescentar o URL cors-anywhere ao URL da sua imagem.

vibrantUrl= "https://cors-anywhere.herokuapp.com/" + imageUrl;

Em seguida, use isso para passar para o construtor vibrante. Observe que você não pode usar este URL cors se estiver apenas tentando carregá-lo em um img src ou imagem de fundo, etc - você precisará usar o URL direto para essa imagem estática.

SmartASCII em 20 set. 2019

👎2

@SmartASCII embora isso possa funcionar para alguns casos, martelar cors-anywhere para projetos de grande escala não seria ideal (nem seria o vazamento de dados dessa forma). Sugiro permitir que os cabeçalhos de qualquer solicitação Vibrant possam ser modificados e adicionados como um recurso a node-vibrant

crutchcorn em 20 set. 2019

Sim, o proxy poderia funcionar, mas como uma solução temporária, eu não o usaria
em produção. No final, estou enviando fotos para o meu servidor e o problema é
resolvido

Na sexta-feira, 20 de setembro de 2019, 20:54 Corbin Crutchley [email protected]
escreveu:

@SmartASCII https://github.com/SmartASCII enquanto isso pode funcionar para
alguns casos, martelar cors em qualquer lugar para projetos de maior escala
não seria ideal (nem seria o vazamento de dados dessa forma). Eu sugiro permitir o
cabeçalhos de qualquer solicitação vibrante para poder ser modificada e adicionada como
recurso para nó vibrante
-
Você está recebendo isto porque é o autor do tópico.
Responda a este e-mail diretamente, visualize-o no GitHub
https://github.com/akfish/node-vibrant/issues/101?email_source=notifications&email_token=ABCDSA4GJKDYSKYAUY6C5ADQKUL5TA5CNFSM4ITLGRV2YY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOD7HSY5I#issuecomment-533671029 ,
ou silenciar o tópico
https://github.com/notifications/unsubscribe-auth/ABCDSAYXIIX65U3I25N256LQKUL5TANCNFSM4ITLGRVQ
.

lucafaggianelli em 20 set. 2019

Mesmo problema, trabalhando em uma maneira de corrigi-lo!

Areskul em 17 abr. 2020

Alguma ideia de como consertar isso? Estou usando o react-palette com imagens no S3 e de vez em quando recebo o erro CORS.

Danistc em 5 mai. 2020

Usei CORS em qualquer lugar para garantir que uma solução como essa funcionasse e, em seguida, coloquei minha própria solução de proxy CORS em meu projeto Node para que eu pudesse redirecionar localmente - estou funcionando bem há meses.

SmartASCII em 5 mai. 2020

Alguma atualização sobre isso?

jooohyunpark em 3 set. 2020

👍4 ❤1

alguém tentando consertar isso?

RohitKaushal7 em 25 jan. 2021

Usar cors em qualquer lugar funcionou para mim. Tudo o que você precisa fazer é acrescentar o URL cors-anywhere ao URL da sua imagem.
vibrantUrl= "https://cors-anywhere.herokuapp.com/" + imageUrl;
Em seguida, use isso para passar para o construtor vibrante. Observe que você não pode usar este URL cors se estiver apenas tentando carregá-lo em um img src ou imagem de fundo, etc - você precisará usar o URL direto para essa imagem estática.

adicionando cors em qualquer lugar que não esteja funcionando em meu projeto angular 10. node-vibrant incapaz de carregar imagens do servidor devido a cors-policy.
alguém tem alguma solução melhor para este problema?