Firefox下使用jQuery.ajax()请求Flask接口报错的解决方法

1. 解除Firefox对5555端口的跨域限制 #

Firefox默认会禁止部分非标准端口的跨域请求，5555可能在这个限制列表里：

• 在地址栏输入about:config，搜索network.security.ports.banned.override
• 若该配置不存在，右键选择「新建」→「字符串」，名称填network.security.ports.banned.override，值填5555；若已存在，在原有值后添加,5555（注意用逗号分隔）

2. 完善Flask服务的CORS配置 #

Chrome等浏览器对预检请求的处理更宽松，Firefox则要求严格的CORS响应头：

• 先安装Flask-CORS扩展：pip install flask-cors
• 在Flask代码中配置CORS，明确允许请求头和来源：

from flask import Flask, request
from flask_cors import CORS

app = Flask(__name__)
# 允许/test接口接收跨域请求，生产环境建议将origins替换为你的前端域名
CORS(app, resources={
    r"/test": {
        "origins": "*",
        "allow_headers": ["Content-Type", "Authorization"],
        "supports_credentials": True
    }
})

@app.route('/test', methods=['POST', 'OPTIONS'])
def test_endpoint():
    # 处理OPTIONS预检请求
    if request.method == 'OPTIONS':
        return '', 200
    # 你的业务逻辑
    data = request.get_json()
    return {"status": "success", "received": data}

3. 调整jQuery AJAX配置 #

• 移除crossDomain: true：当请求跨域时jQuery会自动处理，手动设置可能触发Firefox的异常逻辑
• 若需要携带凭证，添加xhrFields配置；同时确保authdata变量格式正确（比如Bearer token需带Bearer 前缀）
  修改后的AJAX配置：

var settings = {
  "url": "http://10.10.0.55:5555/test",
  "method": "POST",
  "timeout": 2000,
  "headers": {
    "Content-Type": "application/json",
    "Authorization": authdata
   },
  "data": JSON.stringify({
    "data": "mydata"
   }),
  "xhrFields": {
    "withCredentials": true
  }
};

$.ajax(settings)
 .done(function() {
   alert( "success" );
 })
 .fail(function(jqXHR, textStatus, errorThrown) {
   // 打印详细错误信息方便排查
   console.log("错误状态：", textStatus);
   console.log("错误详情：", errorThrown);
   console.log("响应内容：", jqXHR.responseText);
   alert( "error" );
 })
 .always(function() {
   alert( "complete" );
 });

4. 用Firefox开发者工具排查细节 #

按F12打开开发者工具：

• 查看「网络」面板，检查请求是否发送，预检请求（OPTIONS）的响应状态码和头信息
• 查看「控制台」面板，获取具体的错误提示，比如CORS错误、端口被拦截等

内容的提问来源于stack exchange，提问作者Thomas Aichinger