首页 > 编程知识 正文

token是固定的吗,token是什么意思啊

时间:2023-05-06 00:31:17 阅读:183157 作者:1992

1.为什么要使用token,token是什么?

官方回答:
Token 是在服务端产生的。如果前端使用用户名/密码向服务端请求认证,服务端认证成功,那么在服务端会返回 Token 给前端。前端可以在每次请求的时候带上 Token 证明自己的合法地位。
我自己理解:
token就相当于客户端登录的账号的唯一标识,在做一些数据请求的时候,后台会要求在请求头中携带token,如果没有token,或者token过期了,那么这时候就会对这个客户端进行返回响应的数据,然后前端在解析这些数据,判断是token过期,还是没有携带token,然后让用户进行相应的操作。总而言之,token是在向后台请求数据的时候必不可少的。如果没有token,那么后台要么不会返回响应的数据,要么就会返回一些无关紧要的数据。

2.验证本地token。

​ 有些数据如果请求头不携带token是请求不到的,服务器会给我们返回空的数据或者是直接报错,这时候我们就可
以在请求数据的时候进行前端验证本地token是否存在,如果存在的话就发送请求,如果不存在就让提醒用户前去
登录或者没有登录无法查看数据,而我们在用户等了之后就把后台返回给我们的token值保存在本地。

3.请求头携带token。

如何在请求头中携带token
-----上代码
// 请求拦截器

let _axios = axios.create(); // 创建axios实例 // 请求拦截器_axios.interceptors.request.use( // 请求成功 function (config) { const token = localStorage.getItem('token') if (token) { // 判断是否存在token,如果存在的话,则每个http header都加上token config.headers.authorization = token //请求头加上token } Toast.loading({ message: '加载中...', forbidClick: true, }); return config }, // 请求失败 function (error) { return Promise.reject(error) }) 4.关于登录注册。

登录注册一直都是前端程序员绕不开的一个需求,不管你是写什么项目都会用到登录注册 ,lmdwd写代码到登录注册的时候大概会分为两个模块

​ 密码登录 在写密码登录的时候就回进行验证用户名、账号、手机号中的一种,当然这些验证都要写在前端,不然每一次都发送请求给服务器占用服务器性能,一般都是在写非空、格式的判断还有密码的长短判断。 ​ 手机号验证码登录 ​ 这种登录方式又涉及到了第一次登录那就相当于注册了,而注册之后是前往设置密码、个人信息,还是前往某个页面这些就根据项目需求来决定,不同的项目需求也不一样。 5.关于封装axios和封装接口。

封装axios

import axios from 'axios'import { Toast } from 'vant';let _axios = axios.create({ // 在这里配置请求头 // baseURL: "https://wap.*******.com" // 公共地址 // headers:{} // 请求头})// 请求拦截器_axios.interceptors.request.use( // 请求成功 function (config) { const token = localStorage.getItem('token') if (token) { // 判断是否存在token,如果存在的话,则每个http header都加上token config.headers.authorization = token //请求头加上token } Toast.loading({ message: '加载中...', forbidClick: true, }); return config }, // 请求失败 function (error) { return Promise.reject(error) })// 响应拦截器_axios.interceptors.response.use( // 响应成功 function (response) { if(response.code==200){ Toast.clear() } return response }, // 响应失败 function (error) { return Promise.reject(error) })// 默认导出 _axiosexport default _axios

封装接口

​ 首先新建一个request.js文件,一般建在utils下,然后倒入刚才封装的axios.js文件,新建一个对象,在对象中添加方法,方法就是请求接口的函数封装,然后默认导出对象,在main.js中导入requeat.js文件,然后将对象挂载在vue原型上。,然后倒入刚才封装的axios.js文件,新建一个对象,在对象中添加方法,方法就是请求接口的函数封装,然后默认导出对象,在main.js中导入requeat.js文件,然后将对象挂载在vue原型上。

版权声明:该文观点仅代表作者本人。处理文章:请发送邮件至 三1五14八八95#扣扣.com 举报,一经查实,本站将立刻删除。