CORS problem in react form (add a Contact to the collection contacts)

[PauliusG6]

Hello

I would like to add a Contact to the collection contacts.

I have seen an example on site https://constantcontact.mashery.com/io-docs

Also, I have tested my request in https://chrome.google.com/webstore/detail/talend-api-tester-free-ed/aejoelaoggembcahagimdiliamlcdmfm and it working for me. My contacts created successfully and I can see my new contact by next link https://app.constantcontact.com/pages/contacts/ui#contacts/...

So, I use next code in my react app:

const url = `https://api.constantcontact.com/v2/contacts?action_by=ACTION_BY_VISITOR&api_key=${API_KEY}`

const params = {...}

fetch(url, {

  method: 'POST',

  headers: {

    'Authorization': 'Bearer af******b',

    'Content-Type': 'application/json'

  },

  body: JSON.stringify(params)

});

I have next error:

Access to fetch at 'https://api.constantcontact.com/v2/contacts?action_by=ACTION_BY_VISITOR&api_key=mw*****kt' from origin 'http://localhost:3000' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: 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.

Why I can't create Contact by my form?

How I can create Contact by my form?

Can you help me, please?

[Courtney_E]

Thank you for reaching out to Constant Contact API Developer Support, and for your patience. My team is here to assist outside software developers with questions about building into Constant Contact's API.

It looks like you are using the V2 version of our API. Switching to our V3 API should resolve the issue you are having. In V3, CORS is supported and the response should include an Access-Control-Allow-Origin header.

Unfortunately we do not support CORS on our V2 API and it can only be called from the back end of a website. There are no current plans to implement cross-origin resource sharing on V2, so you would need to use a server-side process to make the actual calls to our API or switch to the V3 API. Solutions that others have used with V2 is to have a separate server and pass data via AJAX to that separate server, then make the API calls on your server behind the scenes.

Getting Started with V3 API
https://v3.developer.constantcontact.com/api_guide/index.html