第六天学习后端——egg——GET请求

456 阅读3分钟

网络请求(注意这里只是讲网络请求,并没有跨域)最常用的是GET和POST请求。

网络请求的意义:1.给后端做网络请求,给后端发送数据;2.接收后端发过来的数据;3.完成前后端交互

(1)GET请求:一般情况下,发送请求从服务器上获取资源,不会对服务器资源产生任何影响的时候使用GET请求。

(2)POST请求:向服务器发送数据(登录)、上传文件等让服务器处理,会对服务器资源产生影响的时候使用POST请求。

区别

GET请求参数会完整的保留在浏览器的历史记录中,POST请求的参数不会保留。

image.png

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文件注册网址:

image.png

在home.js文件中后端接收前端发过来的数据包:this.ctx.request

将它的查询字段解析为对象:this.ctx.request.query

home.js文件中收到前端传过来的数据,并返回给前端一个数据:

image.png

后端代码打印结果

image.png

前端index.html文件中做网络请求

image.png

1.原生AJAX代码发送get请求

image.png

2.使用axios发送get请求:axios.get()等价于axios()

网址:/zbc?count=20&callback=${re}

image.png

代码运行结果图:

image.png

二、浏览器get请求

在浏览器的地址栏输入:http://127.0.0.1:7001/public/yan.zip

image.png

get请求结果:

image.png

三、form-action做get请求

在前端index.html文件中

image.png

在浏览器中输入网址:

image.png

点击按钮的结果:

image.png

image.png