rest - How to enable CORS in an EmberJS application? -

i have emberjs application uses ember-data access data via rest api. rest api running on same machine on different port (although applies rest api's served domain.

when go url localhost:4200/items following error in firefox console:

content security policy: page's settings blocked loading of resource @ http://localhost:7654/api/items ("connect-src http://localhost:4200 ws://localhost:35729 ws://0.0.0.0:35729 http://0.0.0.0:4200").

i tried installing ember-cli-cors nothing changed. tried solution @ http://discuss.emberjs.com/t/ember-data-and-cors/3690, didn't work either. discussion 2013, that's not huge surprise.

the rest api written in python using flask , flask-cors. using network tab can see request being sent, , data being sent back, error still there. header access-control-allow-origin set http://localhost:4200 in response, expected.

app/router.js

import ember 'ember'; import config './config/environment';  var router = ember.router.extend({   location: config.locationtype });  export default router.map(function() {   this.route('items'); }); 

app/adapters/application.js

import ds 'ember-data';  export default ds.restadapter.extend({   namespace: 'api',   host: 'http://localhost:7654', }); 

app/routes/items.js

import ember 'ember';  export default ember.route.extend({   model: function() {     return this.store.find('item');   } }); 

app/models/item.js

import ds 'ember-data';  export default ds.model.extend({   name: ds.attr(), }); 

app/templates/items.hbs

{{#each item in items}}   {{ item.name }}<br> {{else}}   <p>no items</p> {{/each}}  {{outlet}} 

this csp issue not cors

inside config/environment.js find env.contentsecuritypolicy , add http://localhost:7654 'connect-src' key

e.g.

env.contentsecuritypolicy = {   // ... other stuff here   'connect-src': "'self' http://localhost:7654" } 

you need different setting production environment well.