Form Loading issue in strict mode

Greetings,
My forms are not loading anymore on MS Edge, which is obviously uneccaptable. Browser says it’s due to the following:
`Tracking Prevention blocked a Script resource from loading https://js-eu1.hsforms.net/forms/embed/v2.js?ver=1.0.03.`
If I host that file on my server it works all good, no issues whatsoever. Is there a danger of doing that? Or what is the solution?
I initialize my forms via javascript directly like this:

(window.hsFormsOnReady ||= []).push(_ => { hbspt.forms.create({ region: "eu1", portalId: "1234", formId: form.dataset.formId,

Hi @ZKiraly!

Is this a normal HubSpot form you are embedding into a non-Hubspot page? Could you share the link of the form please.

I found some documentation to troubleshoot externally embeded HS forms: Troubleshoot externally embedded HubSpot forms
I also found a similar post with some accepted solutions here: https://community.hubspot.com/t5/APIs-Integrations/Embeded-Form-treated-as-Tracking-Content-on-Firefox/m-p/998727

But in short: What’s happening here is that Microsoft Edge is blocking part of the HubSpot form because it considers it a “tracking” script. This is related to the browser’s privacy settings, not an issue with your website or the form itself. Some browsers have become stricter about blocking third-party resources like this. To address this, you can modify the embedded script.

Hope this helps!

Carolina De Mares

CarolinaDeMares_1-1769100842581.gif

ZUID.
Goirkekanaaldijk 12
5046 AT Tilburg
Nederland


To address this, you can modify the embedded script.


By “modify”, you mean detect if the form loaded and if not, post a message to the user saying it could not load.

I’m very surprised to hear @ZKiraly response that an API POST submission is blocked, as well. That was the next course of action to rectify this.

1) Custom domains should be allowed when loading these scripts, please continue to upvote this - HubSpot Community - Custom Domain on forms - HubSpot Community

2) This problem isn’t going away. It’s only going to get worse as @ZKiraly alludes to. Showing the user a message that they are responsible for a part of the site being broken immediately envokes distrust.

Hi @ZKiraly,

Thanks for posting in the Community!

I see that you’re having some trouble there with your forms. I found a couple of similar community posts here and here! I hope you find these helpful in your troubleshooting, however, I’d also like to tag in some of our Top Contributors to see if they have any experience with this.

@GRajput, @SteveHTM, @evaldas -- Do you have any suggestions for @ZKiraly?

Thank you!

Sam, Community Manager

The above solutions are not really solutions to be honest. We are an enterprise SaaS company so a large chunk of our visitors are using MS Edge. It is not a solution to display a text instead saying “Try a different browser to load our form” or anything similar…
What is the actual solution to this? One of them would obviously letting us hosting the script, or delivering the script via our own domain.

Hi @ZKiraly,

I don’t have a good solution for the script issue, but wanted to share an alternative in case you want to try an option that would not require the script at all.

You could have a custom HTML form and perform submissions via API:

Similar endpoint supporting authentication:

Again, this would not address the actual script issue but would at least ensure the form is accessible to visitors and submissions would be recorded.

@evaldas thanks for the proposal, but that would mean that I would need to create like 100 forms in my cms, and re-embedding them, that is clearly not a solution to be honest.

yes, with that many forms it does not seem like a great solution in this case.

I will try to answer your questions regarding self-hosting script. You said:

If I host that file on my server it works all good, no issues whatsoever. Is there a danger of doing that?

HubSpot has a note regarding self-hosting the file in this developer article:

HubSpot forms should only be loaded using the HubSpot-hosted JavaScript file. Making a copy of the form embed code and self-hosting it is not supported. Any improvements that HubSpot makes to improve security, anti-spam, accessibility, and performance will not propagate to your form if you decide to self-host the HubSpot form embed code.

So that should answer the “danger” part.

I doubt that HubSpot wants this kind of experience on MS Edge and might be looking into solutions internally but it’s hard to know whether that is the case and when this might be resolved (if ever). You can try moving the needle by filling out the developer feedback form or upvoting this idea (and follow for updates), but outcomes or responses are not guaranteed.

While that is being worked on (hopefully it is), you could try self hosting and periodically update the file to the latest version to try and capture any updates/improvements. Obviously will need to also periodically test to make sure it functions as expected.

1. Tried hosting the script myself, the form loads, but it breaks, it cannot be submitted.
2. Tried building a a simple html form, and submit it via the API, that doesn’t work either. Because the browser in strict mode blocks the POST request

Any other ideas? @evaldas

I already voted that idea even before posting here, searched far and wide for solutions but there ain’t any. It just amazes me that there’s no solution, that idea was posted 5 years ago, and it looks like no steps were taken

@ZKiraly

I am guessing you probably encountered this suggestion, but just in case, you could try to load the js file through a proxy.

With the POST method, since I can’t see the setup and the error - just guessing an alternative - could try using the endpoint supporting authentication and then use an AWS Lambda function.

Something along these lines:

document.addEventListener('DOMContentLoaded', function() {

const form = document.getElementById("my-form");

form.addEventListener('submit', async function(event) {
 event.preventDefault();

...

const response = await fetch('https://xxxxxxxx.amazonaws.com/serverless-function', {
 method: 'POST',
 headers: {
 'Content-Type': 'application/json'
 },
 body: JSON.stringify(formDataObject)
});

...

Thanks for your response @evaldas , but have you tried that solution?

And what about the future? Is this seriously the solution for the long term? Some browsers will eventually adopt this and make it as the default setting. Chrome is slowly phasing out 3rd party cookies as well, are you prepared for that? How is that handled? Sorry I really have doubts regarding where your development efforts are focused, there is a request that is already 5 years old where a solution is proposed, upvoted by a lot of people. and posted by one of the participants in this discussion.
Most likely most of the people are still not aware of this issue, I only found it out when doing proper browser testing, do you think the customers would be happy knowing that they lost business without knowing?

Hi @ZKiraly,

Thanks for your follow up here, and thank you @evaldas for your continued contributions!

Just a friendly reminder that Community Champions, like @evaldas are not HubSpot employees, but enthusiastic volunteers committed to helping and supporting everyone in the community!
I truly appreciate you bringing this to the community, but with this in mind, if you do have some feedback you’d like to provide to the HubSpot team, then I encourage you to consider creating a post on our Ideas Forum here.

Ideas posted in this forum are seen and reviewed directly by our product team regularly, and this is the best way to raise feature requests and increase the chance it will become a feature in the future, as well as receive updates on any future developments!

Thank you!

Sam, Community Manager

@CarolinaDeMares this is an example link: From No-Code to Vibe Code: Build with Prompts in BRYTER - BRYTER
This is not a hubspot website, we are just using Hubspot forms.

I already had a look at all possible solutions before posting here, and to be honest the following is not a solution:

if (typeof hbspt === 'undefined') {
document.write('<p>The form is blocked by Firefox Enhanced Tracking Protection. Please email me directly at <a href="mailto:test@gmail.com">email</a></p>');
}"