首页 > 解决方案 > 如何使用 Nuxt.js 生成一个静态应用程序,该应用程序在部署后使用 express 有一个发布请求?

问题描述

我在 server/index.js 中有一个 post 请求,它使用两个参数 req 和 res 并使用 Mailgun 的 API 发送电子邮件。req.body 从位于 vue 组件中的表单接收数据。在 localhost 中一切正常,但在部署停止发送电子邮件后。

我在 Nuxt.js 文档中发现了这一点:使用 nuxt generate 生成 Web 应用程序时,提供给 asyncData 和 fetch 的上下文将没有 req 和 res。但我不知道如何解决该问题并在部署后使其工作。

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

const bodyParser = require('body-parser')
const mailgun = require('mailgun-js')

const app = express()

app.use(bodyParser.urlencoded({extended:false}))

// 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()

app.post('/', (req, res) => {
  var api_key = 'my_api_key';
  var domain = 'my_domain';
  var mailgun = require('mailgun-js')({apiKey: api_key, domain: 
domain});

  var data = {
    from: `From ${req.body.userName} <${req.body.email}>`,
    to: 'my_email@gmail.com',
    subject: `Msg From Terminal`,
    text: `Message: ${req.body.message}`
  };

  mailgun.messages().send(data, function (error, body, event) {
    console.log(error, body, event);
  });
  res.redirect('/')
})

我也尝试了来自客户端的发布请求,但后来它被 CORS 阻止了,所以我的技能组中没有更多技巧。

标签: expressvue.jspostnuxt.jsmailgun

解决方案


推荐阅读