使用Javascript将传入的URL参数传递给iframe src

时间:2019-03-08 02:55:45

标签: javascript html post get parameter-passing

我的登录页面上有一个Webflow表单,用于收集姓名,电子邮件和电话号码。该表单将重定向到我网站上包含全屏TypeForm嵌入的另一页。

我正在尝试使用GET方法将姓名,电子邮件和电话传递给Typeform隐藏字段。

我真的不在这里了……我不知道自己在做什么。我已经阅读了许多Stackoverflow主题和博客文章。

我要关闭吗?这是我在HTML中嵌入的代码。

<html> 

<head> 

<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0"> 

<title>LBWR Qualification Form</title> 

<style type="text/css"> 

html{ margin: 0; height: 100%; overflow: hidden; } 
iframe{ position: absolute; left:0; right:0; bottom:0; top:0; border:0; } 

</style> 

</head> 

<body> 

<script type="text/javascript">

var loc = window.location.toString(),
    params = loc.split('?')[1],
    iframe = document.getElementById('typeform-full');

iframe.src = iframe.src + '?' + params;

</script>

<iframe id="typeform-full" width="100%" height="100%" frameborder="0" src="https://zacharypinnell.typeform.com/to/k5BPk6">

</iframe> 

<script type="text/javascript" src="https://embed.typeform.com/embed.js">

</script> 

</body> 

</html>

我意识到使用GET可能不合规-可能无法确保潜在客户的信息安全。如果您觉得这样,请随时通过其他更安全的方式重定向我。

非常感谢您。

编辑:已解决。

1 个答案:

答案 0 :(得分:0)

这似乎是一个类似的问题here

您可以使用Typeform Embed SDK来更好地控制嵌入。

并使用javascript从当前页面检索查询参数

let params = new URLSearchParams(location.search);

然后将这些参数传递给typeform。

var url = "https://YOUR_SUBDOMAIN.typeform.com/to/YOUR_TYPEFORM_ID"
url += `?name=${params.get('name')}&email=${params.get('email')`;

但是为什么不对第一种形式也使用类型形式呢?