抓取传递的 URL 参数并添加到 iframe URL答案

【问题标题】：Grab URL parameter passed and add to iframe URL抓取传递的 URL 参数并添加到 iframe URL
【发布时间】：2019-11-15 07:26:13
【问题描述】：

我正在使用 typform 嵌入代码，但他们没有提供任何示例代码来从 URL 中获取自定义参数并将其插入到他们生成的嵌入代码中。他们解释说它可以做到。步骤概述如下。我正在寻找一些代码来获取 URL 上传递的任何参数并将它们添加到 iframe 中的 typeform URL。希望时间可以解决，到 iframe 代码执行时，它会传递参数。

用户点击链接https://mysite/embedpage.html?sfid=2324234
页面代码应读取传递给 URL 的 sfid，并在嵌入代码中添加此参数和传递给 typeform URL 的值，如下所示：

<html> 
  <head> 
  </head> 
  <body> 
    <iframe id="typeform-full" width="100%" height="100%" frameborder="0" 
      src="https://mysite.typeform.com/to/tpEHHt?sfid=2324234">
    </iframe> 
    <script 
      type="text/javascript" src="https://embed.typeform.com/embed.js">
    </script> 
  </body> 
</html>

【问题讨论】：

标签： javascript embed url-parameters geturl typeform

【解决方案1】：

你尝试过这样的事情吗？

function getQueryVariable(variable) {
    var query = window.location.search.substring(1);
    var vars = query.split('&');
    for (var i = 0; i < vars.length; i++) {
        var pair = vars[i].split('=');
        if (decodeURIComponent(pair[0]) == variable) {
            return decodeURIComponent(pair[1]);
        }
    }
    console.log('Query variable %s not found', variable);
}

document.getElementById('typeform-full').src = `https://mysite.typeform.com/to/tpEHHt?sfid=${getQueryVariable('sfid')}`;

【讨论】：

【解决方案2】：

我相信之前有人在 Stackoverflow 上提出过这个问题。

我制作了一个关于故障的working example，您可以复制并用于自己的。

类似于@Twisting 下界解决方案，从当前页面中提取查询参数，带一个函数，传递给Typeform Embed SDK。

希望对你有帮助:)

【讨论】：