なぜNuxtはサーバーを何度も呼びますルート/ページに何度ですか?単一のルート/ページ上でサーバを複数回呼び出す場合のNuxt/Vueバグ?
以下が、私は彼らのexpress-templateからテスト例です。
import express from 'express'
import { Nuxt, Builder } from 'nuxt'
import api from './api'
const app = express()
const host = process.env.HOST || '127.0.0.1'
const port = process.env.PORT || 3000
app.set('port', port)
app.use(function(req, res, next) {
console.log(res.headersSent) // <-- pay attention here
next()
})
// Import API Routes
app.use('/api', api)
// Import and Set Nuxt.js options
let config = require('../nuxt.config.js')
config.dev = !(process.env.NODE_ENV === 'production')
// Init Nuxt.js
const nuxt = new Nuxt(config)
// Build only in dev mode
if (config.dev) {
const builder = new Builder(nuxt)
builder.build()
}
// Give nuxt middleware to express
app.use(nuxt.render)
// Listen the server
app.listen(port, host)
console.log('Server listening on ' + host + ':' + port) // eslint-disable-line no-console
このroute/page/index.vueはapi/users
を呼び出します:
import axios from '~/plugins/axios'
export default {
async asyncData() {
let { data } = await axios.get('/api/users')
return { users: data }
},
head() {
return {
title: 'Users'
}
}
}
私はplugins/axios.jsでconsole.log
を追加しました:
import * as axios from 'axios'
let options = {}
// The server-side needs a full url to works
if (process.server) {
options.baseURL = `http://${process.env.HOST || 'localhost'}:${process.env.PORT || 3000}`
console.log('express:' + options.baseURL)
}
export default axios.create(options)
とき私はアプリを実行し、acc http://127.0.0.1:3000/で私のブラウザ上でそれをESS:
私の端末では、私が得る:
false
express:http://localhost:3000
false
false
false
false
false
false
false
false
あなたはそれが最初呼び出し後api/users
8回多くを求めていることを見ることができるように。
Nuxtにはバグがありますか?
私はserver/index.jsからapp.use(nuxt.render)
を削除した場合:
// Give nuxt middleware to express
// app.use(nuxt.render)
そして私はhttp://127.0.0.1:3000/またはhttp://127.0.0.1:3000/api/usersでそれにアクセスし、私が取得:正しい
false
だけコールを。
Nuxtでは何が起こっていますか?