0

I am trying to use mailchimp api in my reactjs application but I keep the getting the following error every time I try to call the mailchimp api.

Access to XMLHttpRequest at 'https://us9.api.mailchimp.com/3.0/ping' 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.

Following is my api.js file where the mailchimp api is called:

mailchimp.setConfig({
    apiKey: "my_api_key",
    server: "us9"
});

const addEmailToMailchimp = async (email) => {
    const response = await mailchimp.ping.get();
    console.log(response);
};

It says to add Access-Control-Allow-Origin' to the header of the request I think? Not sure how to do that. Any idea how to fix this?

Sumanth Jois
  • 3,146
  • 4
  • 27
  • 42

1 Answers1

0

It says to add the Access-Control-Allow-Origin header to the response not the request.

I don't know how to do this in reactjs, but this answer might be helpful.

This answer suggests creating a midleware since you are using an external API and therefore don't have access to the server.

amirsalah
  • 93
  • 1
  • 3
  • 8