前端请求后端数据的三种方式

在前后端分离的开发项目中，前后端联调的时候会出现这样那样的问题，尤其是在调取数据的程序上面，有时候前端给的前端给到后端的明明是正确的但就是无法拿到正确的数据，下面小千就来给大家详解一下常见的三种数据传输方式。

1、地址栏传输数据

  1）、query string Parameters：当请求方式是get时，浏览器会使用查询字符串的方式进行传递数据，即：query string Parameters查询字符串的规则：请求参数使用 URL地址和“问号传参“ 的方式进行传递----用问号把url和请求参数分开。请求参数的格式：以键值对的方式体现，多个键值对之间用&隔开。假设：请求地址为 newsList.php。请求参数是pageIndex和pageCount。那么，请求的格式为：newsList.php?pageIndex=1&pageCount=10;如下图，请求方式为get，在chrome浏览器的network里看到的是：query string Parameters

2、请求体中传输数据

  当请求方式不是get（大部分情况是post或put）时，那么请求的数据不是在url上，而是在请求体里。请求体的英文就是：request payload。但是chrome浏览器针对不同的content-type有做了区分，分别是formData和request payload。1）、formDatacontent-type的值是" application/x-www-form-urlencoded"或者 multipart/form-data; boundary=----WebKitFormBoundaryBoMA1XQDUpwpxKQg 时，那么，就是用的是formData的格式传递数据

  2）、request payloadcontent-type的值是" text/plain"或者"application/json" 时，那么，就是用的是request payload的格式传递数据

附：默认的数据格式

  1、传统的ajax请求时候，Content-Type默认为"文本"类型。2、传统的form提交的时候，Content-Type默认为"Form"类型（ application/x-www-form-urlencoded ）3、axios传递字符串的时候，Content-Type默认为"Form"类型（ application/x-www-form-urlencoded ）4、axios传递对象的时候，Content-Type默认为"JSON"类型（（ application/json）

本文来自千锋教育，转载请注明出处

前端请求后端数据的三种方式相关推荐

前端请求后端数据的三种方式！
在前后端分离的开发项目中,前后端联调的时候会出现这样那样的问题,尤其是在调取数据的程序上面,有时候前端给的前端给到后端的明明是正确的但就是无法拿到正确的数据,下面小千就来给大家详解一下常见的三种数据传 ...
Vue项目中前端请求后端数据的两种方式
1.JS方式,使用fetch函数,较底层 //JS方式请求分页数据 fetch("http://localhost:9090/user/page?pageNum=" +this.p ...
vue三种ajax请求方式,vue请求数据的三种方式
请求数据的方式: vue-resource 官方提供的 vue的一个插件 axios fetch-jsonp 一,vue-resource请求数据介绍:vue-resource请求数据方式是官方提供 ...
web服务器与网页表单通信,前端与后端通信的几种方式
只有知道了历史,才能更好的把握现在和未来. 在项目中,通常前端开发主要完成两件事情,一是界面搭建,一是数据交互. 下面是我总结前端与后端交互的几种方式,本文只作简单介绍,不做深入了解. 一.AJAX ...
前端实现跨域的三种方式
前端解决跨域的三种方式: 1.cors跨域(只需要后端配置) header("Access-Control-Allow-Origin:*"); // 允许任何来源 header(& ...
layui根据条件显示列_templet渲染layui表格数据的三种方式
layui前端框架是我一直在使用,也很好用. 今天记录一下,templet渲染layui表格数据的三种方式. 第一种:直接渲染(对于表格数据样式要求不高) 直接在动态表格字段声明,添加templet属 ...
layui 表格内容写temple函数_templet渲染layui表格数据的三种方式
layui前端框架是我一直在使用,也很好用. 今天记录一下,templet渲染layui表格数据的三种方式. 第一种:直接渲染(对于表格数据样式要求不高) 直接在动态表格字段声明,添加templet属 ...
discard connection丢失数据_python kafka 生产者发送数据的三种方式
python kafka 生产者发送数据的三种方式发送方式同步发送发送数据耗时最长有发送数据的状态,不会丢失数据,数据可靠性高以同步的方式发送消息时,一条一条的发送,对每条消息返回的结果判断 ...
ios网络学习------4 UIWebView的加载本地数据的三种方式
ios网络学习------4 UIWebView的加载本地数据的三种方式分类: IOS2014-06-27 12:56 959人阅读评论(0) 收藏举报 UIWebView是IOS内置的浏览器, ...

前端请求后端数据的三种方式

1、地址栏传输数据

2、请求体中传输数据

附：默认的数据格式

前端请求后端数据的三种方式相关推荐

最新文章

热门文章

前端请求后端数据的三种方式

1、地址栏传输数据

2、 请求体中传输数据

附：默认的数据格式

前端请求后端数据的三种方式相关推荐

最新文章

热门文章

2、请求体中传输数据