使用Nodemailer在Angular中创build联系人表单
我正在尝试为我的网站创build一个联系表单。 我正在使用MEAN堆栈，所以nodemailer模块似乎是有意义的使用。
我已经创build了一个端点'/api/contact'来接受一个POST请求，并使用该请求上的数据来发送邮件。
然后，我在我的angular度应用程序，它提交调用一个函数，使一个http的forms。
希望这听起来是正确的。 另外，我一直在使用Yeoman angular-fullstack生成器，所以我的代码遵循这个结构。
当应用程序加载，虽然在我的控制台，我看到一个500错误代码，然后当我看在日志中，我看到在我的contact.controller阅读和body属性错误。
这是我的代码：
app.js
... var express = require('express'); --- // Setup server var app = express(); var server = require('http').createServer(app); require('./config/express')(app); require('./routes')(app); // Start server server.listen(config.port, config.ip, function () { console.log('Express server listening on %d, in %s mode', config.port, app.get('env')); }); // Expose app exports = module.exports = app;
routes.js
module.exports = function(app) { // Insert routes below app.use('/api/contact', require('./api/contact')); ...
./api/contact/index.js
var express = require('express'); var controller = require('./contact.controller'); var router = express.Router(); router.post('/', controller.send); module.exports = router;
./api/contact/contact.controller.js
var nodemailer = require('nodemailer'); var transporter = nodemailer.createTransport({ service: 'gmail', auth: { user: //removed pass: //removed } }); exports.send = function(req,res){ var mailOptions = { to: //removed - my email address, subject: 'New request on lumbajack from ', from: req.data.from, html: req.data.body }; transporter.sendMail(mailOptions, function(err, info){ if (err) { console.log(err); }else{ console.log('Message sent: ' + info.response); } }); }
然后在客户端，我的angular度控制器
angular.module('lumbajackApp') .controller('MainCtrl', ['$http', function ($http) { var ctrl = this; ctrl.emailData = { from: '', name: '', body: '' }; ctrl.postMail = function (data) { $http.post('/api/contact', data); }; }]);
最后是我的HTML
<form ng-submit="main.postMail(main.emailData)" novalidate> <input type="text" ng-model="main.emailData.from"> <input type="text" ng-model="main.emailData.name"> <input type="text" ng-model="main.emailData.body"> <input type="submit" value="Submit"> </form>
你错过了服务器控制器的callback。 我重写了下面的一些代码
（服务器/ API /接触/ contact.controller.js）
var nodemailer = require('nodemailer'); var transporter = nodemailer.createTransport({ service: 'gmail', auth: { user: me@gmail.com, // your email here pass: xxxxxxx // your password here } }); exports.send = function(req,res){ var htmlContent = '<p>Name: ' + req.body.name + '</p>' + '<p>Email: ' + req.body.email + '</p>' + '<p>Message: ' + req.body.message + '</p>'; var mailOptions = { to: 'me@gmail.com', // your email here subject: 'New message', from: req.body.name + ' <' + req.body.email + '>', sender: req.body.email, html: htmlContent }; transporter.sendMail(mailOptions, function(err, info){ if (err) { console.log(err); }else{ console.log('Message sent: ' + info.response); return res.json(201, info); } }); }
然后在你的Angular控制器中：（client / app / main / main.controller.js）
'use strict'; angular.module('myApp') .controller('MainCtrl', function ($scope, $http) { $scope.postData = {}; $scope.postMail = function (contact) { // Check form validation if ($scope.contactForm.$invalid === true) { return } // wrap all your input values in $scope.postData $scope.postData = angular.copy(contact); $http.post('/api/contact', $scope.postData) .success(function(data) { // Show success message }) .error(function(data) { // Show error message }); }; });
你的forms将如下所示：（在客户端/应用程序/主/ main.html）
<form name="contactForm" novalidate> <input type="text" name="name" ng-model="contact.name" placeholder="Your name" required> <input type="email" name="email" ng-model="contact.email" placeholder="Your email" required> <textarea name="message" ng-model="contact.message" placeholder="Your message" required>{{message}}</textarea> <button type="submit" ng-click="postMail(contact)">Send</button> </form>
多谢你们。 尝试做控制台日志，可以看到数据没有被传递，另外，端点被击中的页面加载而不是提交。
通过改变周围的angular码来停止被立即调用的函数来解决，然后必须在post调用和res.end（）声明中添加一个响应！