Skip to content

Troubleshooting browser CORS errors for an API

development, security-ssl

CORS is a browser-enforced rule for reading responses across origins. It is separate from DNS, TLS and the API’s authentication and authorization checks.

Gather the details you will need

Record the frontend origin, API URL, method, headers and credentials mode. Inspect the browser network panel, including any OPTIONS preflight request.

01 Troubleshoot browser CORS errors for an API

  1. Confirm the request reaches the intended HTTPS endpoint without an unexpected redirect or certificate error.

  2. Compare the origin with the API’s explicit allowlist. Remember that scheme and port can make two URLs different origins even when the hostname is the same.

  3. Check the preflight response for the required method and request headers. Configure credentialed access with an explicit allowed origin and compatible browser cookie settings.

  4. Ensure controlled error responses also pass through the intended CORS handling. A server error without those headers can appear as a CORS symptom.

  5. Test the same authorised request from the approved frontend and verify the API still enforces user permissions.

02 Example: inspect the browser preflight separately

Suppose the website at https://www.example.com sends JSON to an API on https://api.example.com. Run this diagnostic from your own terminal after replacing the demonstration addresses. It asks what the browser would need permission to send, without submitting the actual form.

Command example
curl --silent --show-error --include --request OPTIONS \
  --header 'Origin: https://www.example.com' \
  --header 'Access-Control-Request-Method: POST' \
  --header 'Access-Control-Request-Headers: content-type' \
  'https://api.example.com/contact'

Inspect Access-Control-Allow-Origin, Access-Control-Allow-Methods and Access-Control-Allow-Headers. A redirect to a login page or an HTML firewall challenge explains a different failure from a missing allowed header. This terminal request does not enforce CORS itself.

Expected result: The approved origin receives the required permission, then the real browser form succeeds with its intended authentication. Repeat from a deliberately unapproved origin and confirm the API has not granted broad credentialed access.

Confirm the expected result

Confirm the browser can read the intended response and an unapproved origin is not granted credentialed access. Check the real application result, not only the preflight status.

If the problem continues

If a command-line client works but a browser fails, inspect CORS and browser credentials behavior. Disabling browser security is not a fix for customers using ordinary browsers.

A common question

Does CORS prevent all unauthorised API callers?

No. Non-browser clients can still send requests. The API needs its own authentication, authorization and input validation regardless of CORS settings.

Was this answer helpful?

Need a little more help?

Our support team can help you find the next step.

Contact support

Powered by WHMCompleteSolution