node-vibrant: Not working on cross origin

I’m using vibrant in the browser and the images are on a different server than the one serving my app, actually they’re Google Places photos. I tried in both loading a string or an but I always got a Cross-Origin error. My browser is Firefox.

I think cross origin images is a common scenario, how do you make it work?

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

About this issue

Original URL
State: open
Created 5 years ago
Reactions: 8
Comments: 16 (1 by maintainers)

Most upvoted comments

Any updates regarding this?

+11

jooohyunpark on Sep 3, 2020

Using cors-anywhere worked for me. All you have to do is prepend the cors-anywhere URL to the URL of your image.

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

Then use that to pass to the Vibrant builder. Note that you can’t use this cors URL if you’re just trying to load it into an img src or background-image, etc – you’ll need to use the direct URL for that still.

SmartASCII on Sep 20, 2019

@SmartASCII while this might work for some instances, hammering cors-anywhere for larger scale projects would not be ideal (nor would leaking data that way). I’d suggest allowing the headers for any Vibrant request to be able to be modified added as a feature to node-vibrant

crutchcorn on Sep 20, 2019

I found a workaround, you can directly pass an Image to vibrant, and set crossOrigin to anonymous

We’re doing this, but unfortunately that’s not solving the problem for us either. Still looking for a solution and will report back if I find one.

Edit: Finally got it to work. It was indeed an image caching issue. And a frustrating one at that. I tried adding “?not-from-cache-please” to the end of my image urls and my code was not updating and I didn’t realize it. Once I finally got it to update, adding that to the end of my images fixed the issue.

deggertsen on Nov 18, 2022