THE GARDEN

Same-origin policy and CORS

Updated 06 Oct 2026

• •

  Same-origin policy

  • •

    restricts how a document can read resources from another origin**

  • •

    Origin -> tuple of scheme, host, and port

  • •

    this is a browser security boundary; it doesn't prevent servers from communicating with each other

• •

  CORS

  • •

    Cross-Origin Resource Sharing lets a server allow selected origins to read responses in browsers

  • •

    the server sends HTTP headers such as Access-Control-Allow-Origin

  • •

    some requests trigger an OPTIONS preflight so the browser can check the intended method and headers

  • •

    CORS -> does not authenticate requests or prevent non-browser clients from sending them

  • •

    {{renderer :bermaid}}

    • •

      sequenceDiagram
          autonumber
          participant Browser as Browser
          participant Server as API Server
      
          Note over Browser: Page origin differs from API origin
          Note over Browser: Is a preflight needed?
          Note over Browser,Server: Optional - only for non-simple requests
          Browser->>Server: OPTIONS /data preflight
          Note over Browser,Server: Origin, Access-Control-Request-Method
          Server-->>Browser: 204 No Content
          Note over Browser,Server: Access-Control-Allow-Origin: https://app.example.com
          Note over Browser,Server: Access-Control-Allow-Methods: GET, POST, PUT
          Note over Browser,Server: Access-Control-Allow-Headers: Content-Type
          Browser->>Server: Actual request with Origin header
          Server-->>Browser: Response with CORS headers
          Note over Browser: Do the CORS headers allow this origin?
          Note over Browser: Yes - JavaScript can read the response
          Note over Browser: No - response is blocked from JavaScript
      

    • •

• •

◌ Explore connections in Graph view