For CORS Error Do i need to configure on client side(Angular js) also?

Question

Error:XMLHttpRequest cannot load https://thirdPartyasite/template.html. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:3000' is therefore not allowed access.

I am using Rails application which is consuming Cross orgin data through ajax call.The answers Provided by this question not working.

1)How to set access-control-allow-origin in webrick under rails?

2)https://demisx.github.io/rails-api/2014/02/18/configure-accept-headers-cors.html

3)Allow anything through CORS Policy.

I dont have control over the client app.How to overcome this problem.

I tried This one:

before_filter :set_headers
  def set_headers
    headers['Access-Control-Allow-Origin'] = '*'
    headers['Access-Control-Allow-Methods'] = 'POST, PUT, DELETE, GET, OPTIONS'
    headers['Access-Control-Request-Method'] = '*'
     headers['Access-Control-Allow-Headers'] = 'Origin, X-Requested-With, Content-Type, Accept, Authorization'
  end

Still the same error is coming.

Tried This also: In gem file added:gem 'rack-cors', :require => 'rack/cors' In config/application.rb:

config.middleware.insert_before 0, "Rack::Cors" do
  allow do
    origins '*'
    resource '*', :headers => :any, :methods => [:get, :post, :options]
  end
end

Still Getting same error.

Work Around For Dev Environment: Install CORS Chrome plugin. But I need Proper Solution

You may need to post some code (what you have done so far that is not working). — Leonel Machava, Nov 13 '15 at 10:02

score 1 · Accepted Answer · answered Nov 13 '15 at 10:05

1

Angular $sceDelegateProvider can throw exception while you sourcing Angular templates with CORS. For more read sceDelegateProvider official documentation

For testing purposes you can use this:

angular.module('myApp', []).config(function($sceDelegateProvider) {
  $sceDelegateProvider.resourceUrlWhitelist([
        'self',
        'http://**',
        'https://**'
  ]);
});

answered Nov 13 '15 at 10:05

Marek Pavelek

1,097
12
12

This Might be the issue I am requesting for angular template only. But I dont have access to That code I let People know regarding this and I will try – Praveenkumar Nov 13 '15 at 10:31
I got a chance to walk through the code They have configured only certain number of whitelist url.Thanks For the suggestion. – Praveenkumar Nov 13 '15 at 11:30

score 0 · Answer 2 · answered Nov 13 '15 at 10:00

0

You do not need to configure anything on Angular.

To enable CORS you just configure the server as you see in the links to the answers you posted.

answered Nov 13 '15 at 10:00

Leonel Machava

1,501
11
19

I tried Every thing but still it throwing error But the headers got added in Response. – Praveenkumar Nov 13 '15 at 10:08

score 0 · Answer 3 · answered Nov 13 '15 at 10:22

CORS is a server-side constraint only.

If you have access to your Rails app, you'll be best using the Rack-CORS gem to enabled specific resources/origins:

#config/application.rb
...
  config.middleware.insert_before 0, "Rack::Cors" do
    allow do
      origins '*'
      resource '*', :headers => :any, :methods => [:get, :post, :options]
    end
  end

If you don't have access to your server-side rails app, you need to gain access, otherwise it won't work.

For CORS Error Do i need to configure on client side(Angular js) also?

3 Answers3