Access to XMLHttpRequest blocked has been blocked by CORS policy: No 'Access-Control-Allow-Origin'

TracyS783
Rookie
0 Votes

WE have a popup form ready to roll, but the Universal Code JS is failing with this error:

 

Access to XMLHttpRequest at 'https://listgrowth.ctctcdn.com/v1/7a1e4138950ea4c63223c50ac606873c.json' from origin 'https://www.sunlinerefueled.org' 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.

 

Any ideas? 

4 REPLIES 4
Jimmy_D
Employee
0 Votes

Hi @TracyS783,

 

That error is indicating that whatever you are trying to do is not allowed due to the CORS policy. If you are using our API this makes sense because our API does not use CORS. If you are using something other than our API can you please specify what you are using?


Regards,
Jimmy D.
Tier II API Support Engineer
AbbyM80745
Rookie
0 Votes

We are getting the same error when we paste the universal code onto our site. We are using Subsplash Pages and have pasted the code in the footer code area of the side so that the popup appears on every page.

John__B
Employee
0 Votes

Hello AbbyM80745,

 

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

 

Our universal form code is designed to work on any website, so if you are encountering a CORS policy error, Subsplash likely has additional server security set up that is not allowing the form to communicate with our server. For additional assistance with adding the code to your website, I would highly recommend contacting your webmaster or Subsplash’s support team.

 

If they are unable to configure their security settings to allow for the form code to communicate with our server, you could also add a link to a Lead Generation Landing page as a workaround. Below I’m including a support article on how to do this. 

 

https://knowledgebase.constantcontact.com/articles/KnowledgeBase/32012-Create-a-Lead-Generation-Land...

 

Please have a look and let us know if you have any other questions!

 

Regards,


John B.
API Support Specialist
Did I answer your question? If so, please mark my post as an "Accepted Solution" by clicking the Accept as Solution button in the bottom right hand corner of this post.
AbbyM80745
Rookie
0 Votes

Hi John,

I (Lisa McMahon [webmaster for FBC Leesburg]) reached out to Subsplash and they spent several days trying to find a solution. Here is their response:

Turns out we believe the issue is that Constant Contact needs to add some additional coding to their header. One of our devs supplied us with the explanation you can pass on to Constant Contact as to why their form isn't working. He is confident they will comprehend what he is explaining in the report below.

Please let me know if there is anything else can do for you.

So here is the report from our developer. --------------------------------------------------------------------------------------

So, we have a security requirement on SnapPages that external resources, such as the Constant Contact signup resource (https://listgrowth.ctctcdn.com/v1/a5cf76f012487c68a6771fd09bd8f7a2.json) have an Access-Control-Allow-Origin header. Constant Contact will need to add that header to their resources for us to be able to use these forms properly. This is a change required on their side, not on ours.

Note that this is also a browser requirement. SnapPages is not specifically blocking Constant Contact.
References:
https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Access-Control-Allow-Origin

https://stackoverflow.com/a/10636765

The CORS policy is a security mechanism implemented by browsers to restrict cross-origin requests and protect users from potential security risks. The policy is enforced consistently across all resources, including scripts, images, stylesheets, and more.

To successfully make a cross-origin request from a <script> tag, the server (Constant Contact, in this case) hosting the requested resource needs to include the appropriate CORS headers in its response. Specifically, the server should include the 'Access-Control-Allow-Origin' header, which specifies the allowed origins that can access the resource.

If the server does not include the necessary CORS headers, the browser will block the request and prevent the script from executing due to the same-origin policy. This security measure helps mitigate the risk of unauthorized access and manipulation of resources.

To resolve the CORS issue, you typically need to modify the server-side configuration to include the 'Access-Control-Allow-Origin' header in the response. Alternatively, you can consider using alternative techniques like JSONP or setting up a proxy server to bypass the CORS restrictions.

It's important to note that circumventing or bypassing CORS restrictions without proper authorization or understanding of the security implications can lead to security vulnerabilities and should be avoided.

The Constant Contact server is not set up to respond w/ the proper CORS headers to a POST request, which is what their code in that embed is doing behind the scenes.

It is this URL specifically that is the issue: https://listgrowth.ctctcdn.com/v1/a5cf76f012487c68a6771fd09bd8f7a2.json



God Bless,

Ryan Davis
Platform Support Specialist
support.subsplash.com
S U B S P L A S H

Resources
Developer Portal

View API documentation, code samples, get your API key.

Visit Page

Announcements

API Updates

Join our list to be notified of new features and updates to our V3 API.

Sign Up