Accessing Magento REST APIs from localhost - Blocked by CORS policy

[surenkonathala]

Installed Bitnami Magento 2.3.5-p1 (on CentOs using Bitnami Magento). Site is running at http://138.197.235.67/

Wanted to access the REST API's from an angular application running on http://localhost:4200

(code snippet)

const httpHeaders = new HttpHeaders ({
        'Content-Type':  'application/json',
        'Authorization': 'Bearer xxx',
});

return this.http.get<any>(`http://138.197.235.67/rest/V1/products?searchCriteria[pageSize]=5`, {headers: httpHeaders});

Error on browser:

Access to XMLHttpRequest at 'http://138.197.235.67/rest/V1/products?searchCriteria[pageSize]=5' from origin 'http://localhost:4200' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: It does not have HTTP ok status.

Referring to other similar issues in community, added:

sudo vi /opt/magento-2.3.5-1/apps/magento/conf/httpd-app.conf

...
<Directory "/opt/magento-2.3.5-1/apps/magento/htdocs">
...
   # to enable CORS
   Header set Access-Control-Allow-Origin "*"
...

And added:

sudo vi /opt/magento-2.3.5-1/apache2/conf/bitnami/bitnami.conf

<IfModule mod_headers.c>
    SetEnvIf Accept application/json API
    Header always set Access-Control-Allow-Origin "*" env=API
    Header always set Access-Control-Allow-Methods "POST, GET, OPTIONS, DELETE, PUT" env=API
    Header always set Access-Control-Allow-Headers "Access-Control-Allow-Headers, Origin, Accept, X-Requested-With, Content-Type, Access-Control-Request-Method, Access-Control-Request-Headers, Authorization" env=API
  </IfModule>

Restarted all services. Still the issue.

Do not want to install another plugin https://github.com/splashlab/magento-2-cors-requests

[Bhanu Periwal]

Hi @surenkonathala 

Please add in .htaccess on the top.
Header add

Access-Control-Allow-Origin "#fully_qualified_domain_name#"

Header always set

Access-Control-Allow-Headers "Access-Control-Allow-Headers, Origin, Accept, X-Requested-With, Content-Type, Access-Control-Request-Method, Access-Control-Request-Headers, Authorization"

Note : Replace with Fully qualified domain name with trailing slash at the end. Use https if you are using it. Upload this in the main store .htaccess file located at root.

If issue resolve, Please click on 'Kudos' & Accept as Solution!

[surenkonathala]

Thanks @Bhanu Periwal 

Added them to htaccess and was able to see the changes in browser, but still the request fails. I tried all combinations for

`Access-Control-Allow-Origin: *`

`Access-Control-Allow-Origin: http://localhost`

`Access-Control-Allow-Origin: http://lcoalhost:4200/`

Same works in Postman

[surenkonathala · Accepted solution]

Here's the solution.

Add the below lines in `.htaccess`

If it is Bitnami Magento then '/opt/<install-folder-name>/apps/magento/conf/htaccess.conf`

<Directory "/opt/magento-2.3.5-1/apps/magento/htdocs">
...
...
<IfModule mod_headers.c>
...
    Header always set Access-Control-Allow-Origin "*"
    Header always set Access-Control-Allow-Headers "Content-Type, Authorization"
    Header always set Access-Control-Allow-Methods "GET"
    Header always set Access-Control-Expose-Headers "Content-Security-Policy, Location"
    Header always set Access-Control-Max-Age "600"

    RewriteEngine On
    RewriteCond %{REQUEST_METHOD} OPTIONS
    RewriteRule ^(.*)$ $1 [R=200,L]
...
...
</IfModule>

[Omid_265]

this is worked for me::

add below lines to <IfModule mod_rewrite.c> on .htaccess

RewriteEngine on
RewriteCond %{REQUEST_METHOD} OPTIONS
RewriteRule ^(.*)$ "index.html" [R=200,E=API:1,PT]

then add below lines to <IfModule mod_headers.c> on .htaccess

SetEnvIf Accept application/json API
Header always set Access-Control-Allow-Origin "*" env=API
 ## the below line is optional
Header always set Access-Control-Allow-Methods "POST, GET, OPTIONS, DELETE, PUT" env=API
Header always set Access-Control-Allow-Headers "Access-Control-Allow-Headers, Origin, Accept, X-Requested-With, Content-Type, Access-Control-Request-Method, Access-Control-Request-Headers, Authorization" env=API

Omid_265@ymail.com

[snehagowda11ff]

to which .htaccess file this lines were added, i can see many htaccess files.