Создание формы контакта в Угловом с Nodemailer

Question

Я пытаюсь создать контактную форму для своего сайта. Я использую стек MEAN, поэтому модуль nodemailer, похоже, имеет смысл использовать.

Я создал конечную точку '/api/contact', на которую принимает запрос POST, и использует данные этого запроса для отправки почты.

У меня тогда есть форма в моем угловом приложении, которое на submit вызывает функцию, которая делает http.

Надеюсь, это звучит правильно. В стороне я использовал генератор углового ползунка Yeoman, поэтому мой код следит за этой структурой.

Когда приложение загружается, хотя в моей консоли я вижу код ошибки 500, а затем, когда я смотрю в журналах, я вижу ошибку при чтении свойств from и body в моем contact.controller.

Вот мой код:

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.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> 

Answer 1

Спасибо, ребята. Пробовал вести консольный журнал и мог видеть, что данные не были переданы, кроме того, конечная точка попала на загрузку страницы, а не на submit.

Решенный путем изменения углового кода для остановки функции, вызываемой немедленно, а затем должен был добавить ответ на пост-вызов и объявление res.end()!

Answer 2

Вам не удалось получить обратный вызов в вашем серверном контроллере. Я переписал часть кода ниже

(сервер/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); 
    } 
    }); 
} 

Затем в угловом контроллере: (клиент/приложение/основной/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 
     }); 
    }; 
    }); 

Вы формируете будет выглядеть следующим образом: (в клиент/приложение/главная/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>