CORS Policy Errors + ServiceWorker Errors

PRoehm — Tue, 22 Oct 2024 10:03:22 GMT

Hello Community,

I’m encountering several issues while trying to implement a quiz form using the HubSpot API on my website. The primary problems revolve around CORS policy errors, ServiceWorker failures, and some preload warnings.

1. CORS Policy Errors:

The most critical issue arises when attempting to submit form data via the HubSpot API. The browser blocks the API requests due to CORS restrictions, preventing my website from interacting with the HubSpot form submission endpoint.

Error Messages:

Access to fetch at 'https://api.hsforms.com/submissions/v3/integration/secure/submit/139531838/fae269ec-390b-4c98-bd5b-bdbab1de8df3' from origin 'https://harborx.de' 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.

Cause:

The HubSpot API currently does not allow cross-origin requests from my domain (https://mywebsite.de). This results in the browser blocking the submission due to the lack of Access-Control-Allow-Origin headers in the API response.

Impact:

This prevents any form submission from being sent to HubSpot, effectively breaking the user flow in the quiz form where the user inputs details and submits the form.

Potential Solutions Needed:

I need assistance in configuring the HubSpot API to allow CORS for requests coming from my website
Alternatively, any recommendations on how to implement a server-side proxy to bypass the CORS restrictions would be appreciated.

2. ServiceWorker Errors:

I’m also encountering several ServiceWorker-related errors, although I haven’t explicitly implemented ServiceWorkers in my code. These errors suggest some issue with how frames are being handled or possibly some interference with HubSpot scripts.

Error Messages:

serviceWorker.js:1 Uncaught (in promise) Error: Could not establish connection. Receiving end does not exist. serviceWorker.js:1 Uncaught (in promise) TypeError: Failed to fetch serviceWorker.js:1 Uncaught (in promise) Error: Frame with ID [some number] was removed.

Cause:

It seems that either a ServiceWorker is trying to manage resources that are no longer available, or it is misconfigured.

Impact:

These errors could be affecting the smooth functioning of my page and might be causing unwanted delays or failures in handling requests.

Potential Solutions Needed:

Guidance on how to debug and resolve these ServiceWorker-related issues. If HubSpot scripts are using ServiceWorkers, how should I handle them to prevent conflicts or errors?

Re: CORS Policy Errors + ServiceWorker Errors

TomM2 — Tue, 22 Oct 2024 11:48:17 GMT

Hey @PRoehm the secure endpoint doesn't support cors at all, you can see this warning in the documentation here. If you want to use CORS you need to use the unauthenticated endpoint instead.

topic Re: CORS Policy Errors + ServiceWorker Errors in APIs & Integrations

CORS Policy Errors + ServiceWorker Errors

1. CORS Policy Errors:

2. ServiceWorker Errors:

Re: CORS Policy Errors + ServiceWorker Errors