如何使用 rest 代理创建用于数据存储的静态参数

Question

我有一个 ExtJS 5.1.2 应用程序，它在整个应用程序中使用 app_dir/app/Application.js 中定义的全局配置参数集，看起来像：

launch: function () {
    Ext.Loader.setConfig({enabled: true});

    // Static parameters
    cardioCatalogQT.config = {

        mode: 'test', // switch to control use of staging or production server
        //protocol: 'https://',
        protocol: 'http://',
        //host: 'production_server',
        //host: 'test_server,
        host: '127.0.0.1:5000',
        apiGetQ: '/get_query/',
        //apiGetQ: '/api/get_query/',
        apiWriteQ: '/remote_query_put',
        apiReadQ: '/remote_query_get',
        //apiMedsMenu: '/api/meds',
        //apiMedsMenu: '/meds',
        remove: 'none'
    };

    // TODO - Launch the application

    Ext.onReady(function () {


    });        
}

这样，我只有一个地方可以更改构成 Ajax 调用中的 url 的参数，（在本例中为 protocol、host 和apiGetQ，例如让 mr 能够设置 url = cardioCatalogQT.config.protocol + cardioCatalogQT.config.host + cardioCatalogQT.config.apiGetQ)，在一个地方更改服务器地址，从开发 -> 测试 -> 生产，而不是必须在整个应用程序中查找所有引用。

但是，由于 ExtJs 的加载方式，我无法在使用 rest 代理的数据存储中使用这些配置参数，因为这些存储似乎在 Ext.Loader.[=17= 中的项目之前加载]

例如，我有以下店铺：

Ext.define('cardioCatalogQT.store.Diagnoses', {
    extend: 'Ext.data.Store',
    alias: 'store.Diagnoses',
    config:{
        model: 'cardioCatalogQT.model.Diagnosis',
        storeId: 'Diagnoses',
        autoLoad: true,

        proxy: {
            type: 'rest',
            url: 'http://127.0.0.1:5000/menu/diagnoses',
            //url: 'http://test_server/menu/diagnoses',
            //url: 'https://prod_server/api/menu/diagnoses',
            reader: {
                type: 'json',
                rootProperty: 'menu_test'
            }
        }
    }
});

因此，例如，当我从测试环境更改为开发环境时，我必须显式更改 url 我的 n 个具有休息代理的商店中的 n 个不同引用。

有没有办法定义一个配置对象，以便我可以将它用于这些商店？我查看了预加载器的一些示例，但这似乎没有为全局配置对象记录任何用例，我也曾尝试在预加载器中实现加载掩码，但它确实搞砸了我的应用程序的行为。

Answer 1

我们遇到了类似的问题，所以我们将我们的全局 ConnectionSettings 对象放入 index.html 中的脚本标记中，在 Ext.

之前

<script type="text/javascript">
ConnectionSettings = {
    ...
    ...
};
</script>
<!-- The line below must be kept intact for Sencha Cmd to build your application -->
<script id="microloader" ...

这样，该对象就可以在我们的 Ext 代码中的任何需要它的地方使用。

Answer 2

我曾经像@Alexander 提议的那样做，但我更喜欢单例方式。更多 ExtJs/MVC 点赞。所以为了完成，我分享我的版本：

/**
 * @class
 */
Ext.define("MyApp.config.Config", {
    alternateClassName: [
        'MyApp.config'
    ],
    singleton: true,

    constant: {

        // ... whatever constant you need to put here

    },

    constructor: function() {
        var constant = this.constant;

        //
        // here, if you need to process some stuff
        // for example calculate some constant
        // which depend of other constant
        //


        return constant;
    }
});

在您的应用中需要

// Be sure to require your class prior
// to your app classes
Ext.define('MyApp.Application', {
    extend: 'Ext.app.Application',

    requires: [
            'Ext.app.*',
            // ext stuff ...
            'MyApp.config.Config',
            // myApp stuff ...
    ]

    // ...

});

用法示例：

Ext.define('MyApp.store.MyStore', {
    // ...

    proxy: {
        type: 'rest',
        url: MyApp.config.remoteUrl
    }
})

如何使用 rest 代理创建用于数据存储的静态参数

How to create static parameters for use in data stores with rest proxy

rest

extjs

global-variables

loader