当前位置:

首页 > 软件教程 > 火狐浏览器跨域请求被拦截怎么办

火狐浏览器跨域请求被拦截怎么办

本文目录

    火狐浏览器跨域校验严格,本地开发易报同源策略错误。一是安装CORSEverywhere插件注入允许跨域响应头,二是修改privacy.file_unique_origin为false(仅限本地调试),三是在后端SpringBoot中配置addCorsMappings方法解决。注意localhost与127.0.0.1被视为不同源,因此开发时需确保两者一致。

    火狐浏览器报跨源请求被拦截,提示“同源策略禁止读取位于 http://127.0.0.1:8080/api/data 的远程资源”——这场景是不是很眼熟?你正用本地 HTML 文件或开发服务器(比如 Vite、Webpack Dev Server)发起请求,结果目标接口地址跟当前页面协议、域名或端口没完全对上。火狐对跨域响应头校验比 Chrome 更严格,还默认开启了 privacy.file_unique_origin 和更保守的 CORS 策略,所以报错来得更干脆。

    临时绕过:装 CORS Everywhere 插件

    方法一:安装并强制注入 Access-Control-Allow-Origin:* 头
    1) 地址栏输入 about:addons → 点击右上角“寻找更多附加组件” → 搜索 CORS Everywhere → 点击第一个结果旁的“添加到 Firefox”;
    2) 安装完成后,点插件右侧齿轮图标 → “选项” → 勾选 【Enabled at startup】 → 在 “Force value of 'access-control-allow-origin'” 输入框填入 * → 点 Sa ve;
    3) 【必须关闭所有火狐窗口再重新启动浏览器】,否则插件不生效。

    方法二:仅限调试本地 file:// 页面(比如双击打开的 index.html)
    在地址栏输入 about:config → 接受风险继续 → 搜索 privacy.file_unique_origin → 双击将其值由 true 改为 false;
    ⚠️ 注意:这个设置会让所有本地文件共享同一源,仅用于离线调试,日常浏览时千万别开着。

    根本解决:后端 Spring Boot 配置 CORS

    第一步:在 config 包下新建 CorsConfig.ja va 类;
    第二步:添加 @Configuration 注解,并实现 WebMvcConfigurer 接口;
    第三步:重写 addCorsMappings 方法,在 registry.addMapping("/**") 后链式调用 .allowedOrigins("http://localhost:5173") —— 这里不能写成 "*",否则后续若启用 credentials 会失效;
    第四步:补全 .allowedMethods("GET", "POST", "PUT", "DELETE", "OPTIONS") 和 .allowedHeaders("*");
    第五步:重启后端服务,确保响应头中间出现 Access-Control-Allow-Origin: http://localhost:5173。

    快速验证是否真跨域

    打开开发者工具 → 切换到 Network 标签页 → 点一个失败的请求 → 查看 Headers → 对比 Request URL 和 Response Headers 中的 Access-Control-Allow-Origin 字段:
    如果该字段完全缺失,说明后端没返回 CORS 头;
    如果存在但值是 http://localhost:3000,而你当前页面地址却是 http://127.0.0.1:3000,则因域名不等效仍会报错——【localhost 与 127.0.0.1 在 CORS 中被视为不同源】。

    补充:前端开发时避免触发预检请求

    如果请求被浏览器自动发了 OPTIONS 预检,说明它属于“复杂请求”:比如设置了 Content-Type: application/json、带自定义 header 或用了 PUT/DELETE 方法。
    临时方案:把请求改成简单请求,例如用 FormData 发送表单数据,Content-Type 自动设为 multipart/form-data;
    长期方案:后端必须正确响应 OPTIONS 请求,返回 Access-Control-Allow-Methods 和 Access-Control-Allow-Headers 等头。

    本文内容来源于网友投稿,如有侵权请联系删除。
    作者最新文章
    软件教程 火狐浏览器
    相关文章 更多
    3dmax快捷键命令大全最新
    3dmax快捷键命令大全最新

    了解3ds Max最新版本的快捷键布局,从视图导航到高级建模,通过清晰的区域划分和常用指令列表,快速掌握3D制作的核心快捷操作。

    photoshop图层样式在哪
    photoshop图层样式在哪

    找不到Photoshop图层样式?本文详解图层面板中的“fx”入口、双击图层技巧以及顶部菜单栏路径,带你熟悉投影、描边等常用效果的设置界面。

    Typora怎么插入目录?用[TOC]自动生成文章大纲
    Typora怎么插入目录?用[TOC]自动生成文章大纲

    学习如何在Typora中使用[TOC]标记自动生成文档目录。涵盖标题层级规范、标记插入位置、预览效果验证及导出PDF时的注意事项,帮助快速构建结构化长文档。

    Typora怎么写数学公式?行内公式和公式块入门
    Typora怎么写数学公式?行内公式和公式块入门

    学习如何在 Typora 中编写数学公式。教程涵盖开启数学渲染开关、使用单美元符号写行内公式、双美元符号写独立公式块,以及公式不显示时的排查方法。适合笔记整理与学术写作入门。

    Photoshop滤镜插件放在什么位置?安装目录说明
    Photoshop滤镜插件放在什么位置?安装目录说明

    找不到Photoshop滤镜插件放哪里?本文提供Windows和Mac系统的默认安装路径,以及如何通过首选项自定义插件文件夹的方法,确保插件正确加载。

    Typora怎么换主题?内置主题和新主题安装教程
    Typora怎么换主题?内置主题和新主题安装教程

    想知道Typora怎么换主题?本教程详解内置主题一键切换方法,以及第三方主题文件的正确安装位置与故障排查技巧,确保Markdown文档在不同主题下保持最佳可读性。

    Typora怎么写标题、加粗、列表?零基础入门
    Typora怎么写标题、加粗、列表?零基础入门

    零基础学习 Typora 写作技巧,掌握如何输入井号生成标题、使用星号加粗重点文字,以及创建无序和有序列表。包含实时渲染检查与文件保存验证步骤,适合初学者快速上手 Markdown 文档结构化编辑。

    怎么修改WinRAR默认压缩方式为“标准”或“存储”
    怎么修改WinRAR默认压缩方式为“标准”或“存储”

    想要永久更改WinRAR新建压缩包时的默认压缩策略?本教程指导你进入WinRAR设置中的压缩选项卡,创建默认配置并将压缩方式固定为“标准”或“存储”,从而减少重复操作并提升归档效率。

    Typora怎么插入代码块?指定语言后自动高亮
    Typora怎么插入代码块?指定语言后自动高亮

    学习如何在Typora中使用三个反引号插入代码块,并通过添加语言标识(如python、html)实现自动语法高亮。包含操作步骤、常见错误检查及导出注意事项,帮助提升技术文档编写效率。

    photoshop路径面板图片 在哪里
    photoshop路径面板图片 在哪里

    找不到Photoshop路径面板?本教程详解如何通过窗口菜单显示路径面板,区分工作路径与形状路径,并演示保存、新建及编辑路径的具体操作步骤,帮助初学者掌握矢量路径管理。

    查看更多
    精品专题 更多
    装机必备
    装机必备

    正软商城装机必备专区,精选办公、浏览器、安全防护、影音播放、压缩解压、设计创作和系统工具等电脑常用正版软件,帮助用户快速完成新电脑软件配置。

    Windows
    Windows

    正软商城Windows软件专区,汇集适用于Windows电脑的办公、设计、安全防护、影音播放、开发工具和系统优化软件,提供软件介绍、系统要求、正版授权及购买下载服务。

    macOS软件
    macOS软件

    正软商城macOS软件专区,精选适用于Mac电脑的办公、设计、影音、效率、开发和系统工具,提供软件功能介绍、macOS兼容版本、正版授权及购买下载服务。

    Mac软件 更多
    photoshop
    photoshop
    Windows、macOS 、 iPad

    Photoshop 2026 是 Adobe 推出的专业图像处理与视觉设计软件,支持 Windows、macOS 和 iPad 等平台,广泛应用于摄影修图、电商设计、平面海报、数字绘画及视觉合成等创作场景。

    Blender
    Blender
    Windows、macOS 和 Linux

    Blender 是一款免费开源、跨平台的专业 3D 创作软件,集建模、动画、渲染、视频编辑与视觉合成等功能于一体,广泛应用于影视动画、游戏设计和建筑可视化等领域。软件支持 Cycles 物理渲染器与 Eevee 实时渲染引擎,并提供多边形建模、骨骼绑定、物理模拟等专业工具。Blender 兼容 Windows、macOS 和 Linux 系统,安装包轻巧、运行流畅,依托活跃的全球开发者社区持续更新,是从初学者到专业创作者都值得选择的正版 3D 创作工具。

    灵活计算器
    灵活计算器
    macOS/iOS/Android

    灵活计算器是一款笔记式算数应用,支持实时计算、动态关联和云端同步功能。记录、整理和输出之间的过渡会更自然,适合长期写作、做笔记或持续沉淀个人内容。

    WINDOWS 更多
    3dmax(3ds max)
    3dmax(3ds max)
    Windows

    Autodesk 3ds Max 是一款专业的三维建模、动画与渲染软件,广泛应用于建筑可视化、游戏开发、影视动画、广告设计和产品展示等领域。

    photoshop
    photoshop
    Windows、macOS 、 iPad

    Photoshop 2026 是 Adobe 推出的专业图像处理与视觉设计软件,支持 Windows、macOS 和 iPad 等平台,广泛应用于摄影修图、电商设计、平面海报、数字绘画及视觉合成等创作场景。

    Blender
    Blender
    Windows、macOS 和 Linux

    Blender 是一款免费开源、跨平台的专业 3D 创作软件,集建模、动画、渲染、视频编辑与视觉合成等功能于一体,广泛应用于影视动画、游戏设计和建筑可视化等领域。软件支持 Cycles 物理渲染器与 Eevee 实时渲染引擎,并提供多边形建模、骨骼绑定、物理模拟等专业工具。Blender 兼容 Windows、macOS 和 Linux 系统,安装包轻巧、运行流畅,依托活跃的全球开发者社区持续更新,是从初学者到专业创作者都值得选择的正版 3D 创作工具。