Question posted in
You can find the official documentation here.

No 'Access-Control-Allow-Origin' header is present on the requested resource in simple html form – Jquery ajax

why this error is showing in my simple html form, I want to get xml data in my simple form to show news on my webpage, but this error is showing continuously, please help

  $.ajax({
      type: "GET",
      url: "https://news.google.com/rss/search?q=Nigeria&hl=en-PK&gl=PK&ceid=PK:en",
      dataType: "xml",
      success: function(xml) {
          console.log(xml)

      }
  });
Tags:

3

Answers


  1. 0

    This is because of CORS(Cross Origin Resource Sharing) policy implemented by browsers. Which means browsers doesn’t allow certain requests to be sent from a domain to another domain. However this is not applicable to all type of requests.

    Check this link to understand what all requests come under this policy

    Inorder to make this work , the other server, in your case https://news.google.com, have to setup in such a way that it allows cross domain requests. This is achieved by servers telling the browser that it is ready to accept cross domain requests from your domain, by adding certain cors related headers. One such is Access-Control-Allow-Origin. But I am afraid you can’t do it since you aren’t the one managing this server.

    Work-Around

    Use your backend to send the request to google. So that your xhr request calls your server and your server calls google. No browser No Cors.

    xhr—> yourdomain.com/news/get—> someotherdomain.com/news/get

    Login or Signup to reply.
  2. 0

    It is up to the server that has the resource to allow cross origin access.

    Probably there is API for what you are trying to do. API gets implemented by the resource owner and provides controlled access.

    Or you can use RSS if there is one.

    Login or Signup to reply.
  3. 0

    What you could potentially do is run your requests through a CORS proxy. For example:

      $.ajax({
  type: "GET",
  url: "https://cors-anywhere.herokuapp.com/https://news.google.com/rss/search?q=Nigeria&hl=en-PK&gl=PK&ceid=PK:en",
  dataType: "xml",
  success: function(xml) {
          console.log(xml)
      }
  });

    You can see that this works by simply pasting this code snippet into the console.

    This essentially bypasses the CORS issues for you. I would only recommend using this hosted version if you don’t have a lot of traffic, otherwise you should host your own version of the CORS proxy.

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search