# CORS Policy

## Overview

The CORS policy, or Cross-Origin Resource Sharing policy, is a security feature in web browsers that controls how resources from one origin (like a website) can be accessed by another origin. This means that when you load a web page from a server, all subsequent resources must be loaded only from that same server, including the protocol (http/https) and server name.

Sometimes, the CORS policy prevents a connected API from transferring data when you test your project in the web preview or publish it as a web app.

## Confirm the Cause

If it appears as though your API connection isn't working when you test your project in the web preview or publish it as a web app, do the following:

1. Open your project's web app.
2. Check your [browser console](https://developers.google.com/web/tools/chrome-devtools/open) for errors.
3. The following error indicates a CORS policy blockage:\
   "Access to fetch at \[URL] from origin ‘[https://x.thunkable.com](https://x.thunkable.com/)’ has been blocked by CORS policy: No ‘Access-Control-Allow-Origin’ header is present on the requested resource. If an opaque response serves your needs, set the request’s mode to ‘no-cors’ to fetch the resource with CORS disabled."

## Native Mobile Apps

The CORS policy impacts web apps viewed in a browser but not native mobile apps. This is why the exact same set of blocks works on mobile devices and not on web apps.

{% hint style="success" %}
Because the CORS policy does not impact mobile apps, we recommend testing your app using Thunkable Live or downloading or publishing it.
{% endhint %}

## Work Arounds

### CORS Policy Blockers

Several browser extensions can disable the CORS policy, which might work in your case. However, we do not recommend this method for the following reasons:

* You are more vulnerable to attacks.
* While this might work while you are developing your app, if you want to send it to users, they will also have to install the extension.

### Proxy

Another technique is to use a proxy, a server between your web app and the third-party API server, to make calls for you. Some Thunkable Community members use [Xano](https://www.xano.com/) as a proxy.

You may also find this tutorial by a Thunkable Community member helpful: [Create Your Own Web API Service Using Firebase Functions and NodeJS](https://community.thunkable.com/t/create-your-own-web-api-service-using-firebase-functions-and-nodejs/1040762?u=jane).
