close

[Solved] Response to preflight request doesn’t pass access control check: No ‘Access-Control-Allow-Origin’ header is present on the requested resource

Hello Guys, How are you all? Hope You all Are Fine. Today I am just making a simple API call But I am facing the following error Response to preflight request doesn’t pass access control check: No ‘Access-Control-Allow-Origin’ header is present on the requested resource in Javascript. So Here I am Explain to you all the possible solutions here.

Without wasting your time, Let’s start This Article to Solve This Error.

How Response to preflight request doesn’t pass access control check: No ‘Access-Control-Allow-Origin’ header is present on the requested resource Error Occurs ?

I am just making a Simple API call But I am facing the following error.

XMLHttpRequest cannot load http://server.apiurl.com:8000/u/login?login=facebook. Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost' is therefore not allowed access. Error 405

How To Solve Response to preflight request doesn’t pass access control check: No ‘Access-Control-Allow-Origin’ header is present on the requested resource Error ?

  1. How To Solve Response to preflight request doesn’t pass access control check: No ‘Access-Control-Allow-Origin’ header is present on the requested resource Error?

    To Solve Response to preflight request doesn’t pass access control check: No ‘Access-Control-Allow-Origin’ header is present on the requested resource Error Just Turn off CORS For Windows: Open the start menu Type windows+R or open “Run” Execute the following command: chrome.exe –user-data-dir=”C://Chrome dev session” –disable-web-security

  2. Response to preflight request doesn’t pass access control check: No ‘Access-Control-Allow-Origin’ header is present on the requested resource

    To Solve Response to preflight request doesn’t pass access control check: No ‘Access-Control-Allow-Origin’ header is present on the requested resource Error Just Turn off CORS For Windows: Open the start menu Type windows+R or open “Run” Execute the following command: chrome.exe –user-data-dir=”C://Chrome dev session” –disable-web-security

Solution 1: Turn off CORS

For Windows:

  1. Open the start menu
  2. Type windows+R or open “Run”
  3. Execute the following command: chrome.exe --user-data-dir="C://Chrome dev session" --disable-web-security

For Mac:

  1. Go to Terminal
  2. Execute the following command: open /Applications/Google\ Chrome.app --args --user-data-dir="/var/tmp/Chrome dev session" --disable-web-security

Solution 2: Add This line in API

Here My “API Server” is a PHP Application so to solve this problem I found the below solution to work. Place the lines in index.php

header('Access-Control-Allow-Origin: *');
header('Access-Control-Allow-Methods: GET, POST, PATCH, PUT, DELETE, OPTIONS');
header('Access-Control-Allow-Headers: Origin, Content-Type, X-Auth-Token');

Solution 3: try this


For windows users with Chrome Versions 60.0.3112.78 (the day the solution was tested and worked) and at least until today 19.01.2019 (ver. 71.0.3578.98). You do not need to close any chrome instance.

  1. Create a shortcut on your desktop
  2. Right-click on the shortcut and click Properties
  3. Edit the Target property
  4. Set it to “C:\Program Files (x86)\Google\Chrome\Application\chrome.exe” –disable-web-security –user-data-dir=”C:/ChromeDevSession”
  5. Start chrome and ignore the message that says –disable-web-security is not supported!

BEWARE NOT TO USE THIS PARTICULAR BROWSER INSTANCE FOR BROWSING BECAUSE YOU CAN BE HACKED WITH IT!

Summery

It’s all About this issue. Hope all solution helped you a lot. Comment below Your thoughts and your queries. Also, Comment below which solution worked for you?

Also, Read

Leave a Comment