No Access-Control-Allow-Origin header is present on the requested resource Origin is therefore not allowed access

Question

I m using  htaccess to rewrite urls and I used html base tag in order to make it work   Now  when I try to make an ajax request I get the following error      XMLHttpRequest cannot load http   www example com login php  No  Access-Control-Allow-Origin  header is present on the requested resource  Origin  http   example com  is therefore not allowed access

User · Answer

Basically alter API header response by adding following additional parameters.

Access-Control-Allow-Credentials: true

Access-Control-Allow-Origin: *

But this is not good solution when it comes to the security

User · Answer

Why the error is raised  JavaScript code is limited by the same-origin policy  meaning  from a page at www example com  you can only make  AJAX  requests to services located at exactly the same domain  in that case  exactly www example com  not example com - without the www - or whatever example com   In your case  your Ajax code is trying to reach a service in http   wordicious com from a page located at http   www wordicious com  Although very similar  they are not the same domain  And when they are not on the same domain  the request will only be successful if the target s respose contains a Access-Control-Allow-Origin header in it  As your page service at http   wordicious com was never configured to present such header  that error message is shown  Solution  As said  the origin  where the page with JavaScript is at  and the target  where the JavaScript is trying to reach  domains must be the exact same  Your case seems like a typo  Looks like http   wordicious com and http   www wordicious com are actually the same server domain  So to fix  type the target and the origin equally  make you Ajax code request pages services to http   www wordicious com not http   wordicious com   Maybe place the target URL relatively  like   login php   without the domain    On a more general note  If the problem is not a typo like the one of this question seems to be  the solution would be to add the Access-Control-Allow-Origin to the target domain  To add it  depends  of course  of the server language behind that address  Sometimes a configuration variable in the tool will do the trick  Other times you ll have to add the headers through code yourself

User · Answer

Pleaes find the Function used in XMLHTTPREQUEST in Javascript for setting up the request headers        xmlHttp setRequestHeader  Access-Control-Allow-Origin    http   www example com         lt  script gt     Reference  https   developer mozilla org en-US docs Web API XMLHttpRequest setRequestHeader

User · Answer

The workaround is to use a reverse proxy running on your  source  host and forwarding to your target server  such as Fiddler   Link here  http   docs telerik com fiddler configure-fiddler tasks usefiddlerasreverseproxy  Or an Apache Reverse proxy

User · Answer

Solved with below entry in httpd conf   CORS Issue Header set X-Content-Type-Options  nosniff  Header always set Access-Control-Max-Age 1728000 Header always set Access-Control-Allow-Origin      Header always set Access-Control-Allow-Methods   GET POST OPTIONS DELETE PUT PATCH  Header always set Access-Control-Allow-Headers   DNT X-CustomHeader Keep-Alive Content-Type Origin Authentication Authorization User-Agent X-Requested-With If-Modified-Since Cache-Control  Header always set Access-Control-Allow-Credentials true   CORS REWRITE RewriteEngine On                   RewriteCond   REQUEST METHOD  OPTIONS   RewriteRule         1  R 200 L  RewriteRule         1  R 200 L E HTTP ORIGIN   HTTP ORIGIN

User · Answer

If you get this error message from the browser       No  Access-Control-Allow-Origin  header is present on the requested resource  Origin       is therefore not allowed access   when you re trying to do an Ajax POST GET request to a remote server which is out of your control  please forget about this simple fix    lt  php header  Access-Control-Allow-Origin         gt    What you really need to do  especially if you only use JavaScript to do the Ajax request  is an internal proxy who takes your query and send it through to the remote server   First in your JavaScript  do an Ajax call to your own server  something like     ajax       url  yourserver com controller proxy php      async false      type   POST       dataType   json       data  data      success  function  result            JSON parse result              error  function  xhr  ajaxOptions  thrownError            console log xhr               Then  create a simple PHP file called proxy php to wrap your POST data and append them to the remote URL server as a parameters  I give you an example of how I bypass this problem with the Expedia Hotel search API   if  isset   POST        apiKey     POST  apiKey       cid     POST  cid       minorRev   99      url    http   api ean com ean-services rs hotel v3 list      cid     cid     amp      minorRev      minorRev     amp      apiKey      apiKey     echo json encode file get contents  url         By doing    echo json encode file get contents  url      You are just doing the same query but on the server side and after that  it should works fine

User · Answer

Add this to you PHP file or main controller  header  Access-Control-Allow-Origin  http   localhost 9000

User · Answer

Use addHeader Instead of using setHeader method   response addHeader  Access-Control-Allow-Origin             in above line will allow access to all domains      For allowing access to specific domain only   response addHeader  Access-Control-Allow-Origin    http   www example com      Check this blog post

User · Answer

You need to add this at start of your php page  login php    lt  php header  Access-Control-Allow-Origin         gt

User · Answer

you have to put the headers keys values in options method response  for example if you have resource at http   mydomain com myresource then  in your server code you write    response handler void handleRequest Request request  Response response        if request method     OPTIONS            response setHeader  Access-Control-Allow-Origin   http   clientDomain com          response setHeader  Access-Control-Allow-Methods    GET POST PUT DELETE OPTIONS           response setHeader  Access-Control-Allow-Headers    Content-Type

User · Answer

For  NET server can configure this in web config as shown below    lt system webServer gt      lt httpProtocol gt        lt customHeaders gt          lt add name  Access-Control-Allow-Origin  value  your clientside websiteurl    gt        lt  customHeaders gt      lt  httpProtocol gt    lt  system webServer gt    For instance lets say  if the server domain is http   live makemypublication com and client is  http   www makemypublication com then configure in server s web config as below    lt system webServer gt      lt httpProtocol gt        lt customHeaders gt          lt add name  Access-Control-Allow-Origin  value  http   www makemypublication com    gt        lt  customHeaders gt     lt  httpProtocol gt    lt  system webServer gt

[javascript] No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin '...' is therefore not allowed access

Examples related to javascript

Examples related to jquery

Examples related to ajax

Examples related to cors

Examples related to xmlhttprequest