Extjs Sencha Touch 2.3.1 Iframe

我使用以下代码在sencha touch选项卡面板中插入iframe。我正在Iframe中加载经过身份验证的页面。此页面包含带有用户名和密码字段的表单。页面登录成功，但我希望iframe对登录状态的响应返回到Sencha应用程序

    Ext.application({ 
    launch: function()
    {                   
        Ext.define('I', {
            extend: 'Ext.Component',
            xtype: 'iframecmp',
            config: {                       
                url     : null                      
            },      
            initialize: function() {
                console.log("Main");
                var me = this;
                me.callParent();
                me.iframe = this.element.createChild({
                    tag: 'iframe',
                    src: this.getUrl(),
                    style: 'width: 500px; height: 500px; align:middle;'
                });

                me.relayEvents(me.iframe, '*');
            }
        });



        Ext.create("Ext.tab.Panel", {
            extend: "I",
            tabBarPosition: 'bottom',
            fullscreen: true,
            items: [
                {
                    title: 'Sencha',
                    id: "main-frame",
                    name: "main-frame",
                    iconCls: 'action',
                    xtype: 'iframecmp',
                    url: 'http://testcop.bridgealliance.com/TSM_dev_Insphere',
                    style: 'width: 500px; height: 500px; left: 100px;',
                    scroll: 'vertical'
                },
                {
                    title: 'Sencha',
                    id: "main-frame2",
                    name: "main-frame2",
                    iconCls: 'action',
                    xtype: 'container',
                    html: '<iframe src="http://localhost/phpinfo.php"></iframe>',
                    style: 'width: 50%; height: 50%; left: 10%; top: 10%;'
                }

            ]
        });
    }
}); // application()

Ext.application（{
启动：函数（）
{                   
Ext.define（'I'{
扩展：“Ext.Component”，
xtype:'iframecmp'，
配置：{
url:null
},      
初始化：函数（）{
控制台日志（“主”）；
var me=这个；
me.callParent（）；
me.iframe=this.element.createChild({
标记：“iframe”，
src:this.getUrl（），
样式：“宽度：500px；高度：500px；对齐：中间；”
});
me.relayEvents（me.iframe，“*”）；
}
});
Ext.create（“Ext.tab.Panel”{
扩展：“我”，
tabBarPosition:'底部'，
全屏：对，
项目：[
{
标题:"僧茶",，
id:“主框架”，
名称：“主框架”，
iconCls:“行动”，
xtype:'iframecmp'，
网址：'http://testcop.bridgealliance.com/TSM_dev_Insphere',
样式：“宽度：500px；高度：500px；左侧：100px；”，
滚动：“垂直”
},
{
标题:"僧茶",，
id:“主框架2”，
名称：“主框架2”，
iconCls:“行动”，
xtype:'容器'，
html:“”，
样式：“宽度：50%；高度：50%；左侧：10%；顶部：10%；”
}
]
});
}
}); // 应用程序（）

如果两个窗口在同一个域中，您可以在父窗口上创建一个方法callBack（），并在子窗口中使用

父窗口：

window.callBack = function(msg) { console.log(msg); }

子iFrame：

window.parent.callBack(msg)

如果子iFrame位于不同的域中，则浏览器将禁止此操作，您需要使用

window.postMessage（）

从子窗口发送偶数，并使用

window.addListener（“message”，function（msg）{}

在父窗口中侦听这些事件

这里有一个很好的教程，解释如何使用它