Reputation: 59
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&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
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