Embedded Forms Now Require HTTPS

Embedded Forms Now Require HTTPS
Userlevel 7
Badge +5
  • Tech Community Advocate
  • 13414 replies

Hello and happy mid-Summer (not to be confused with the movie, Midsommer) Typeform community!

 

From July 2021, all embeds must run over HTTPS only. Websites using HTTP will see the image above (or something similar depending on the browser used) and will be blocked from using the embed. 

 

Why is Typeform requiring HTTPS?

HTTP is insecure and unencrypted. HTTPS is the natural progression and the internet standard which replaces HTTP. The S in HTTPS stands for Secure (it's secured by encryption to protect your data when transferring between points on the internet). 

This is now our standard and another way to protect users as well as protecting our customers by encouraging a security-first mindset. 

To transition from HTTP to HTTPS, a user must update their website by obtaining an SSL certificate from the hosting company they use. This is a simple process but it will come at a cost, though usually a small cost. 

Why should you want an SSL certificate on your site? 

  • Using HTTPS deems you trustworthy and users are more likely to use your site and services 
  • HTTPS is more secure for both the site owner and the site user, a win-win
  • Search engines will severely penalize sites not using HTTPS in search ranking, so it's great for SEO
  • Many browsers and browser extensions will show a warning when navigating to your site to say the page is malicious and untrusted, that's no good 

Any questions? Let us know in the comments below. 


34 replies

Hello @Liz!

Thank you for letting us know about this on this forum. Is there a workaround or exception?

This is not a productive decision for many. Several websites intentionally choose HTTP instead of HTTPS. E.g.
www.wikidot.com

www.three.co.uk/

www.fao.org/home/en

www.xinhuanet.com

www.washington.edu

Also many websites may intentionally not want HTTPS because of loading/blocking issues due to China’s firewall. @Liz can you please portray this to the higher-ups so that they reconsider this decision or at least offer a “make an exception” button when copying over the embed code? Also, from a commercial perspective, Typeform is limiting it’s potential market share.

And @Liz was this decision communicated via email well ahead of the change?

Userlevel 7
Badge +5

Hi @Ask There is no workaround for this, as our security team and product team have made this decision final to protect respondents as well as our customers. I’m happy to share this feedback with our product team, though I’m afraid it’s unlikely this will be rolled back. 

As for email communication, we sent an email to all customers in late January to inform of the changes. 

@Liz Thank you for your quick reply.

Maybe adding a legacy option instead of a rollback could be possible...nevertheless thank you for agreeing to share this with the product team.

About the email communication, maybe it’s just me but I’ve not received or at least cannot find anything (could’ve went to spam and got deleted) from Typeform about this (I do have other emails from Typeform though).


Hi @Liz - I was driving myself crazy trying to figure out what I was doing wrong here… quick question though: will this only effect forms where we publish NEW changes? I have 3 forms embedded on an HTTP site, I made changes to one (the one that’s not working) and the other two are still appearing as embedded in my site. Curious to know if those two are going to vanish soon or if they won’t vanish as long as I don’t publish any new changes?

@Liz Just want to be sure you saw my tag above...

Userlevel 7
Badge +5

Hi @megmc88 This change applies to all embeds, regardless of when the form was created or embedded on your site. You’ll need to be sure that the website you’re embedding the form on is an HTTPS website. 

@Liz Thank you so much for the info - I wonder if this is slowly rolling out? I have two forms that aren’t working and one that is… I guess it’s only a matter of time before the third stops embedding correctly as well?

Userlevel 7
Badge +5

Hi @megmc88 This rollout has been released to all forms. While I’m not totally sure why it would be working with some forms and not the others, I would definitely suggest ensuring they are all embedded on an HTTPS site. 

Hello!

We had a typeform integrated in a browser extension, which is now appearing as untrusted.

Because it appears within a frame that is `chrome-extension://...` - which is neither `https://...` nor `http://localhost` - this change now breaks our user-flow.

We deploy this extension to all major browsers, so it would be great if browser-internal protocols could be included in the CSP header.

Any chance to help us out?

Cheers,
Alex

Userlevel 7
Badge +5

Hi @SLA Thanks for stopping by! I’m afraid the forms still need to be added to an HTTPS site at this time, so we don’t have any workarounds to avoid this requirement. 

Hai @Liz

 

We have a more than 20 Typeform that show on a Mobile App using a web-view.When this policy is started. Typeform using web-view have an error occurs.Can you help, Is there any solution for this?Thank You
Userlevel 7
Badge +5

Hi @Dany We don’t currently support forms embedded in apps at the moment, which you can read more about here. But I’m tagging @picsoung in case they happen to have any workarounds. 

Userlevel 7
Badge +5

Hai @Liz

 

We have a more than 20 Typeform that show on a Mobile App using a web-view.When this policy is started. Typeform using web-view have an error occurs.Can you help, Is there any solution for this?Thank You

Hi Dany,

I assume you are developing for Android, is that correct?
I am not an expert in Android development but it seems like you can solve this issue using the onReceivedSslError handler.

I saw a few questions on StackOverflow and tutorials around that topic.

If this does not work, let’s start a new topic and we could discuss the issue in details.

Best,
Nicolas

Badge

I am using react library, I want to test this on local computer to make sure it is working fine, Is there any workaround ?

Userlevel 7
Badge +5

Hi @opspolymathlabs I’m not aware of any workarounds at this time, but @mathio might know if there are any!

Userlevel 7
Badge +5

You can embed your typeform without HTTPS if you serve it on a page on localhost. Eg. via express or http-server or any other local server.

Badge

You can embed your typeform without HTTPS if you serve it on a page on localhost. Eg. via express or http-server or any other local server.

I tried this, it does not work. It required me to set up https on localhost. I would suggest to apply this rule for sites running in production. It will save developers time as the process of setting up https on localhost is not common. 

Userlevel 7
Badge +5

Hello, thats exactly what we are doing. When you run your page on localhost we will allow embedding without HTTPS.

You can test this by cloning our embed SDK repo and running the demo server. I just run it locally and it works:

If this is not working for you, please check CSP headers of your typeform if they include http://localhost:*.

Badge

Hello, thats exactly what we are doing. When you run your page on localhost we will allow embedding without HTTPS.

You can test this by cloning our embed SDK repo and running the demo server. I just run it locally and it works:

If this is not working for you, please check CSP headers of your typeform if they include http://localhost:*.

Thanks, seems to be working for me now. However I have one more challenge, do I have to upgrade my plan to continue experimenting. My form was closed because I reached 10 responses limit. Is there any way developers can experiment and test without upgrading to paid plans.

Userlevel 7
Badge +5

You can enable sandbox mode for your embedded form (in the embed code). This will embed your form in a special mode - tracking and submissions will be disabled.

Pay extra attention not to use this in production as it does not give any warnings (to replicate the same experience in sandbox as you would have in production).

Badge

You can enable sandbox mode for your embedded form (in the embed code). This will embed your form in a special mode - tracking and submissions will be disabled.

Pay extra attention not to use this in production as it does not give any warnings (to replicate the same experience in sandbox as you would have in production).

Does this works for a form which is already set to private. My form now is set to private and enabling the sandbox does not seem give me the preview. This is what I see instead

 

Userlevel 7
Badge +5

No, it only works for forms that are not closed. I would suggest you copy your closed typeform - you can click the three dots next to it in your workspace and select “Duplicate”. This will create a copy of your typeform which you can embed in sandbox mode.

Badge

No, it only works for forms that are not closed. I would suggest you copy your closed typeform - you can click the three dots next to it in your workspace and select “Duplicate”. This will create a copy of your typeform which you can embed in sandbox mode.

Seems like typeform locked all forms, new forms are also set to private by default 

 

Userlevel 7
Badge +5

Hi @opspolymathlabs As noted in the message in your account, you will need to upgrade the account to view the forms since your forms have already collected 10 responses for the month. One thing to note is that deleting these responses won’t lower the limit - you’ll still need to upgrade in this case. 

I hope this helps clarify that message. 

You can enable sandbox mode for your embedded form (in the embed code). This will embed your form in a special mode - tracking and submissions will be disabled.

Pay extra attention not to use this in production as it does not give any warnings (to replicate the same experience in sandbox as you would have in production).

I have enabled sandbox and so I am not able to get responseId. Is this the intended behavior. If so how can I get access to the response when sandbox is enabled

Reply