网络请求(注意这里只是讲网络请求,并没有跨域)最常用的是GET和POST请求。
网络请求的意义:1.给后端做网络请求,给后端发送数据;2.接收后端发过来的数据;3.完成前后端交互
(1)GET请求:一般情况下,发送请求从服务器上获取资源,不会对服务器资源产生任何影响的时候使用GET请求。
(2)POST请求:向服务器发送数据(登录)、上传文件等让服务器处理,会对服务器资源产生影响的时候使用POST请求。
区别:
GET请求参数会完整的保留在浏览器的历史记录中,POST请求的参数不会保留。
GET请求前后端
接收GET请求的数据:ctx.request.query 或者 ctx.query
GET请求的特点
1.AJAX-open-send既可以做get请求,也可以做post请求
ajax的get请求特点:
前端get请求传输的参数(信息)是拼接到网址上的。(注意别人是可以截取到的,所以不安全) GET请求传输参数给后端,参数会拼接到url中,不安全,速度快。 后端返回的数据,程序员用js语言来使用返回的数据(前提是xhr对象接受了数据)
2.form-action表单,唯一能传输文件的网络请求发送GET/POST/DELETE等等给action属性对应的url发送网络请求。
-
1.用户点击了提交按钮或者触发表单的提交事件
-
2.get请求会把form中的数据全部解析为url的querystring
-
3.后端返回的数据,后端返回的数据,接受的数据会直接读取渲染到页面,如果解析失败就会下载(比如压缩包就会解析失败)
form标签的target决定了后端返回的数据是在当前页面渲染,还是在新页面中渲染。
form标签子元素input标签里面的name属性代表了传的后端的查询字段的key值
3.浏览器的地址栏只能发送get请求,接受的数据会直接读取渲染到页面,如果解析失败就会下载(比如压缩包就会解析失败)
4.a标签的href属性也只能发送get请求,并且是点击事件触发了默认事件才会发送get请求,发送网络请求给href的网址,后端返回的数据,接受的数据会直接读取渲染到页面,如果解析失败就会下载(比如压缩包就会解析失败)
a标签的target决定了后端返回的数据是在当前页面渲染,还是在新页面中渲染。
5.img-src只能发送get请求,返回的数据渲染成图片,如果非图片编码,就会碎裂(就是解析不出来),网络请求成功的标识:img.onnnload=()={}
6.link-href只能发送get请求,返回的数据按照功能使用
7.script-src:JSONP,srcipt请求到网址,得到了数据,就会用v8引擎运行它(只能发get请求)
GET实际案例
一、AJAX的get请求、axios的get请求
router.js文件注册网址:
在home.js文件中后端接收前端发过来的数据包:this.ctx.request
将它的查询字段解析为对象:this.ctx.request.query
home.js文件中收到前端传过来的数据,并返回给前端一个数据:
后端代码打印结果
前端index.html文件中做网络请求
1.原生AJAX代码发送get请求
2.使用axios发送get请求:axios.get()等价于axios()
网址:/zbc?count=20&callback=${re}
代码运行结果图:
二、浏览器get请求
在浏览器的地址栏输入:http://127.0.0.1:7001/public/yan.zip
get请求结果: