Extjs 和 Spring MVC XMLHttpRequest 无法加载预检响应具有无效的 HTTP 状态代码 403答案

【问题标题】：Extjs and Spring MVC XMLHttpRequest cannot load Response for preflight has invalid HTTP status code 403Extjs 和 Spring MVC XMLHttpRequest 无法加载预检响应具有无效的 HTTP 状态代码 403
【发布时间】：2023-04-11 01:07:01
【问题描述】：

当我从煎茶打来电话时：

proxy: {
                        type: 'ajax',
                        url: 'http://localhost:8585/academy/api/alumno/list/',
                        reader: {
                             type: 'json',
                             rootProperty: 'alumnos'
                        }
                    },

我在 spring mvc 上收据：

@Controller
@RequestMapping("/alumno")
public class AlumnoController {

    @Autowired
    AlumnoApi alumnoApi;

    @RequestMapping(value = "list", produces = "application/json")
    @ResponseBody
    public List<DtoAlumno> findAll(){
        return alumnoApi.findAll();
    }

显示如下错误

XMLHttpRequest cannot load http://localhost:8585/academy/api/alumno/list/?_dc=1467319530160. Response for preflight has invalid HTTP status code 403

如果我在浏览器中打开地址：http://localhost:8585/academy/api/alumno/list/?_dc=1467319530160 正确显示 json 文件

我已激活插件 Toggle CORS，如果我关闭 Toggle 会显示错误 CORS。

【问题讨论】：

标签： java spring extjs cors

【解决方案1】：

我在服务位于同一服务器上但数据库不在的服务器上解决了此问题。

设置：

Ubuntu 14 服务器（不在本地主机上）
Tomcat 在 8080 端口上运行（应用程序在 Tomcat 外部运行标准端口 80）
分配给服务器 IP 的域（root 到达应用程序，:8080 到达 tomcat 服务）
.htaccess 文件来限制对服务的访问。

问题调用 Extjs.dataStore.read() 将引发 400 系列错误，其中包含无效 HTTP 的预检错误。（同上面的OP）

解决方案 更新 .htaccess 文件以包含代理重写，并且不要在 URL 中使用端口用于数据存储。

浏览器中的基本 URL 必须与提供给 Extjs.dataStore.proxy.url 的 URL 的服务前调用、端口和所有内容相匹配

示例：

浏览器中的网址：

http://localhost:5517/MyApp  //(this is your EXTJS app location note the port number)

在 Extjs 中：

Ext.define('MyApp.store.myDataStore', {
    extend: 'Ext.data.Store',

    requires: [
        'MyApp.model.myDataStoreModel',
        'Ext.data.proxy.Ajax',
        'Ext.data.reader.Json'
    ],

    constructor: function(cfg) {
        var me = this;
        cfg = cfg || {};
        me.callParent([Ext.apply({
            storeId: 'myDataStore',
            autoLoad: true,
            model: 'MyApp.model.myDataStoreModel',
            proxy: {
                type: 'ajax',
                url: 'http://localhost:5517/mainservice/subservice?q=test', //URL localhost:<port> needs to match URL in browser (or use domain without ports)
                reader: {
                    type: 'json',
                    rootProperty: function(data) {
                        console.info('data ='); console.info(data); return data; //show raw return 
                    }
                }
            }
        }, cfg)]);
    }
});
//Ext.StoreMgr.get('myDataStore').read(); //to call read event

在 .htaccess 文件中：

Options +FollowSymLnks
RewriteEngine on

RewriteRule ^mainservice/subservice(.*)$ http://localhost:8585/mainservice/subservice$1 [P]

值得注意， 我无法在 localhost 中对此进行测试，因为我的 spring 服务连接到我可以通过 localhost 访问的其他服务器/数据库之外。

当浏览器的 URL 与代理 spring 中引用的 URL 不匹配时，就会出现上述错误。

我不知道这是否会对您有所帮助，因为您似乎没有使用 .htaccess 文件，但它可以帮助遇到类似问题的其他人，就像我找到您的帖子一样。

【讨论】：