Javascript 以ExtJS形式发布CORS

我在将POST值从ExtJS表单传递到我的PHP API（位于另一个域）时遇到问题。下面是我从firebug收到的错误

已阻止跨源请求：同一源策略不允许读取位于的远程资源。（原因：CORS飞行前通道的CORS标头“访问控制允许标头”中缺少令牌“x-requested-with”）

我在本地Xampp服务器的http.conf中添加了下面的CORS头

标题集访问控制允许原点“*”

但仍然没有骰子

下面是我的ExtJS表单代码示例

menuOption =  Ext.create('Ext.form.Panel', {
    autoHeight: true,
    width: '100%',
    defaults: {
        anchor: '100%',
        labelWidth: 100
    },
    items: [{
        xtype: 'tabpanel',
        width: '100%',
        height: '100%',
        items: [{
            title: 'Title Information',
            xtype: 'form',
            bodyPadding: 10,
            url: 'http://172.16.1.35:81/pls/land-title.php',
            layout: 'anchor',
            defaults: {
                anchor: '100%'
            },
            defaultType: 'textfield',
            items: [{
                fieldLabel: 'First Name',
                name: 'first',
                allowBlank: false
            },{
                fieldLabel: 'Last Name',
                name: 'last',
                allowBlank: false
            }],
            buttons: [{
                text: 'Reset',
                handler: function() {
                    this.up('form').getForm().reset();
                }
            }, {
                text: 'Submit',
                url: 'http://172.16.1.35:81/pls/test.php',
                formBind: true,
                disabled: true,
                handler: function() {
                    var form = this.up('form').getForm();
                    if (form.isValid()) {
                        form.submit({
                            success: function(form, action) {
                               console.log('Success');
                            },
                            failure: function(form, action) {
                                console.log('Failed');
                            }
                        });
                    }
                }
            }]
        }]
    }]
});

下面是我将值传递给的PHP

    <?php

    header('Access-Control-Allow-Origin: http://172.16.1.85:8080/ncr/pls/');

    if(isset($_REQUEST['first'])) {
        echo 'Success: Your firstname is ' . $_REQUEST['first'];
    } else {
        echo 'ERROR: could not retrieve data';
    }
?>

---

我也遇到了同样的问题，我提出了一个解决方案，即不能使用表单提交发出CORS请求，因为extjs使用标准表单提交。但是您可以使用

Ext.Ajax.Request

来完成。您只需要从表单中获取值，并使用普通ajax请求发送这些值，如

Ext.Ajax.request({
    url: 'http://172.16.1.35:81/pls/land-title.php',
    method: 'POST',
    cors: true,
    useDefaultXhrHeader : false,
    params: form.getValues(),
    success: function () {
        alert('success');
    },
    failure: function () {
        alert('failure');
    }
});

---

如果没有任何东西到达PHP文件，那么将头放入PHP文件有什么意义？您的请求被阻止，这可能意味着不会向PHP文件传输任何内容。是这样吗？请看错误消息。原因：CORS飞行前通道的CORS标头“访问控制允许标头”中缺少令牌“x-requested-with”。它没有说任何关于访问控制的内容。@Drakes谢谢你的回复。我只想得到响应，以防它到达PHP文件。我尝试在中添加头并重新启动服务器，但仍然收到相同的错误。Extjs表单位于Apache Tomcat中。@Quentin感谢您指出，我已经搜索了访问控制允许标头，它向我指出，monsur说我应该添加访问控制允许源代码：“@Loupi-您也需要它。谢谢，是的，这是有效的：）我不知道为什么ExtJS需要做大量的工作才能向远程服务器提交一个POST值。看起来标准AJAX保存了dayExtJs尝试使框架与旧浏览器（如IE8、IE7）兼容，这就是为什么它使用标准表单提交，在另一种情况下，将无法上载文件。在标准表单提交中，您不能指定任何标题。是的，在这种情况下，标准ajax很有帮助。我很高兴我的回答有帮助。