javascript - 在小部件的 javascript 加载上将数据发布到 iframe

Question

我有一个小部件，它有很多可定制的选项。该小部件目前由创建 iframe 的 javascript 组合检索，iframe 包含一堆 javascript 和 jquery 来构建页面。

我无法将冲突的 javascript 的复杂性添加到嵌入页面，这就是我构建 iframe 并在其中运行小部件的原因。

但是，我有点担心变量的长度可能太长，并且可能会导致“获取”失败。

有没有办法在 POST 中发送带有变量的 iframe 的 src？ 没有提交的表格。 iframe 中的页面是用 php 编写的。

这是我的 javascript 当前构建页面的方式。

<script type="text/javascript">
 var myWidget_config = {
        key: 'your api key',
        start: 'a test',
        backgroundImage: 'http://background image if the user wants one',  
        optionLink: 'http://optional link to the embeds site', 
        mainText: 'fff', 
        subText: '404040',  
        linkText: '0D1C5D',
        showColor: '',  
        altBackColor:'',
        BorderColor:'3667C1',
        height: '400px', 
        width: '', 
        resultsPerPage: '3'   
                    }
</script>
<script type="text/javascript" src="http://mysite/scripts/setWidget.js"></script>   

“setWidget.js”页面如下所示

var query='';
for(var key in myWidget_config)
  query += '&'+key+'='+encodeURIComponent(myWidget_config[key]);

  document.write("<iframe frameborder="0" src="http://localhost/widgets/module.php/?'+query+'" width="'+myWidget_config.width+'" height="'+myWidget_config.height+'" scrolling="no"></iframe>');

这只是在本地运行，所以我不能给你一个链接。

有没有一种干净利落的方式让我通过 post 或其他比将查询附加到 src 字符串更好的方法将变量发送到 php 页面？

Answer 1

• 使用 POST 的跨域 XMLHttpRequest(要求被请求的站点发送适当的 Access-Control-Allow-Origin header )
• 使用 POST 创建表单并使用 JavaScript 提交。对于每个参数，创建一个 <input type="hidden"/>元素。