如何在nuxtjs中从express server获取ajax查询响应

Question

我想在从nuxtjs应用程序的任何页面发送ajax查询后，从node/express服务器获取数据。通常，为了在PHP服务器上获取和发送ajax查询，我会这样做：$_GET‘’var‘；echo json_encode(’服务器获取数据‘)；现在我想使用node server express在mongodb中保存数据。当我尝试发送查询时，响应返回文件test.js的完整代码。

文件index.vue

 methods: {
   onServer() {
     this.$axios.get('/server/test').then(res => {
       console.log('res', res.data)
    })
  }
 }

文件test.js

 var express = require('express');
 var app = express();

app.get('*', function (req, res) {
   res.send('Hello World!');
});

app.listen(3000, function () {
   console.log('Example app listening on port 3000!');
});

文件服务器/index.js

const express = require('express')
const consola = require('consola')
const { Nuxt, Builder } = require('nuxt')
const app = express()


// Import and Set Nuxt.js options
const config = require('../nuxt.config.js')
config.dev = !(process.env.NODE_ENV === 'production')

async function start() {
  // Init Nuxt.js
  const nuxt = new Nuxt(config)

  const { host, port } = nuxt.options.server

  // Build only in dev mode
  if (config.dev) {
    const builder = new Builder(nuxt)
    await builder.build()
  } else {
    await nuxt.ready()
  }

  // Give nuxt middleware to express
  app.use(nuxt.render)

  // Listen the server
  app.listen(port, host)
  consola.ready({
    message: `Server listening on http://${host}:${port}`,
    badge: true
  })
}
start()

我是一个新的用户节点，请帮助我！

Answer 1

您的主要问题是您的axios url中的目标是"test.js“。这就是为什么它响应文件而不是get路由应该响应的内容的原因。

所以试着这样做：

this.$axios.get('http://nuxt-profi/server/test').then(...

看看你能得到什么。你也应该能够在浏览器中访问它，只需转到你的url http://nuxt-profi/server/test，它应该会显示你的"Hello World“响应。

然而，我不能确定您是如何设置这一切的。您是否将其作为开发来运行？在这种情况下，您可能应该以http://localhost:3000/server/test的身份访问它，但您可能有如下配置的虚拟主机。另外，这是一个单独的后端api，还是您正在尝试将其作为服务器中间件？

如果这不起作用，请给我们更多关于你的项目设置的信息，我们将从那里开始。