Bob
Bob

Reputation: 59

Mailchimp AMP integration error: Access to fetch at * from origin * has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header

This is my Mailchimp form which I want to add on my AMP template:

<div id="mc_embed_signup">
    <form action-xhr="https://settler.us19.list-manage.com/subscribe/post?u=5f7443b0f4fc25de5fecb0ee2&amp;id=c3c65d7258" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
        <div id="mc_embed_signup_scroll">
           <label for="mce-EMAIL">Subscribe to our newsletter</label>
              <input type="email" value="" name="EMAIL" class="email" id="mce-EMAIL" placeholder="email address" required>
              <div style="position: absolute; left: -5000px;" aria-hidden="true"><input type="text" name="#" tabindex="-1" value=""></div>
            <div class="clear"><input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button"></div>
       </div>

      </form>
 </div>

My AMP is validated an everything is OK on AMP side, my only problem is when I click on signup this error comes up :

Access to fetch at 'XXXX' from origin 'XXXX' 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.

Form submission failed: Error: XHR Failed fetching (https://XXXX.list-manage.com/...): Failed to fetch​​​...

I have already read CORS in AMP document https://amp.dev/documentation/guides-and-tutorials/learn/amp-caches-and-cors/amp-cors-requests?referrer=ampproject.org#cors-security-in-amp and I have read lots of answers here with similar questions but still, my problem has been not solved. I have a subdomain on my WordPress website and I put this line in both .htaccess (Root domain and Subdomain) but unfortunately, my problem is still there.

<ifModule mod_headers.c>
    Header set Access-Control-Allow-Origin: *
</ifModule>

and also:

<ifModule mod_headers.c>
  Header set Access-Control-Allow-Origin: "*"
</ifModule>

And I don't know what should I do anymore.

Upvotes: 4

Views: 3012

Answers (1)

MαπμQμαπkγVπ.0
MαπμQμαπkγVπ.0

Reputation: 6729

I think as what have mentioned in the Mailchimp documentation, "Note Mailchimp does not support client-side implementation of our API using CORS requests due to the potential security risk of exposing account API keys." That could be a reason why you are having an error.

Upvotes: 4

Related Questions