1

外部 URL (google.com) をタブパネルにロードする単純なアプリケーションに取り組んでいます。using ajax request:Ext.Ajax.requestは、アクセス制御許可オリジンのために機能していません。ローカル html をロードする方法、ローカル サーバーでアクセス制御を許可する方法を知っています。私の問題は、外部サーバーにアクセスできない場合です。とにかく外部URLをロードする方法はありますか? 私は試しExt.util.JSONP.requestてみましたが、うまくいきませんでした。

これは、タップパネルとロード URL に関するセンチャフィドルの例です (私が書いたものではありません): リンク

4

1 に答える 1

1

できることは、iframeにロードすることです。この目的に使用できるコンポーネントをコンパイルしました

Ext.define('Ext.ux.IframeComponent', {
    extend: 'Ext.Component',

    xtype: 'iframecmp',

    config: {
        /**
         * @cfg {String} url URL to load
         */
        url     : null,

        /**
         * @cfg
         * @inheritdoc
         *
         * Add your own style
         */
        baseCls : Ext.baseCSSPrefix + 'iframe'
    },

    initialize: function() {
        var me = this;
        me.callParent();

        me.iframe = this.element.createChild({
            tag   : 'iframe',
            src   : this.getUrl(),
            style : 'width: 100%; height: 100%;'
        });

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

});

使用法：

Ext.define("IframeCmp.view.Main", {
    extend: 'Ext.tab.Panel',
    config: {
        tabBarPosition: 'bottom',

        items: [
            {
                title   : 'Google',
                iconCls : 'action',
                xtype   : 'iframecmp',
                url     : 'http://sencha.com'
            }
        ]
    }
});

重要なお知らせ: iframe 内の外部ドメインからの URL の読み込みは、セキュリティ上の欠陥と見なされます

于 2012-05-13T17:59:01.803 に答える