how to resolve No 'Access-Control-Allow-Origin' header is present on the requested resource

Question

As I am running following set of the code

1. AngularJS
2. HTML

3. Error

Answer 1

Installing above mentioned plugin for chrome is not a permanent solution for your issue and you cannot ask the end user to do the same.

Best way to do is to handle it in your api code.

There are plenty of resources available to see how it is configured for various languages api. The following link will make you to understand about it and how to configure.

Why does my JavaScript get a “No 'Access-Control-Allow-Origin' header is present on the requested resource” error when Postman does not?

Answer 2

You can try below plugin in chrome browser: Core extension

And if you want to add on server side then on server you can add below headers (for PHP add this in index.php)

header("Access-Control-Allow-Origin:*");
header('Access-Control-Allow-Methods: GET, POST, OPTIONS, DELETE, PUT');
header('Access-Control-Allow-Headers: Origin, Content-Type, Accept, Authorization, X-Request-With, X-CLIENT-ID, X-CLIENT-SECRET');
header('Access-Control-Allow-Credentials: true');