前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >vue调取接口传递token参数

vue调取接口传递token参数

作者头像
申霖
发布2019-12-27 17:58:01
3.1K0
发布2019-12-27 17:58:01
举报

使用vue框架调取接口时,在请求头中携带参数token,用于业务验证,对于console中出现的CORS跨域问题,及后端程序参数值接收问题,做出相应的处理方案。

vue
vue

一、处理方案

//允许跨域传递cookie
header("Access-Control-Allow-Credentials:true");

//解决跨域问题
header("Access-Control-Allow-Origin: http://www.explode.com");
 
//请求头参数
header("Access-Control-Allow-Headers: Origin, X-Requested-With, Content-Type, Accept, token, lang");

//返回头参数
header("Access-Control-Expose-Headers: token, lang");

二、简要说明

1、vue在请求头默认不携带任何参数,需要手动设置请求头,并设置相应参数,此处理方案仅为后端接口配置方法;

2、需要将请求来源地址设置清晰,可以设置为IP或域名;

3、请求头参数需要和前端请求头传递名一致;

4、返回头参数需要和请求头参数自定义部分一致;

5、示例方案中lang和token为自定义参数;

三、引用资料

来源:https://blog.csdn.net/qq_27950699/article/details/88579434

Header

解释

示例

Accept

指定客户端能够接收的内容类型

Accept:   text/plain, text/html,application/json

Accept-Charset

浏览器可以接受的字符编码集。

Accept-Charset:   iso-8859-5

Accept-Encoding

指定浏览器可以支持的web服务器返回内容压缩编码类型。

Accept-Encoding:   compress, gzip

Accept-Language

浏览器可接受的语言

Accept-Language:   en,zh

Accept-Ranges

可以请求网页实体的一个或者多个子范围字段

Accept-Ranges:   bytes

Authorization

HTTP授权的授权证书

Authorization:   Basic QWxhZGRpbjpvcGVuIHNlc2FtZQ==

Cache-Control

指定请求和响应遵循的缓存机制

Cache-Control:   no-cache

Connection

表示是否需要持久连接。(HTTP 1.1默认进行持久连接)

Connection:   close

Cookie

HTTP请求发送时,会把保存在该请求域名下的所有cookie值一起发送给web服务器。

Cookie:   $Version=1; Skin=new;

Content-Length

请求的内容长度

Content-Length:   348

Content-Type

请求的与实体对应的MIME信息

Content-Type:   application/x-www-form-urlencoded

Date

请求发送的日期和时间

Date:   Tue, 15 Nov 2010 08:12:31 GMT

Expect

请求的特定的服务器行为

Expect:   100-continue

From

发出请求的用户的Email

From:   user@email.com

Host

指定请求的服务器的域名和端口号

Host:   www.zcmhi.com

If-Match

只有请求内容与实体相匹配才有效

If-Match:   “737060cd8c284d8af7ad3082f209582d”

If-Modified-Since

如果请求的部分在指定时间之后被修改则请求成功,未被修改则返回304代码

If-Modified-Since:   Sat, 29 Oct 2010 19:43:31 GMT

If-None-Match

如果内容未改变返回304代码,参数为服务器先前发送的Etag,与服务器回应的Etag比较判断是否改变

If-None-Match:   “737060cd8c284d8af7ad3082f209582d”

If-Range

如果实体未改变,服务器发送客户端丢失的部分,否则发送整个实体。参数也为Etag

If-Range:   “737060cd8c284d8af7ad3082f209582d”

If-Unmodified-Since

只在实体在指定时间之后未被修改才请求成功

If-Unmodified-Since:   Sat, 29 Oct 2010 19:43:31 GMT

Max-Forwards

限制信息通过代理和网关传送的时间

Max-Forwards:   10

Pragma

用来包含实现特定的指令

Pragma:   no-cache

Proxy-Authorization

连接到代理的授权证书

Proxy-Authorization:   Basic QWxhZGRpbjpvcGVuIHNlc2FtZQ==

Range

只请求实体的一部分,指定范围

Range:   bytes=500-999

Referer

先前网页的地址,当前请求网页紧随其后,即来路

Referer: http://www.explode.com

TE

客户端愿意接受的传输编码,并通知服务器接受接受尾加头信息

TE:   trailers,deflate;q=0.5

Upgrade

向服务器指定某种传输协议以便服务器进行转换(如果支持)

Upgrade:   HTTP/2.0, SHTTP/1.3, IRC/6.9, RTA/x11

User-Agent

User-Agent的内容包含发出请求的用户信息

User-Agent:   Mozilla/5.0 (Linux; X11)

Via

通知中间网关或代理服务器地址,通信协议

Via:   1.0 fred, 1.1 nowhere.com (Apache/1.1)

Warning

关于消息实体的警告信息

Warn:   199 Miscellaneous warning

本文参与 腾讯云自媒体分享计划,分享自作者个人站点/博客。
原始发表:2019-10-03,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体分享计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档