解决后端限制导致前端配置跨域仍请求失败报504的问题

news2024/10/6 12:18:50

文章目录

    • 问题
      • 一、通过配置跨域方式
      • 二、直接真实接口请求
      • 三、解决方式
      • 四、后端这样做的原因
  • 总结


问题

前端项目设置跨域proxy处理,接口请求不会报跨域,但是接口请求报了504,这种情况如何处理呢,后端又为何要这么做,下面我们来详细说一说~

一、通过配置跨域方式

跨域配置如下:
在这里插入图片描述
无效,不报跨域,但报接口请求504:

在这里插入图片描述

二、直接真实接口请求

毫无疑问,会报跨域问题:

在这里插入图片描述

三、解决方式

(1)设置端口和后端限制的一样,比如这里只有设置成运行端口号为3000
(2)请求头设置和后端约束的一致,设置Content-type,和Accept类型为application/vnd.api+json
(3)再用真实接口请求,不设置跨域proxy配置,这样就可以请求到后端数据

在这里插入图片描述
在这里插入图片描述

四、后端这样做的原因

后端限制跨域请求,大概率是为了提高安全性和防止恶意攻击,或保护敏感数据。但是,当端口与后端限制一致时,可以绕过跨域限制,从而允许前端应用程序请求后端数据。

总结

当然,并不是端口号一致就可以绕过跨域,还需要添加其他配置,比如前端请求需要发送带有application/vnd.api+json头部信息,这样服务器就就可以将 Access-Control-Allow-Headers 设置为 application/vnd.api+json,客户端在跨域请求中就包含这个头部信息。同时,后端还需要设置其他跨域相关的头部信息,如 Access-Control-Allow-Origin、Access-Control-Allow-Methods 等,服务器端的跨域配置也需要正确设置,例如在 Nginx 或 Apache 中配置跨域访问控制。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1903192.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

2007-2022年中国各企业数字化转型与供应链效率

企业数字化转型与供应链效率是现代企业管理和发展的两个关键方面。以下是对中国各企业数字化转型与供应链效率数据的介绍: 数据简介 企业数字化转型:指企业通过采用数字技术与创新方法,改造业务流程、组织结构和产品服务,以提升…

U盘非安全拔出后的格式化危机与数据拯救策略

在数字化时代,U盘作为便捷的数据携带工具,其重要性不言而喻。然而,许多用户在日常使用中往往忽视了安全退出的重要性,直接拔出U盘后再插入时可能会遭遇“需要格式化”的提示,这一状况不仅令人措手不及,更可…

STM32+ESP8266(ESP32)+MQTT+阿里云物联网平台

1、阿里云物联网平台 - 阿里云物联网平台配置 产品-设备-编辑物模型-设备端开发-查看上报数据 在产品上添加物模型,然后设备是继承自产品的,因此也具有物模型 添加产品、添加设备、产品上添加物模型 - 使用IOT Studio 绘制界面显示温度、湿度、灯开…

pdf怎么转换成图片格式文件,pdf文档怎么转换成图片格式

在数字化时代,pdf文件转换成图片格式是一种常见的操作,无论是在工作还是日常生活中,我们总会遇到需要将pdf文件转换为图片的需求。这可能是因为图片格式更易于分享、展示或编辑。那么,如何高效地将pdf转换成图片呢?本文…

CSRF靶场通关合集

目录 前言 CSRF漏洞总结 1.PiKachu靶场 1.1CSRF(get) 1.2 CSRF(post)请求 1.3 CSRF Token 2.DVWA靶场 难度低 难度中 难度高 前言 最近系统的将从web渗透到内网渗透的知识点做一个回顾,同时结合一些实战的案例来演示,下面是对刚开始学习时对靶场的一个总结. CSRF漏洞…

快速搭建发卡独立站(完全免费)

本文介绍如何使用开源项目,零成本,无需服务器的方式搭建一套自己的数字商品/发卡独立站,不需要任何开发能力,即便是小白用户也能搭建。 感兴趣可直接查看开源项目地址👉 https://github.com/iDataRiver/theme-basic …

sqlite 数据库 介绍

文章目录 前言一、什么是 SQLite ?二、语法三、SQLite 场景四、磁盘文件 前言 下载 目前已经出到了, Version 3.46.0 SQLite,是一款轻型的数据库,是遵守ACID的关系型数据库管理系统,它包含在一个相对小的C库中。它是…

Node 中基于 Koa 框架的 Web 服务搭建实战

