在vue中调用就项目的已有接口时,发现一直报500的错误,经过network中的请求方式进行了对比,如下图:
旧项目的接口请求:

我的接口请求:

经过对比,发现旧项目中的请求数据格式为form-data格式,而vue中的请求数据格式为json格式,于是,我就在vue的axios请求时进行了配置,将它的请求数据格式改为form-data格式,具体如下:

设置headers请求头:

 ...let headers = {'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8'}let transformRequest = [function (data) {let ret = ''for (let it in data) {// 防止数据为 null 时,转换成字符串 'null' 传给后端导致报错ret += encodeURIComponent(it) + '=' + (data[it] !== null ? encodeURIComponent(data[it]) : '') + '&'}ret = ret.substring(0, ret.lastIndexOf('&'))return ret}]// 数据请求axios.post(url, sendData, {headers: headers, transformRequest: transformRequest}).then(successCallBack).catch(errorCallBack)

完成上面的配置,即可实现form-data数据格式的请求;

关于form-datajson这两种数据格式请求的区别及优劣势,我从网上总结了下面几点:
1.数据格式不同,form-data的数据格式为:a=1&b=2&c=3; json的数据格式为:{“a”: 1, “b”: 2, “c”: 3};
2.请求头不同,form-dataContent-Type: application/x-www-form-urlencoded; json: Content-Type: application/json
3.对于同样的数据信息,使用for-data数据量会比使用json的要小一点;
4.对于可读性来说,json的可读性要好;
5.form-data传二进制比较方便,如上传文件,而使用json则不太合适;

vue发送form-data数据格式请求相关推荐

  1. http协议的Request Payload 和 Form Data 的区别

    Request Payload VS Form Data 前端请求 我看了前端发起的请求,请求正文并不是我熟悉的 Form Data,而是 Request Payload.如图注意下面两个请求的 Co ...

  2. vue axios POST请求中参数以form data和request payload形式的原因

    HTTP请求中,如果是get请求,那么表单参数以name=value&name1=value1的形式附到url的后面,如果是post请求,那么表单参数是在请求体中,也是以name=value& ...

  3. angularjs中$http模块发送post请求request payload转form data

    背景: ionic+ angularjs+ cordova 在开发一个证书照片删除的时候,后端提供了一个post接口,需要前端将数据转化成form data.而在angularjs中,如果直接用pos ...

  4. vue 发送ajax请求

    一. 简介 1.vue本身不支持发送AJAX请求,需要使用vue-resource(vue1.0版本).axios(vue2.0版本)等插件实现 2.axios是一个基于Promise的HTTP请求客 ...

  5. Vue-resource中post请求将data数据以request payload转换为form data的形式

    今天在做项目的时候 需要往api中发送一个json格式的对象,但是怎么改都不行,当然,使用的vue 的 http方法. 而且,开始使用时 vue-resource中post请求时的一个坑,vue-re ...

  6. form data怎么接收_VUE发送Formdata数据,NodeJS接收

    VUE发送Formdata数据 •参数blob是通过this.cropper.getCroppedCanvas().toBlob(blob => { });获取到的.•具体使用方法,参考此链接地 ...

  7. 获取referer中的请求参数_Servlet获取AJAX POST请求中参数以form data和request payload形式传输的方法...

    本文实例讲述了Servlet获取AJAX POST请求中参数以form data和request payload形式传输的方法.分享给大家供大家参考,具体如下: HTTP请求中,如果是get请求,那么 ...

  8. Vue 发送数据请求

    这边是将我之前开发的一个项目开发记录进行分享一下吧,可能写的不是很好,毕竟还只是一个在校生.只能说还是一个新手小白的开发记录吧. 有需要的可以借鉴一下,有问题哈哈 也欢迎指出,毕竟发现问题才能更好的进 ...

  9. ajax请求的data数据格式

    ajax提交data类型 一.问题来源 今天使用ajax时,发现get传data时,传递json字符串时传不过去参数,所以做了一些实验测试ajax的get和post的传递data时的不同. 二.概念 ...

最新文章

  1. 判断网络连接(要验证)
  2. 这短短几行代码价值一万
  3. MySQL命令行登陆,远程登陆MySQL
  4. 装修时水电如何开槽?沟槽如何封堵?有哪些防止沟槽开裂的方法
  5. Coursera课程 Competitive Strategy内容简介
  6. java代码获取gc信息,如何监视Java垃圾回收
  7. 华中科技大学2005年计算机组成原理试题,华中科技大学200年计算机组成原理考研试题.doc...
  8. 最简单的基于FFMPEG的音频编码器(PCM编码为AAC)
  9. Red5开发第一步-Hello World
  10. ios端 ajax url的一个小问题
  11. DEAP数据库介绍--来自于音乐视频材料诱发得到的脑电数据
  12. 网易 android 加密,解析网易云音乐的加密方式
  13. AMS:startActivity桌面启动应用
  14. 智能监狱管理系统APP软件开发
  15. Detours库Windows API Hook
  16. 移动互联网寒冬到来,程序员该怎么办?
  17. 计算机无法关机 总是自动启动,告诉你win10电脑关机后自动开机怎么解决
  18. Android service 不被杀死“永不退出的服务”(双进程,服务,多进程,微信)
  19. 无lnternet_为什么无internet访问权限,无lnternet访问权限怎么办
  20. [解决问题]注册表修改windows用户名后,vscode以前的扩展消失

热门文章

  1. 数字证书和域名的对应关系
  2. Adobe CC Family (CC 2015) 大师版
  3. 社会网络分析之”组成部分”、小圈子和聚类
  4. 全站仪定向距离差 方向不差 这样敢放线吗
  5. C/C++ 中的%d等意义
  6. android 今日头条评论,模仿今日头条webview评论列表的实现
  7. 优酷视频上传工具可以试用吗
  8. arcgis server与portal解除联合的三种方式
  9. git config命令详解
  10. MindMapper中如何使用格式刷