将动态URL字段传递到iframe而不进行服务器端编码

Question

需要一些帮助,因为,不幸的是,我无法自己解决:(

1. 用户被重定向到一个表单(通过iframe提供),其中包含一个动态URL:website.com/form？id = 123

2. 提供页面的代码从页面URL中的"id"参数读取该值("123").

3. 然后,该脚本将该值写入"data-url"属性中URL的末尾,如下面的示例代码段中所示.

<div class="typeform-widget" data-url="iframe.com/to/abc123?id=123" style="width: 100%; height: 500px;" ></div> 
<script> (function() { var qs,js,q,s,d=document, gi=d.getElementById, ce=d.createElement, gt=d.getElementsByTagName, id="typef_orm", b="https://embed.iframe.com/"; if(!gi.call(d,id)) { js=ce.call(d,"script"); js.id=id; js.src=b+"embed.js"; q=gt.call(d,"script")[0]; q.parentNode.insertBefore(js,q) } })() 
</script>

不幸的是,我似乎无法让它工作......

非常感谢!

Answer 1

不确定为什么你面临这个任务的问题.以下是我如何从当前URL获取ID

url = document.location.href;
var paramId = new URL(url).searchParams.get("id");

var frameElement = document.getElementById("typef_orm_frame");
frameElement.src = "https://example.com/to/abc" + paramId + "?id=" +paramId;

这是演示的JSFiddle

https://jsfiddle.net/0Lswuxj8/1/