Nuxt配合Node在实际生产中的应用详解(2)

在Nuxt官网上其实也有部分代码教你如何用自己写的Node去运行,但一直不是很完善,有点差强人意。我在这里就补充一下我的理解, 哪里写得不对,请尽管喷,谢谢喷我的每一个人

// nuxt const { Nuxt, Builder } = require('nuxt') // 引入核心构建属性 // 判断开发环境 const isProd = (process.env.NODE_ENV === 'production') const port = process.env.PORT || 80 // 引入nuxt配置 const config = require('./nuxt.config.js') config.dev = !isProd; const nuxt = new Nuxt(config); // 判断生产模式 dev(开发者模式)表示重新构建 ;pro(生产模式)表示直接从yanr build的文件直接执行 if (config.dev) { new Builder(nuxt).build() .then(listen) .catch((error) => { console.error(error) process.exit(1) }) } else { listen() }

以上的listen就是我在第二、三步写的相应接口的express服务器啦。

那么nuxt其实还并没有在代码中执行,new Nuxt一个Nuxt实例后返回一个nuxt方法,它其实是根据request,response去执行相应的渲染,其中我们要考虑到express()的各种接口的执行顺序,假如一开始就匹配到了第二步的代码的get请求,那么写在第二步代码后的all方法中的各种接口是接收不到的。

我考虑到的是接口不是无缘无故执行的,但用户请求是必然发生的。那么也就是当用户除了故意发送请求,全部由Nuxt接手。所以Nuxt会是放在最后让其渲染页面并交给用户,为了方便验证Token,我把验证Token的请求放在首页让浏览器捕获Token以及相应信息后交给Node执行手动登陆。(其实也可以通过在nuxt渲染前判断是否存在Token来决定是否进行token验证,我就不在这里再进行大量代码的展示了)

结合以上思路,也就是在最后捕获所有GET请求并交手给Nuxt即可:

// 最后捕获nuxt渲染 nuxtapp.get('/*', (req, res) => { nuxt.render(req, res) })

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:http://www.heiqu.com/2a6bac25fd7ac44267cc0965b7411d85.html