使用Vuex解决Vue中的身份验证问题-创新互联
传统方式中,许多人使用本地存储,来管理通过客户端验证生成的tokens。一个大问题是如何有更好的方式,来管理验证tokens,从而允许我们来存储更大的用户信息。
网站设计制作过程拒绝使用模板建站;使用PHP+MYSQL原生开发可交付网站源代码;符合网站优化排名的后台管理系统;成都网站设计、做网站收费合理;免费进行网站备案等企业网站建设一条龙服务.我们是一家持续稳定运营了十载的创新互联建站网站建设公司。这就是Vuex的作用。 Vuex为Vue.js应用管理状态.。对于应用中所有的组件来说,它被当做中央存储,并用规则确保状态只能以可预见的方式改变。
对于经常检查本地存储来说,听起来是个更好的选择?让我们一起来探索下吧。
建立应用模块
对于这个项目,我们想创建一个使用vuex和vue-router的vue应用。我们会使用vue cli 3.0 来创建一个vue项目,并从选项中选择路由和vuex。
执行下面的命令开始创建:
$ vue create vue-auth
按照对话框的提示,添加必要的信息,并选择我们需要的选项,完成安装。
下一步, 安装axios:
$ npm install axios --save
配置Axios
我们在许多组件中都需要用到axios。让我们在全局整体来配置它,这样当我们需要它的时候,不用每次都去引入。
打开 ./src/main.js 文件,并且添加下面:
[...] import store from './store' import Axios from 'axios' Vue.prototype.$http = Axios; const token = localStorage.getItem('token') if (token) { Vue.prototype.$http.defaults.headers.common['Authorization'] = token } [...]
本文标题:使用Vuex解决Vue中的身份验证问题-创新互联
网页路径:http://scyanting.com/article/isgep.html