Setting CORS for static files on ember-cli server

Question

How do I set CORS on requests for fonts files (or any other static resource) on the built in ember-cli server?

This is the error message just for reference:

Font from origin 'http://some-domain:4200' has been blocked from loading by Cross-Origin Resource Sharing policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:61277' is therefore not allowed access.

Answer 1

Add the following to ENV in config/environment.js:

module.exports = function(environment) {
    contentSecurityPolicyHeader: 'Content-Security-Policy',
    contentSecurityPolicy: {
      // ... other stuff here
      'font-src': "'self' http://some-domain:4200",
    },
}

Answer 2

I tried adding the CSP settings but it was unsuccessful for me. I still got CORS errors for font files being referenced from my Ember app's CSS. In another post I saw someone mention ember-cli-cors which I tried and seemed to solve the issue for me. It just adds CORS headers allowing requests from everywhere to all resources which is exactly what I needed to get all resources to load properly in my local dev environment serving the Ember app assets using ember-cli's built in ember serve command to another local development server running a Python app serving my index.html from Redis(ember-cli-deploy style).