使用Fetch时,post数据时,后端接收的Content-Type为text/plain

news2024/11/26 0:27:56

在使用 Fetch做一个前端的post请求时,直接从网上抄了一段代码

export async function postData(url, data){
    const response = await fetch(url, {
        method: 'POST', // *GET, POST, PUT, DELETE, etc.
        mode: 'no-cors', // no-cors, *cors, same-origin
        headers: { 'Content-Type': 'application/json','Accept':'application/json' },
        body: JSON.stringify(data) // body data type must match "Content-Type" header
    });
}

 在本地测试时,一个有趣的事情发生了

从前端控制台我们可以得到一个415(这个一般是请求的文本格式有问题) 

 从后端看到的日志为

 Content type 'text/plain;charset=UTF-8' not supported

 实际上上述代码是添加了请求头了,同时从前端的请求信息中也可以得出

Content-Type: application/json

确实没有错,但是到了后端怎么回是text/plain呢?

各种操作都试了还是不行,最后发现因为设置了no-cors

问题是,当您在“模式”“no-cors”下工作时,标头变得不可变,您将无法更改其某些条目。您无法更改的头部之一是 Content-Type。当您将“mode”设置为“no-cors”时,您将只能更改这些标头:

  • Accept
  • Accept-Language
  • Content-Language
  • Content-Type and whose value, once parsed, has a MIME type (ignoring parameters) that is application/x-www-form-urlencoded , multipart/form-data , or text/plain

In another words, in ‘mode’ ‘-no-‘cors’ you can only set application/x-www-form-urlencoded , multipart/form-data , or text/plain to the Content-Type 。

所以解决方案是停止使用 fetch 或将其更改为 ‘cors’ ‘mode’。当然,这只有在您的服务器也接受“cors”请求时才有效。

javascript - Fetch: post json 数据,application/json 变为 text/plain - SegmentFault 思否

 最后移除        mode: 'no-cors', // no-cors, *cors, same-origin 就可以了!!!

cors是和跨域问题有关的,解决跨域的问题还是很多方法的,除了添加头以外

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

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

相关文章

xshell 工具连接不上本地的 Centos 7虚拟机,4种情况,逐个分析

导读 小编之前使用过 VMware workstation 工具搭建 Centos 7 版本的虚拟机集群,各项功能都正常,用完了也就清除了(节约本地空间)。因为最近学习大数据,需要从新安装虚拟机,结果发现并不如第一次那么顺利。所…

TDengine时序数据库的简单使用

最近学习了TDengine数据库,因为我们公司有硬件设备,设备按照每分钟,每十分钟,每小时上传数据,存入数据库。而这些数据会经过sql查询,统计返回展示到前端。但时间积累后现在数据达到了百万级数据&#xff0c…

Qt使用workflow

Qt工程设置 QMAKE_CFLAGS_DEBUG -MTd QMAKE_CXXFLAGS_DEBUG -MTd上述内容必须设置,否则会报错:error LNK2038: 检测到“RuntimeLibrary”的不匹配项: 值“MTd_StaticDebug”不匹配值“MDd_DynamicDebug。 libworkflow.pri的文件内容如下: …

算法第十五期——动态规划(DP)之各种背包问题

目录 0、背包问题分类 1、 0/1背包简化版 【代码】 2、0/ 1背包的方案数 【思路】 【做法】 【代码】 空间优化1:交替滚动 空间优化2:自我滚动 3、完全背包 【思路】 【代码】 4、分组背包 核心代码 5、多重背包 多重背包解题思路1:转化…

MySQL8 创建用户,设置修改密码,授权

MySQL8 创建用户,设置修改密码,授权 MySQL5.7可以 (创建用户,设置密码,授权) 一步到位 👇 GRANT ALL PRIVILEGES ON *.* TO 用户名% IDENTIFIED BY 密码 WITH GRANT OPTION👆这样的语句在MySQL8.0中行不通, 必须 创设和授权 分步执行👇 CR…

如何动态生成列字段?请看向这里哟

🍃 场景前言 🐠一般而言,某个简单查询接口涉及到得表结构不超过三个。如果不是单表操作的话,多个表中间用到联合查询的SQL也可以解决相关问题。但是,事与愿违的是我们的业务是跟着场景走的,并不是所有的业务…

python+django宠物销售商城网站vue

宠物销售商城,在宠物销售商城可以查看首页、商品信息、商品资讯、个人中心、后台管理、购物车、在线客服等内容 用户登录、用户注册,通过注册获取用户名、密码、姓名、联系电话等信息进行注册、登录 商品信息,在商品信息页面可以查看商品名称、商品分类、图片、品牌、规格、价…

