Solution to: "Origin is not allowed by Access-Control-Allow-Origin." with AngularJS and ngResource ($resource)

I just spent way to much time trying to figure out why I kept getting this error:

Origin is not allowed by Access-Control-Allow-Origin.

Here’s the code snippet:

var resource = $resource('http://localhost:17482/api/x/:id', { id: '@id' });

After a lot of digging I discovered that you need to escape the port when using $resource. Here’s the issue thread on github

var resource = $resource('http://localhost\\:17482/api/x/:id', { id: '@id' });

Add those two slashes before the port and the error goes away.

Hope I just saved you hours of pain.

Jon