1

I'm trying to access a node route through angular $http using the cors module. I've tried a simple

app.use(cors());

but still get the error. And I've tried adding from the cors documentation a whitelist of URLs

var corsOptions = {
  origin: function(origin, callback){
    var originIsWhitelisted = whitelist.indexOf(origin) !== -1;
    callback(null, originIsWhitelisted);
  }
};

app.get('/someroute/:someparam/', cors(corsOptions), function(req, res, next){
  mymodule.getData(req.params.someparam, function(err, data){
      if (err){
        console.log('error with route', err);
      }else{
        res.json({result: data});
      }
  });
});

But I'm still getting the error

XMLHttpRequest cannot load localhost:8888/someroute/undefined. Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https, chrome-extension-resource.

I thought that using the cors module was meant to avoid this problem. How can I solve?

8
  • I think you also need to allow it server side
    – cor
    Dec 15, 2015 at 16:33
  • CORS headers need to be set on the server, not the client.
    – Pointy
    Dec 15, 2015 at 16:33
  • How on earth are you loading your web app into your browser? Your URL (as quoted in the error message) doesn't appear to have any scheme associated with it at all, and the error message is complaining you aren't using HTTP.
    – Quentin
    Dec 15, 2015 at 16:34
  • @Pointy This is all in my server.js file, so when I spool up my server with node server.js in Terminal, shouldn't that exist server-side?
    – 1252748
    Dec 15, 2015 at 16:34
  • @Quentin App is loaded in browser with app.get('/', function(req, res){ res.sendfile('./index.html'); }); so I go to localhost:8888 and i see then index page. There's an ng-click on a button on that page which does an $http get to the route I showed in the question.
    – 1252748
    Dec 15, 2015 at 16:36

1 Answer 1

3

The problem here is that your client needs to make a request for the URL

http://localhost:8888/someroute/undefined

Instead, your client is making a request for

localhost:8888/someroute/undefined

which the browser interprets as a request for the host 8888 using the scheme localhost. However, localhost isn't a scheme that Chrome supports for CORS; only things like http, https, data are.

Somewhere, your client-side code does something like

xhr.send("localhost:8888/...")

but it needs a leading scheme, like http:// or https://.

Note that you get a similar error if you try to request a resource with a file or about scheme.

3
  • So how can I solve this? I've tried adding http:// to the beginning of the whitelist URL and the $http.get(), but it seemed to get confused about where to look for the route.
    – 1252748
    Dec 15, 2015 at 16:47
  • 1
    Your client needs to request the right thing. Your request possibly isn't even making it to the server. Whether or not it is, Chrome is shutting down the request because you're doing xhr.send("localhost:8888/...") somewhere, and Chrome sees that as an illegal localhost scheme.
    – apsillers
    Dec 15, 2015 at 16:48
  • It was because the parameter I was passing to the route is the location of a directory and I hadn't URI encoded it, so it didn't know where the hell it was going. When I encode it and pass it through the route to the node module, everything is processed and looks to be working great! Thanks for the help!
    – 1252748
    Dec 15, 2015 at 16:50

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.