java易错题锦集二

源码 补码 int i 5; int j 10; System.out.println(i ~j);有个公式,-n~n1 另一种解题思路 ~代表对n按位取反 10的源码是: 00000000 00000000 00000000 1010 所以对10按位取反就是 11111111 11111111 11111111 0101 由于计算机中-1表示为 11111111 11111111 111…

[docker]笔记-镜像 管理

1、镜像管理 docker search xxxx ①查找镜像,例如查找httpd [rootlocalhost ~]# docker search httpd ②下载镜像 docker pull xxxx [rootlocalhost ~]# docker pull httpd ③列出本地镜像 docker images [rootlocalhost ~]# docker images ④删除镜像 docker rmi xxx…

Linux(十)线程安全 上

目录 一、概念 二、互斥锁实现互斥 三、条件变量实现同步 银行家算法 生产者与消费者模型 一、概念 概念:在多线程程序中,如果涉及到了对共享资源的操作,则有可能会导致数据二义性,而线程安全就指的是,就算对共享…

【MFC】菜单与状态栏(15)

菜单 一般菜单的使用步骤: 1.编辑菜单资源,设置菜单属性(包括菜单名和ID); 2.用ClassWizard自动映射菜单消息和成员函数; 3.手工编辑成员函数,加入菜单消息处理代码。 单文档窗口可以设置默…

2年时间,涨薪20k,想拿高薪还真不能老老实实的工作...

2016年开始了我的测试生活。 2016年刚到公司的时候,我做的是测试工程师。做测试工程师是我对自己的职业规划。说实话,我能得到这份工作真的很高兴。 来公司的第一个星期,因为有一个项目缺人,所以部门经理提前结束了我的考核期&a…

C语言预处理

文章目录 目录 文章目录 前言 一、程序编译的过程 二、编译阶段 1.预处理(*.i) 2.编译(*.s) 3.汇编(*.o) 4.链接 总结 前言 提示:使用vs code(gcc编译器)与vs2022来演示c语言的预处理 提示:以下是本篇文章正文内容,下面…

KEIL编译报错,解决方法汇总

目录 背景 最近在跟着野火码uCosiii的代码时,感觉非常完美,结果一编译,报了120个莫名其妙的问题,下面是踩过的坑,一起记录下,免得下次又掉进去了~ 1. 编译汇编文件,报错 error: unexpected t…

看海泰方圆类ChatGPT技术模型!

ChatGPT,上线2个月便以破亿的用户群引爆了全网。 ChatGPT是由OpenAI公司开发的AI聊天机器人程序,于2022年11月底推出,能够通过学习和理解人类的语言来进行对话、互动,甚至能完成撰写邮件、视频脚本、文案、翻译、代码等任务&…

南卡和JBL无线蓝牙耳机哪款更值得买?横向评测后秒懂差距!

蓝牙耳机想必大家都很熟悉,无论是商务办公还是休闲娱乐,它都起到了至关重要的作用。但蓝牙耳机发展速度太快,耳机品质也参差不齐,最近看到大多数人都有一个疑问:买什么蓝牙耳机比较好?作为一个资深的耳机爱…

动态规划:状态压缩DP(2)(P1896 互不侵犯 ,矩阵计数)

文章目录互不侵犯矩阵计数互不侵犯 题目传送门 在NN的棋盘里面放K个国王,使他们互不攻击,共有多少种摆放方案。国王能攻击到它上下左右,以及左上左下右上右下八个方向上附近的各一个格子,共8个格子。 升级版的八皇后问题&#xf…

(一)随处可见的LED广告屏是怎么工作的呢?

笔者前段时间项目上正好用到一块32*128分辨率的单色LED,正式介入开发的时候,才发现网上的资料少之又少,供应商也给不出有价值的参考信息。故打算分成三篇详细的介绍下开发过程中遇到的问题。本篇主要介绍LED屏幕的一些基础信息,第…

C#互联网医院源码 智慧医院小程序源码 在线问诊在线开方源码

互联网医院平台源码 智慧医院管理系统源码 开发环境:ASP.NET C# VS2019 SQL2008 依托于实体医院利用互联网技术对接院内业务信息系统,向患者提供基于线上问诊、预约挂号、缴费结算、医患互动、诊后随访、健康科普和复诊等全面的医疗健康互联网服务。…

关于apifox和postman接口工具我有话要说~~

Apifox 和 Postman 都是流行的接口测试工具,各自有其优势和缺点。Apifox 的优势在于它提供了强大的可视化界面,可以方便地测试和监控 API。它还支持多种请求方式,并且支持对请求和响应进行代码生成。但是,Apifox 的缺点在于它不太…