深圳网站建设 公司元百度网站优化

背景：

nuxt做为一个vue的服务端渲染框架，本身就具备服务端的功能，理论上可以完整做一个系统功能，包括对数据库等等操作，但更合理的做法是nuxt应该定位只做服务端渲染的事情，更偏向ui层面，而非数据curd，业务逻辑，权限等等偏向服务端的逻辑。本身基于vue的服务端渲染已经也挺耗性能，所以应该单独规划一层，类似bff+ui；

按这个规划nuxt的数据来源就应该是透传到内部的服务器，那么怎样实现透传呢？

解决方案：

1.如果服务端设计的session存储方式是cookie，则可以通过配置nuxt.config.ts

routeRules: {"/sapi/**": {proxy: {to: "http://xxx/**",},},},

的方式，将本地请求地址/api/xx，完全代理到http://xxx/xx

类似nginx的代理功能；用nginx完全可以代替，性能可能还更好

2.如果服务端设计的是jwt，在header加其他字段保存的方式，那上面的方式就不行了

为什么不行？因为一个界面打开的时候，请求头是不会自动带任何自定义的东西的，这个功能只有cookie才能完成。所以如果登录后，刷新一个需要登录后的页面，这个获取不到页面任何凭证，所以会退出到登录页。要完整实现这种功能就需要做一些中间件拦截代理请求，将token获取到后，转成cookie下发到客户端，同时拦截客户端提交请求