如何使用vue SSR访问路由守卫中的商店？
如何使用vue SSR访问路由守卫中的商店？
提问于 2018-09-21 23:54:02
我正在一个新项目中使用Vue + SSR，并尝试实现一个路由守卫，以在某些路由上强制执行身份验证。我想做这样的事情：
function requireAuth(to, from, next) {
if(!store.auth.getters.authenticated){
// redirect to login
}
...
}然而，我不能像在普通应用程序中那样简单地import商店，因为我按照the official docs为每个请求在函数内创建了一个新的实例。
export function createRouter () {
return new Router({
...
});
}有没有办法把商店交给巡检员？或者我从一个完全错误的角度来看这件事？任何帮助都是非常感谢的！
回答 1
Stack Overflow用户
发布于 2018-09-22 19:35:36
好吧，我找到了一个解决方案，但它不是最优雅的。灵感来自于this comment on GitHub。
# router/index.js
createRouter(store) {
const router = new Router({
mode: "history",
routes: [
{
path: "/some-protected-route",
beforeEnter: requireAuth.bind(store)
}
...
});
return router;
}
...
requireAuth(to, from, next) {
const store = this;
if(!store.getters["auth/authenticated"]) { ... }
}别忘了把存储传递给createRouter函数：
# app.js
export default function createApp() {
const store = createStore();
const router = createRouter(store);
sync(store,router)
const app = new Vue({
router,
store,
render: h => h(App)
});
return { app, router, store };
}还要确保避免/减轻底层逻辑中任何仅限浏览器的代码。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/52447289
复制相关文章
相似问题
腾讯云开发者