前言 在《Node之Web服务 - 掘金 (juejin.cn)》一文中,我们使用 HTTP 模块构建了后端接口,从而实现了后端服务的开发。可以对此进行进一步优化 http模块代码回顾 const http require("http");const server http.createServer((req, res) > {if (reqUrl.pathna…

Simulated Annealing

模拟退火最大值算法: 初始化起始解 x 0 x_0 x0​ 、温度 t 0 t_0 t0​ 以及迭代次数 steps,计算初始值 y 0 y_0 y0​扰动产生新解 x 1 x_1 x1​, 计算对应函数值 y 1 y_1 y1​依据 Δ y y 1 − y 0 \Delta y y_1 - y_0 Δyy1​−y0​ 决策是否接…

element-ui输入框如何实现回显的多选样式?

废话不多说直接上效果&#x1f9d0; 效果图 <template><div><el-form:model"params"ref"queryForm"size"small":inline"true"label-width"68px"><el-form-item label"标签" prop"tag&q…

CurrentHashMap巧妙利用位运算获取数组指定下标元素

先来了解一下数组对象在堆中的存储形式【数组长度&#xff0c;数组元素类型信息等】 【存放元素对象的空间】 Ma 基础信息实例数据内存填充Mark Word,ClassPointer,数组长度第一个元素第二个元素固定的填充内容 所以我们想要获取某个下标的元素首先要获取这个元素的起始位置…

UEC++ 虚幻5第三人称射击游戏(二)

UEC++ 虚幻5第三人称射击游戏(二) 派生榴弹类武器 新建一个继承自Weapon的子类作为派生榴弹类武器 将Weapon类中的Fire函数添加virtual关键字变为虚函数让榴弹类继承重写 在ProjectileWeapon中重写Fire函数,新建生成投射物的模版变量 Fire函数重写逻辑 代码//生成的投射物U…

使用Spring Boot和自定义缓存注解优化应用性能

在现代应用开发中&#xff0c;缓存是提高系统性能和响应速度的关键技术之一。Spring Boot提供了强大的缓存支持&#xff0c;但有时我们需要更灵活的缓存控制。本文将介绍如何使用Spring Boot和自定义缓存注解来优化应用性能。 1. 为什么需要自定义缓存注解&#xff1f; Sprin…

CH12_函数和事件

第12章&#xff1a;Javascript的函数和事件 本章目标 函数的概念掌握常用的系统函数掌握类型转换掌握Javascript的常用事件 课程回顾 Javascript中的循环有那些&#xff1f;Javascript中的各个循环特点是什么&#xff1f;Javascript中的各个循环语法分别是什么&#xff1f;…

Android仿今日头条新闻(一)

新建一个侧边栏的文件&#xff0c;创建成功后直接运行。可以看到带滑动的侧边栏功能如图所示&#xff1a; 主体UI&#xff1a; 新闻UI的实现: 侧边栏&#xff1a; 更换一下颜色&#xff1a; 学习参考-浩宇开发

科研绘图系列:R语言两组数据散点分布图(scatter plot)

介绍 展示两组数据的散点分布图是一种图形化表示方法,用于显示两个变量之间的关系。在散点图中,每个点代表一个数据点,其x坐标对应于第一组数据的值,y坐标对应于第二组数据的值。以下是散点图可以展示的一些结果: 线性关系:如果两组数据之间存在线性关系,散点图将显示出…

【JVM系列】Full GC(完全垃圾回收)的原因及分析

&#x1f49d;&#x1f49d;&#x1f49d;欢迎来到我的博客&#xff0c;很高兴能够在这里和您见面&#xff01;希望您在这里可以感受到一份轻松愉快的氛围&#xff0c;不仅可以获得有趣的内容和知识&#xff0c;也可以畅所欲言、分享您的想法和见解。 推荐:kwan 的首页,持续学…

IDA*——AcWing 180. 排书

IDA* 定义 IDA*&#xff08;Iterative Deepening A*&#xff09;是一种结合了深度优先搜索&#xff08;DFS&#xff09;的递归深度限制特性和A搜索的启发式估价函数的搜索算法。它主要用于解决启发式搜索问题&#xff0c;尤其是当搜索空间很大或者搜索成本不确定时。 IDA* 是…

分享大厂对于缓存操作的封装

hello&#xff0c;伙伴们好久不见&#xff0c;我是shigen。发现有两周没有更新我的文章了。也是因为最近比较忙&#xff0c;基本是993了。 缓存大家再熟悉不过了&#xff0c;几乎是现在任何系统的标配&#xff0c;并引申出来很多的问题&#xff1a;缓存穿透、缓存击穿、缓存雪崩…

markdown导入其它markdown文件

相应语法 [toc] # 测试不同功能 <p> 这是类似超链接的管理方式 </p>[链接测试0](./part0/uml_base.md)[链接测试1](./part1/math_base.md)---<p> 这是直接导入文件的管理方式 </p>import "./part0/uml_base.md"---import "./part1/mat…