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

文章目录

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


问题

前端项目设置跨域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.rhkb.cn/news/370930.html

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

【初阶数据结构】深入解析循环队列:探索底层逻辑

🔥引言 本篇将介绍如何实现循环队列并实现过程需要注意的事项,虽然篇幅较小,但是其中逻辑还是值得引人思考的,循环队列可以采用数组或链表实现,这篇将采用数组实现循环队列 🌈个人主页:是店小二…

【数据结构】05.双向链表

一、双向链表的结构 注意:这里的“带头”跟前面我们说的“头节点”是两个概念,带头链表里的头节点,实际为“哨兵位”,哨兵位节点不存储任何有效元素,只是站在这里“放哨的”。 “哨兵位”存在的意义:遍历循…

cs231n作业1——KNN

参考文章:assignment1——KNN KNN 测试时分别计算测试样本和训练集中的每个样本的距离,然后选取距离最近的k个样本的标签信息来进行分类。 方法1:Two Loops for i in range(num_test):for j in range(num_train):dist X[i, :] - self.X…

Python爬虫获取视频

验证电脑是否安装python 1.winr输入cmd 2.在黑窗口输入 python.exe 3.不是命令不存在就说明python环境安装完成 抓取快手视频 1.在phcharm应用中新建一个项目 3.新建一个python文件 4.选择python文件,随便起一个名字后按回车 5.安装requests pip install requests 6.寻找需要的…

苹果电脑能玩赛博朋克2077吗 如何在mac上运行赛博朋克2077 crossover能玩什么游戏

各位喜欢赛博朋克风的一定不能错过《赛博朋克2077》。那么《赛博朋克2077》是一款什么样的游戏?《赛博朋克2077》在苹果电脑上可以运行吗?一起来看看介绍吧。 一、《赛博朋克2077》是一款什么样的游戏? 《赛博朋克2077》是一款由CD Projekt …

【Java探索之旅】初识多态_概念_实现条件

文章目录 📑前言一、多态1.1 概念1.2 多态的实现条件 🌤️全篇总结 📑前言 多态作为面向对象编程中的重要概念,为我们提供了一种灵活而强大的编程方式。通过多态,同一种操作可以应用于不同的对象,并根据对象…

Spring Boot基础篇

快速上手 SpringBoot是由Pivotal团队提高的全新框架,其设计目的是用来简化Spring应用的初始化搭建以及开发过程 入门案例 在Idea创建 创建时要选择Spring Initializr。 Server URL为要连接的网站,默认为官网start.spring.io(访问速度慢&…

【教程】新的Selenium!整合了隐藏浏览器指纹等功能

转载请注明出处:小锋学长生活大爆炸[xfxuezhagn.cn] 如果本文帮助到了你,欢迎[点赞、收藏、关注]哦~ 目录 前景提要 driver Driver() 常用driver 接口 最后的话 前景提要 新的selenium,整合了隐藏浏览器指纹,非常好用&#x…

树状数组求三元上升子序列

分析一下,感觉没什么思路,再想一下,结果不就是每一位的数小于它的数乘以大于大于这位数的相乘之和吗,我们可以利用逆序对的思维求得 关键点在于求解逆序对的时候值相同的时候,位置大的优先级更高处理 #define _CRT_SEC…

大型能源电力集团需要什么样的总部数据下发系统?

能源电力集团的组织结构是一个复杂的系统,包括多个职能部门和子分公司。这些子分公司负责具体的电力生产、销售、运维等业务。这些部门和公司协同工作,确保电力生产的顺利进行,同时关注公司的长期发展、市场拓展、人力资源管理、财务管理和公…

算法 —— 滑动窗口

目录 长度最小的子数组 无重复字符的最长子串 最大连续1的个数 将x减到0的最小操作数 找到字符串中所有字母异位词 最小覆盖子串 长度最小的子数组 sum比target小就进窗口,sum比target大就出窗口,由于数组是正数,所以相加会使sum变大&…

数据结构基础--------【二叉树基础】

二叉树基础 二叉树是一种常见的数据结构,由节点组成,每个节点最多有两个子节点,左子节点和右子节点。二叉树可以用来表示许多实际问题,如计算机程序中的表达式、组织结构等。以下是一些二叉树的概念: 二叉树的深度&a…

Ubuntu 20.04下多版本CUDA的安装与切换 超详细教程

目录 前言一、安装 CUDA1.找到所需版本对应命令2.下载 .run 文件3.安装 CUDA4.配置环境变量4.1 写入环境变量4.2 软连接 5.验证安装 二、安装 cudnn1.下载 cudnn2.解压文件3.替换文件4.验证安装 三、切换 CUDA 版本1.切换版本2.检查版本 前言 当我们复现代码时,总会…

计算机如何存储浮点数

浮点数组成 在计算机中浮点数通常由三部分组成:符号位、指数位、尾数位。IEEE-754中32位浮点数如下: 上图32bit浮点数包含1bit的符号位,8比特的指数位和23bit的尾数位。对于一个常规浮点数,我们来看看它是如何存储和计算的。这里…

数据库系统原理 | 查询作业2

整理自博主本科《数据库系统原理》专业课自己完成的实验课查询作业,以便各位学习数据库系统概论的小伙伴们参考、学习。 *文中若存在书写不合理的地方,欢迎各位斧正。 专业课本: ​ ​ ———— 本次实验使用到的图形化工具:Heidi…

CTF常用sql注入(一)联合注入和宽字节

0x01 前言 给自己总结一下sql注入的常用姿势吧,记录一下学习 0x02 联合 联合注入的关键词是union SQL的union联合注入原理是联合两个表进行注入攻击,使用union select关键词来进行联合查询。 那么为什么我们在题目中一般是只写一个呢 因为 $sql &quo…

SwiftData 模型对象的多个实例在 SwiftUI 中不能及时同步的解决

概览 我们已经知道,用 CoreData 在背后默默支持的 SwiftUI 视图在使用 @FetchRequest 来查询托管对象集合时,若查询结果中的托管对象在别处被改变将不会在 FetchedResults 中得到及时的刷新。 那么这一“囧境”在 SwiftData 里是否也会“卷土重来”呢?空说无益,就让我们在…

redis 如何使用 scan, go语言

建议用方案乙 文章目录 场景方案方案甲方案乙 拓展 场景 redis 中存在大量 key。 其中有一部分是用户登陆的 session_id, 结构是 : session_id:1session_id:2session_id:3需求: 有多少用户在线 方案 方案甲 keys session_id:*这种方式简…

FlinkSQL 开发经验分享

作者:汤包 最近做了几个实时数据开发需求,也不可避免地在使用 Flink 的过程中遇到了一些问题,比如数据倾斜导致的反压、interval join、开窗导致的水位线失效等问题,通过思考并解决这些问题,加深了我对 Flink 原理与机…

华为云简介

前言 华为云是华为的云服务品牌,将华为30多年在ICT领域的技术积累和产品解决方案开放给客户,致力于提供稳定可靠、安全可信、可持续创新的云服务,赋能应用、使能数据、做智能世界的“黑土地”,推进实现“用得起、用得好、用得放心…