0

My code:

header('Access-Control-Allow-Origin: *'); header('Access-Control-Allow-Methods: GET, POST'); header("Access-Control-Allow-Headers: X-Requested-With");

above code I am using api controller with header files. In the html page I am using angularjs form fields. When I submit a form, I got error like

(Reason: CORS header 'Access-Control-Allow-Origin' missing)

When I am using file input, I got error like (CORS header 'Access-Control-Allow-Origin' missing).

peterh
  • 11,875
  • 18
  • 85
  • 108
PARTHIBAN M
  • 131
  • 3
  • 13

2 Answers2

0

Here

I like to put my CORS handler as a piece of middleware in my Express server. I assume yours is app.js because there is no other server file you mentioned.

var allowCrossDomain = function(req, res, next) {
    if ('OPTIONS' == req.method) {
      res.header('Access-Control-Allow-Origin', '*');
      res.header('Access-Control-Allow-Methods', 'GET,PUT,POST,DELETE,PATCH,OPTIONS');
      res.header('Access-Control-Allow-Headers', 'Content-Type, Authorization, Content-Length, X-Requested-With');
      res.send(200);
    }
    else {
      next();
    }
};

app.use(allowCrossDomain);

you need to define this in your server.js file first like this, you need to tell the server to expect cross domain requests.

Please read the following articles if you still don't understand how CORS works or how to configure it.

http://jonathanmh.com/how-to-enable-cors-in-express-js-node-js/ http://justindavis.co/2015/08/31/CORS-in-Express/

app.all('/*', function(req, res, next) {
  res.header("Access-Control-Allow-Origin", "*");
  res.header("Access-Control-Allow-Headers", "X-Requested-With, Content-Type");
  res.header("Access-Control-Allow-Methods", "GET, POST","PUT");
  next();
});

OR you could also sent it from your router.post for instace

route.post('/abc', function(req,res,next){ 
        res.header('Access-Control-Allow-Origin', '*'); 
        res.header('Access-Control-Allow-Methods', 'GET, POST');
        res.header('Access-Control-Allow-Headers', 'Origin, X-Requested-With, Content-Type, Accept');
        return res.send(200);
    });

and then send the headers from angular part.

Wcan
  • 840
  • 1
  • 10
  • 31
  • Please mention,where i need to insert these two coding. either index.html or app.js or api controller. – PARTHIBAN M Jun 01 '16 at 10:53
  • I just mentioned "SERVER.JS" Please read the first line and you DON'T need to insert both of them, there is an OR between two codes, you can insert this code where you are configuring your express server, for example if its app.js file, then do this, watch the update above the numbers of characters are exceeding. – Wcan Jun 01 '16 at 11:04
  • Ok, did you see the update ? all you have to do is to copy and paste this code "WITHIN" your express configuration. – Wcan Jun 01 '16 at 11:07
  • _"because there is no other server file you mentioned"_ Neither did the OP mention Express. `app.js` can be an Angular file and the question has a `yii` tag, which is a PHP framework. – a better oliver Jun 01 '16 at 12:03
  • Ooo my bad, sorry I didn't looked at the yii tag. – Wcan Jun 01 '16 at 12:09
0

You are calling web service in a different project from your Client project. And you have added service reference in your Client project. So, When you call service from JavaScript, you are not allowed to do so.
It happens, because CORS are not enabled for your Service project.

See this Article for: What is CORS?

How to overcome the problem?

There is one way to overcome the problem, is using JSONP. example here

How to enable CORS?

  1. Adding Header Access-Control-Allow-Origin in web-config file of Service Project
  2. Create a Global.asax in Service Project and Add this code to the Global.asax.cs

example here
And in both ways, no need to do any modifications in RESTclient project solution.

Community
  • 1
  • 1
Adhik
  • 156
  • 1
  • 3
  • 11