NUXT+express 中Vuex状态怎么保持安全

Question

新手学习vue+nuxt;
遇到一个的问题，困惑很长时间。刷新页面时，nuxt中vuex状态安全的问题；
问题一、配合插件vuex-persistedstate进行本地化，但是在store/index.js中，设置该插件导致window对象找不到。如何才能用上vuex-persistedstate不出错？
问题二、在只存储少量关键数据（如登录uuid和用户名），用fetch请求服务端找关键数据（比如/api/getUserInf）。fetch放在项目结构的哪个位置比较好？是放在框架比较高层级的位置？还是哪个组件要用到store就在哪个组件放置？
问题三、fetch到底是在客户端运行的还是服务端运行的？
问题四、nuxtServerInit这个方案，如果是加密的cookie，在nuxtServerInit中就无法提取到userID,这个是否有方法解决？

Answer 1

一、如果是用Nuxtjs，请配置插件：

plugins: [
    { src: '~/plugins/localStorage.js', ssr: false }
]，

然后，在localStorage.js中：

import createPersistedState from 'vuex-persistedstate';
import * as Cookies from "js-cookie";

let cookieStorage = {
  getItem: function(key) {
    return Cookies.getJSON(key);
  },
  setItem: function(key, value) {
    return Cookies.set(key, value, {expires: 3, secure: false});
  },
  removeItem: function(key) {
    return Cookies.remove(key);
  }
};

export default (context) => {
  createPersistedState({
    storage: cookieStorage,
    getState: cookieStorage.getItem,
    setState: cookieStorage.setItem
  })(context.store);
};

二、Nuxtjs的fetch只用于store，不能用来设置数据，可以用AsyncData设置数据，用在路由页面即可。
三、fetch官方文档很清楚了：服务端或切换至目标路由之前
四、可以用nuxtServerInit+express session存储用户登录

-----更新----
使用方法可以参考这个例子

https://github.com/alexkasong...