CORS AllowedOrigin not working consistently


#1

Our app is hosted on Galaxy and images load from Amazon S3. I’ve set up a CORS to allow Access-Control-Allow-Origin, but images are not showing on canvas in Safari — and inconsistently on Chrome.

Is there anything wrong with these settings?

S3: CORS configuration

<?xml version="1.0" encoding="UTF-8"?>
<CORSConfiguration xmlns="http://s3.amazonaws.com/doc/2006-03-01/">
<CORSRule>
    <AllowedOrigin>*</AllowedOrigin>
    <AllowedMethod>GET</AllowedMethod>
    <MaxAgeSeconds>3000</MaxAgeSeconds>
    <AllowedHeader>*</AllowedHeader>
</CORSRule>
</CORSConfiguration>

Meteor: main.js

import { WebApp } from 'meteor/webapp';

WebApp.rawConnectHandlers.use(function(req, res, next) {
  res.setHeader('Access-Control-Allow-Origin', '*');
  return next();
});

Safari Error: Cross-origin image load denied by Cross-Origin Resource Sharing policy.

Thanks for any pointers!


#2

Not sure how much it will help, but our CORS config looks just like that for S3. We go through imgix for almost everything, but we are able to fetch assets directly from S3 also. We don’t set any additional headers.