cancel
Showing results for 
Search instead for 
Did you mean: 

Accessing Magento REST APIs from localhost - Blocked by CORS policy

SOLVED
Highlighted

Accessing Magento REST APIs from localhost - Blocked by CORS policy

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

1 ACCEPTED SOLUTION

Accepted Solutions
Highlighted

Re: Accessing Magento REST APIs from localhost - Blocked by CORS policy

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>

Screen Shot 2020-06-11 at 6.24.29 PM.png

 

View solution in original post

3 REPLIES 3
Highlighted

Re: Accessing Magento REST APIs from localhost - Blocked by CORS policy

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!

Highlighted

Re: Accessing Magento REST APIs from localhost - Blocked by CORS policy

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/`

 

Screen Shot 2020-06-11 at 8.35.51 AM.png

 

Same works in Postman

 

Highlighted

Re: Accessing Magento REST APIs from localhost - Blocked by CORS policy

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>

Screen Shot 2020-06-11 at 6.24.29 PM.png

 

View solution in original post