最近正在编写自己的项目,其中遇到了nodejs后台接受到的富文本参数显示中文乱码的问题

一开始我以为是字符编码方式的错误,于是在请求参数的地方设置了utf-8,也就是:

  headers: {

    'Content-Type': 'x-www-form-urlencoded;charset=utf-8'

  }

这样做确实可以解决这方面的问题,然而我的问题仍没有得到解决,于是后来我细心的发现我的上传文字中出现了百分号%,那么问题的根源就找到了,encodeURIComponent(“中文”)会出现百分号,所以由此可得知fetch在处理上传数据的时候会自动对该数据进行编码,于是在前端这边可以对上传数据进行二次编码,把'%'编码成'%25',那么在后端就可以正确的获取数据:

  data:{id:1, content:encodeURI(encodeURI(‘商品'))}

ajax/fetch上传富文本时出现中文乱码的解决方案(百分号问题)的更多相关文章

  1. HttpClient多文件上传代码及普通参数中文乱码问题解决

    该随笔记录了在实际项目中使用HttpClient调用外部api,需上传文件和普通参数的代码. 笔者在使用 HttpClient 调用 http api 接口时,需要服务端上传文件和一些普通参数给 ht ...

  2. Ueditor富文本添加视频内容,视频不显示以及编辑富文本时,视频不显示解决方案

    问题是在添加视频时,编辑器会把视频标签<video>换成<img>.很讨厌... 1.2是解决添加视频时不显示,3是解决编辑时不显示 ueditor.all.js文件中  第7 ...

  3. Flex上传文件Java端解决中文乱码问题

    1.Flex端进行编码 public function encodeStr(str:String, charSet:String):String { var result:String =" ...

  4. js 解析url中search时存在中文乱码问题解决方案

    一 问题出现原因 当存在这样一种需求,前端需要通过url中search返回值进行保存使用,但如果search中存在中文解析出来会导致乱码.这个问题我找了很久原因,最后终于知道解决方案,这里和大家分享一 ...

  5. jQuery插件AjaxFileUpload实现ajax文件上传时老是运行error方法 问题原因

    今天在用jQuery插件AjaxFileUpload实现ajax文件上传时,遇到一个问题,如图: 老是运行error.无法运行succes方法,追踪ajaxfileupload.js源代码发现: wa ...

  6. vue+Ueditor集成 [前后端分离项目][图片、文件上传][富文本编辑]

    后端DEMO:https://github.com/coderliguoqing/UeditorSpringboot 前端DEMO:https://github.com/coderliguoqing/ ...

  7. java前后分离使用fetch上传文件失败500

    这次不是写什么技术要点,仅仅是记录一下 最近遇到的一个问题 背景 使用fetch向java后台上传文件时,前端调试报错500,后端的报错为multipart 无法解析,翻译过来大概是这个意思. 由于本 ...

  8. jquery.form.js官方插件介绍Form插件,支持Ajax,支持Ajax文件上传

    jquery.form.js官方插件介绍Form插件,支持Ajax,支持Ajax文件上传 http://www.malsup.com/jquery/form/#getting-started [JQu ...

  9. 使用ajax提交form表单,包括ajax文件上传

    前言 使用ajax请求数据,很多人都会,比如说: $.post(path,{data:data},function(data){ ... },"json"); 又或者是这样的aja ...

随机推荐

  1. Python开发环境Wing IDE使用教程:部分调试功能介绍

    下面是用户应该了解的Wing IDE的其它一些调试功能: Main Debug File—用户可以指定项目中的一个文件作为调试的主入口点.当完成这个设置之后,调试总是从这个文件开始,除非用户使用Deb ...

  2. Java开发工具IntelliJ IDEA使用教程:创建新的Andriod项目

    IntelliJ IDEA社区版作为一个轻量级的Java开发IDE,本身是一个开箱即用的Android开发工具. 注意:在本次的教程中我们将以Android平台2.2为例进行IntelliJ IDEA ...

  3. c#多线程随记回顾

    C#多线程随记回顾 1.创建多线程方式知道的有三种: ---手动创建Thread.使用线程池.使用task任务 ---手动创建Thread,分两种带参数和不带参数的帮助委托器 eg:  //帮助器委托 ...

  4. js urlencode , encodeURIComponent

    js 对文字进行编码涉及3个函数:escape,encodeURI,encodeURIComponent,相应3个解码函数:unescape,decodeURI,decodeURIComponent ...

  5. 树莓派学习笔记 1 -- 硬件的需求以及raspbian系统的安装

    树莓派(Raspberry Pi) --  基于Linux系统的大小只有信用卡大小的卡片式机器.  按照发明者的想法,他是想降低学习程序开发的成本而设计制作的这款产品.你可以理解为一个简陋版的电脑.树 ...

  6. 【值得收藏】绘图工具Origin的学习资料汇编【可免费下载】

    Origin使用教程 Origin为OriginLab公司出品的较流行的专业函数绘图软件,是公认的简单易学.操作灵活.功能强大的软件,既可以满足一般用户的制图需要,也可以满足高级用户数据分析.函数拟合 ...

  7. [转]iOS Tutorial – Dumping the Application Heap from Memory

     Source:https://blog.netspi.com/ios-tutorial-dumping-the-application-heap-from-memory/ An essential ...

  8. 使ie6的漂浮栏滑动右侧滚动条的时候不抖动

    body {_background-attachment: fixed;}html {_background-image: url(about:blank);}

  9. 前端开发的使用服务器环境开源项目 D2Server 可替代Apache

    推荐一个前端开发的使用服务器环境开源项目 D2Server 可替代Apache   攻欲善其事,必先利其器.前端开发,编辑器我们有了Sublime Text2,配置Server环境用……你可能会选择A ...

  10. Log in Spring

    记录日志向来是企业级应用程序必须考虑的事情.早些年,一个项目一个日志功能或模块,然后有了log4j这样的产品.不知是log4j将记录日志做到了极致,或是技术含量不高,又或是经济利益不明显,它已成为了这 ...