将身份验证凭据/cookie注入预定义的ExtJS ajax代理

Ext.define('Admin.model.Patient', {
    extend: 'Ext.data.Model',

    requires: [
        'Ext.data.proxy.Rest',
        'Ext.data.schema.Association'
    ],

    fields: [
        { name: 'id', type: 'string' },
        { name: 'mrn', type: 'string' },
        { name: 'birth_date', type: 'date', format: 'Y-m-d' },
        { name: 'sex', type: 'string' },
        { name: 'first_name', type: 'string' },
        { name: 'last_name', type: 'string' }
    ],

    proxy: {
        type: 'ajax',
        url: 'http://localhost/patientview/api/read',
        reader: {
            type: 'json',
            rootProperty: ''
        }
    }

});

extraParams ?) 到代理,尤其是当应用程序启动时,它已经绑定到我的数据模型。

curl 如中所示 curl -v --cookie "session=XXX" http://0.0.0.0:5000/patientview/api/read ,其中XXX是会话cookie的值。

自 Set-Cookie how to get a cookie from an AJAX response ).

看起来确实有一种方法可以通过后续请求使用 withCredentials: true getting extjs to work with cors and cookies on chrome ).

onLoginButton: function() {

    var formPanel = this.lookupReference('loginForm'),
        form = formPanel.getForm(),
        url = 'http://localhost/login_api/';

    if (form.isValid()) {
        values = form.getValues(true);

        console.log(values);

        Ext.Ajax.request({
            method: 'POST',
            cors: true,
            withCredentials: true,
            useDefaultXhrHeader: false,
            url: url,
            params: values, //username and password
            headers: {
                'Accept': 'application/json'
            },
            disableCaching: false,

            success: function (response) {
                json = Ext.decode(response.responseText);
                test = response.getAllResponseHeaders();
                console.log('json');
                console.log(json);
                console.log(test);
                console.log(response);

                if (response.status === 201) {
                    console.log(json.items);

                }
                else {
                    Ext.MessageBox.alert('Error', response.message);
                }
            }
        });

    }

},

但是,即使这样,它也没有像预期的那样发挥作用。我假设由于第三方Cookie在 responseHeaders 因为它们应该通过使用 withCredentials

FWIW,我的ExtJS应用程序的路径是: http://localhost/test/ ,而烧瓶/原料药在 http://localhost/ Patient 模型)。

http://localhost/patientview/api/read 在我的第一个外部请求内。Ajax调用的成功回调,根据

success: function (response) {

    if (response.status === 201) {
       console.log(json.items);
       Ext.Ajax.request({
           url: 'http://localhost/patientview/api/read',
           method: 'GET',
           cors: true,
           useDefaultXhrHeader: false,
           withCredentials: true,
           success: function(response) {
              var result = Ext.decode(response.responseText);
              console.log(result);

           }
        });

    }
}

但是,虽然这证明了这是可行的,但它并没有解决如何将凭据注入预定义模型的问题。

编辑

我删除了 cors 带凭据 选项,因为web应用程序和api在同一个域上,等等。它确实工作得很好。此外,我还测试了另一个调用的函数 Ext.request.Ajax 通过自动从浏览器中获取凭据,这也起到了作用。

我的商店绑定到模型视图,如下所示:

Ext.define('Admin.view.main.MainModel', {
    extend: 'Ext.app.ViewModel',
    alias: 'viewmodel.main',

    stores: {
        patients: {
            model: 'Admin.model.Patient',
            autoLoad: true
        }
    }
});

bind: {
    store: '{patients}'
},

如果我去商店重新装货,这到底会去哪里?我对ExtJS中的数据绑定有点陌生。