# CORS error on Backend Function

**URL:** <https://forum.8thwall.com/t/cors-error-on-backend-function/4856>\
**Category:** Technical Support\
**Created:** [February 18, 2025, 3:22pm UTC](https://forum.8thwall.com/t/cors-error-on-backend-function/4856 "2025-02-18T15:22:15Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![Julian\_Ezequiel\_Pico](https://avatars.discourse-cdn.com/v4/letter/j/9fc29f/32.png) [@Julian\_Ezequiel\_Pico](https://forum.8thwall.com/u/Julian_Ezequiel_Pico)\
**Post date:** [February 18, 2025, 3:22pm UTC](https://forum.8thwall.com/t/cors-error-on-backend-function/4856/1 "2025-02-18T15:22:15Z")

</div>

I’m getting a CORS error when trying to use a Backend Function:

`Access to fetch at 'https://....execute-api.us-west-2.amazonaws.com/.../.../...' from origin 'https://....dev.8thwall.app' 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.`

I’m following the Tutorials but nothing mentions this. I’ve tried everything. Here is my current code:

```auto
import {datoCmsConfig} from 'backends/dato-cms-config'

const configFetch = async (
  input: RequestInfo,
  init?: RequestInit
) => {
  console.log('Input: ', JSON.stringify(input))
  console.log('Init: ', JSON.stringify(init))

  const modifiedInit = {
    ...init,
    mode: 'no-cors' as RequestMode,
    headers: {
      ...init?.headers,
      'Content-Type': 'application/json',
    },
  }
  const res: Response = await datoCmsConfig(input, modifiedInit)
  if (!res.ok) {
    const errorBody = await res.json()
    throw new Error(errorBody.message || 'Error fetching from backend function')
  }
  return res.json()
}

export {
  configFetch,
}

```

configFetch is exported in the module.js file and utilized by my 8th Wall project like this:

```auto
import * as DatoCMS from 'dato-cms-function'
window.DatoCMS = DatoCMS

const datoCmsComponent = {
  init() {
    DatoCMS.configFetch({
      path: '/config',
      headers: {
        'Access-Control-Allow-Origin': '*',
        'Access-Control-Allow-Headers': 'Content-Type',
      },
    })
  },
}

export {datoCmsComponent}

```

Where `dato-cms-function` is the Function created.

Thanks

---

<div class="post-metadata">

**Author:** ![GeorgeButler](https://sea1.discourse-cdn.com/flex019/user_avatar/forum.8thwall.com/georgebutler/32/1903_2.png) [@GeorgeButler](https://forum.8thwall.com/u/GeorgeButler)\
**Post date:** [February 18, 2025, 6:07pm UTC](https://forum.8thwall.com/t/cors-error-on-backend-function/4856/2 "2025-02-18T18:07:18Z")

</div>

Hi, welcome to the forums!

It looks like you’re setting `no-cors` on the request payload which means that you’re not able to access the response body or headers. Can you turn off `no-cors` and take a look at the response headers and body and share them here, or through DM if they have sensitive information. The response headers will tell us if the Backend Function is setting CORs correctly.

---

<div class="post-metadata">

**Author:** ![Julian\_Ezequiel\_Pico](https://avatars.discourse-cdn.com/v4/letter/j/9fc29f/32.png) [@Julian\_Ezequiel\_Pico](https://forum.8thwall.com/u/Julian_Ezequiel_Pico)\
**Post date:** [February 19, 2025, 1:44pm UTC](https://forum.8thwall.com/t/cors-error-on-backend-function/4856/3 "2025-02-19T13:44:34Z")

</div>

[GeorgeButler](https://forum.8thwall.com/u/GeorgeButler)

[19h](https://forum.8thwall.com/t/cors-error-on-backend-function/4856/2)

Hi, welcome to the forums!

It looks like you’re setting `no-cors` on the request payload which means that you’re not able to access the response body or headers. Can you turn off `no-cors` and take a look at the response headers and body and share them here, or through DM if they have sensitive information. The response headers will tell us if the Backend Function is setting CORs correctly.

Hi George, thanks for the welcome and the answer.

I’ve changed the approach a bit to use a Proxy instead of a Backend Function. The CORS problem still happens, but let me share the new code with you.

**Proxy Config**

```auto
{
  "type": "proxy",
  "baseUrl": "https://graphql.datocms.com/",
  "headers": {
    "Authorization": {
      "type": "literal",
      "value": "Bearer {mytoken}"
    },
    "Content-Type": {
      "type": "literal",
      "value": "application/json"
    },
    "Accept": {
      "type": "literal",
      "value": "application/json"
    }
  },
  "routes": [
    {
      "name": "getContent",
      "id": "fa1d6647-d04a-4f8a-a9bf-5550f2458a67",
      "url": "",
      "methods": ["GET"],
      "headers": {}
    }
  ],
  "title": "dato-cms-proxy",
  "description": ""
}

```

**Code that uses the Proxy**

```auto
import {getContent} from 'backends/dato-cms-proxy'

const configFetch = async (
  input: any,
  init?: RequestInit
) => {
  console.log('Country code: ', input)

  const configQuery = ... 
  const response: Response = await getContent(
    {
      method: 'POST',
      body: JSON.stringify({
        query: configQuery,
      }),
    }
  )

  const value = await response.json()
  console.log('Response: ', value)
  console.log('Response: ', value.data)
  return value.data
}

export {
  configFetch,
}

```

**Console Log**

```auto
Access to fetch at 'https://....execute-api.us-west-2.amazonaws.com/julianepico-default/julianepico-default/...' from origin 'https://julianepico-default-julianown.dev.8thwall.app' 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.Understand this errorAI
app8-llffcbpc.js:1 

POST https://3uvkvb77id.execute-api.us-west-2.amazonaws.com/julianepico-default/julianepico-default/vLNgx9mdXYeR1g3i_SNPQR7yTvl9cqsDr_iV4zJQX0s net::ERR_FAILED 403 (Forbidden)

```

**Response Headers**

 ![Screenshot 2025-02-19 at 10.41.32 AM](https://us1.discourse-cdn.com/flex019/uploads/x8thwall/original/2X/b/b7ce40557c68449b41ef88a7a38f322e418f400d.png)

Apparently now it’s an HTTP 403 Error, but it’s not clear to me what’s happening…