Logo Questions Linux Laravel Mysql Ubuntu Git Menu

CORS issue between web/android/ios




when trying to $.ajax to fetch some content from other websites in my website, I got the error.

Failed to load https://www.pinterest.com/: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:8100' is therefore not allowed access.

I knew if the target website didn't allow localhost:8100 to fetch the data, I cannot fetch it in the client side on the web.

However, I found that mobile app (not mobile browser, but android/ios application) does not have the issue, they can simply get the website content by their default mobile built-in HTTP get function.

Do i want to ask why mobile will not encounter CORS issue (mobile can fetch the webcontent simply by the built-in http get function)?


like image 351
SKLTFZ Avatar asked Mar 08 '23 19:03


1 Answers

CORS is enforced by the browser to fulfill the security standard they have to meet. It does not affect requests made programmatically from any language, like a curl call on bash.

This is how CORS works, based on Wikipedia:

  1. The browser sends the OPTIONS request with an Origin HTTP header. The value of this header is the domain that served the parent page. When a page from http://www.example.com attempts to access a user's data in service.example.com, the following request header would be sent to service.example.com: Origin: http://www.example.com.

  2. The server at service.example.com may respond with:

    • An Access-Control-Allow-Origin (ACAO) header in its response indicating which origin sites are allowed. For example Access-Control-Allow-Origin: http://www.example.com
    • An error page if the server does not allow the cross-origin request
    • An Access-Control-Allow-Origin (ACAO) header with a wildcard that allows all domains: Access-Control-Allow-Origin: *

The way CORS works means it is optional. Browsers enforce it to prevent Javascript AJAX calls to perform malicious calls. But other types of consumers built by hand don't need to enforce CORS.

Think in this example:

  • You are the owner of somesite.com
  • Users authenticate to your site using the traditional cookie method
  • User logins into anothersite.com, built by an attacker. This site has the following code:

    <script>fetch('http://somesite.com/posts/1', { method: 'DELETE' });</script>

    ... effectively performing a request to your site and doing bad things.

  • Happily, the browser will perform a preflight request when it sees a cross-domain request, and if your site does not respond saying that requests coming from anothersite.com are OK, you will be covered by default from a potential attack

This is why CORS only makes sense in the context of a browser. Javascript you send to the browser can not (at least easily) circumvent CORS because the only API that allows you to perform requests from the browser is written in stone. Additionally, there are no local storage or cookies outside of the browser.

Corolarium: Enforcing CORS is a deliberate action from the requester, or whoever is making the requests for you, not the sender. Javascript APIs in browsers enforce it. Other languages don't have the need for the reasons explained.

like image 131
ichigolas Avatar answered Mar 27 '23 12:03