使用 nuxt-mail 在 Nuxt.js 中发送邮件

kur*_*uro 1 javascript email vue.js axios nuxt.js

我是 Nuxt.js/Vue.js 的新手,所以这里有一些新手问题:D

我在从 Nuxt.js 应用程序中的联系人发送邮件时遇到问题。我正在尝试使用 nuxt-mailer 但无法使其工作。我已经安装了axiosnuxt -mail

我收到 500(内部服务器错误)。

所以我将其添加到nuxt.config.js

'@nuxtjs/axios',
['nuxt-mail', {
  message: {
    to: 'my-email',
  },
  smtp: {
    host: "localhost",
    port: 587,
  },
}],
Run Code Online (Sandbox Code Playgroud)

我是否应该将邮件放在“收件人”中我想要接收邮件的地方?我应该localhost进站host还是http://localhost?最后,我应该用什么双关语来表达“港口”?我的本地主机上的帖子是 3000 吗?

好吧,接下来,我在组件中的表单如下所示:

<template>
  <div class="container">
    <form>    
      <label for="name">Ditt namn</label>            
      <input id="name" type="text" v-model="name"/>

      <label for="email">Din epostadress</label>            
      <input id="email" type="email" v-model="email"/>

      <label for="phone">Telefon</label>            
      <input id="phone" type="phone" v-model="phone"/>

      <label for="message"> Meddelande: </label>
      <textarea id="message" v-model="message"/>
      
      <button type="submit" @click.prevent="send">Send email </button>
    </form>
   </div>
</template>
Run Code Online (Sandbox Code Playgroud)

脚本如下所示:

<script>
export default {
    data: () => ({
    name: '',
    email: '',
    phone: '',
    message: '',
  }),
  methods: {
    send() {
        this.$mail.send({
        name: this.name,
        from: this.email,
        phone: this.phone,
        subject: 'Message from contact-form',
        text: this.message,
      })
    }
  }
}
</script>
Run Code Online (Sandbox Code Playgroud)

那么问题出在哪里呢?想知道我是否在 nuxt.config.js 文件中做错了什么?但我根本不知道。

希望有人可以帮忙:)

Seb*_*ehr 5

我无意中成为 nuxt-mail 的开发者:)。刚刚在开发模块时发现了这篇文章。

所以,kisu已经提到了最相关的事情。您需要一个正在运行的邮件服务器,本地主机在这里不起作用(并且可能是源问题)。您可以做的就是查看Mailtrap。它基本上可以满足您的需求,这意味着它提供了一个用于测试和本地开发的邮件服务器。电子邮件将进入一个特殊的收件箱,您可以代表您检查并清空该收件箱。您甚至可以使用 API 来检查收件箱。

希望这对您有所帮助,如果您碰巧使用 nuxt-mail,如有任何问题,请随时提出问题,或者在Twitter上给我写信。