什么是GET和POST要求

GET:向指定路径资源发送要求,常日用于获取数据

POST:向指定路径资源提交数据进行处理要求,常日用于提交表单或者上传文件

GET和POST要求的差异

1,GET一样平常是从做事器上获取数据,POST是向做事器提交数据。

Php定时提交postVue实战032axios应用get和post发送各类要求 Docker

2,GET通过URL提交数据,数据在URL中可以看到,POST则是在HEADER内提交。

3,GET提交的数据不能大于2KB,而POST不受限定。

4,GET数据随意马虎透露,POST较为安全

Content-Type

Content-Type是指发送信息至做事器时的内容编码类型,常见的表单提交或上传文件的常用的资源类型有application/x-www-form-urlencoded、multipart/form-data、 application/json、 application/xml,默认情形下为application/x-www-form-unlencoded。

axios发送GET要求

get发送要求时参数附在URL上,已键值对的形式呈现,如http://localhost:8000/test/?name=kevinfan&&age=18,这里通报的便是name=kevinfan&&age=18两个参数。

class test(APIView): //大略的测试接口,如果用户名存在则返回成功 authentication_classes = [] def get(self, request): res = {'code': 403, 'msg': ''} name = request.GET.get('name') age = request.GET.get('age') if(name): res['code'] = 200 res['msg'] = '我收到了' res['name'] = name res['age'] = age return Response(res)

那么axios发送要求的时候就可以这样写,这里须要把稳的是,如果你在url发送动态的参数name和age时,请用符号“`”包裹(这个是键盘esc下面那个按键的符号),而不是符号“\公众”。

test(){ let name='kevinfan' let age='18' let url=`http://localhost:8000/test/?name=${name}&&age=${age}` // let url=\"大众http://localhost:8000/test/?name=kevinfan&&age=18\"大众 也可以这样写 this.$axios.get(url) .then(res=>{ console.log(res) }) .catch(err => console.log(err))}

get除了可以发送一些大略的参数也可以携带要求头参数,比如说我想把token通过要求头的形式发送至后台,这里我在headers中定义了Authorization=token,通过验证token来获取用户信息。

getuserinfo(){ let token=localStorage.getItem('token') this.$axios.get('http://127.0.0.1:8000/userinfo/',{ headers: { 'Authorization': token } }).then(res=>{ console.log(\"大众res=======\公众,res) }).catch(err => console.log(err))}

后台接管要求头信息时该当用request.META.get('HTTP_AUTHORIZATION'),而且这里我们须要把稳的是,前端发过来的字段是Authorization,而后台接管时确是HTTP_AUTHORIZATION。

class TokenAuth(BaseAuthentication): def authenticate(self, request): # 规定token用要求头通报 token = request.META.get('HTTP_AUTHORIZATION') token_obj = UserToken.objects.filter(token=token).first() if not token_obj: raise AuthenticationFailed('用户认证失落败') return (token_obj.user, token_obj)axios发送POST要求

post发送要求时参数放在HEADER的要求体中,axios默认发送数据时,数据格式是Request Payload(要求头 Content-Type: application/json),而我们常用的是Form Data(要求头 Content-Type: application/x-www-form-urlencoded)格式。

this.$axios.post('http://127.0.0.1:8000/login/',{ username:this.uname, password:this.password,}).then(res =>{ //省略}).catch(err => console.log(err))

如果我们直接将如上所示的数据发送给Django后台的话收到的数据会是None,这里我们可以看到发送的数据格式为Request Payload(要求头 Content-Type: application/json),这时我们就不能以json形式传参,而是通过键值对形式传参。

办理办法:axios中供应了qs模块,可以对数据格式进行转换,在axios中引入this.$qs.stringify(),这样在传参前将数据自动处理成键值对形式,这里我们可以看到发送的数据格式为Form Data(要求头 Content-Type: application/x-www-form-urlencoded),后台也正常吸收到了数据。

this.$axios.post('http://127.0.0.1:8000/login/',this.$qs.stringify({ username:this.uname, password:this.password,})).then(res =>{ //省略}).catch(err => console.log(err))

axios通过POST传文件

POST除了可以发送数据之后,还可以用于发送文件(如传图片等),那么这时文件便是个工具而并不是参数。
这是我们就须要申明一个FormData工具,以formData.append('键',工具)形式将工具添加到formData中然后通报。

let url='http://127.0.0.1:8000/uploadimage/'let formData = new FormData() //创建FormData实例formData.append('img',blobInfo.blob()) //这是tinymce编辑器中的传图this.$axios.post(url,formData).then(response =>{ //省略}).catch(err => console.log(err))

欢迎关注本人的公众年夜众号:编程书信,文章也会在"大众号更新