2017-09-13 50 views
0

我沒有使用Node/Express一年以上,所以我有點生疏。我遵循許多其他示例來設置Angular表單以發送/ POST請求,然後使用nodemailer sendMail()方法。當我點擊提交表單時,沒有任何反應,但Angular控制器得到200響應。角度與Nodemailer應用程序和路徑不鏈接表單上提交/ POST

server.js:

var express = require('express'); 
var app = express(); 
var port = 9000; 
var apiRoutes = require('./app/routes.js'); 
var nodemailer = require('nodemailer'); 
var fs = require('fs'); 
var bodyParser = require('body-parser'); 
var safeKey = JSON.parse(fs.readFileSync('./safekey.json', 'utf-8')); 

var transporter = nodemailer.createTransport({ 
    service: 'Gmail', 
    auth: { 
     user: safeKey.emailUser + '@gmail.com', 
     pass: safeKey.emailPass 
    } 
}); 

// set up our express application 
app.use(express.static(__dirname + '/public/')); 
app.use('/node_modules', express.static(__dirname + '/node_modules/')); 
app.use('/scripts', express.static(__dirname + '/public/scripts/')); 
app.use('/css', express.static(__dirname + '/public/css/')); 
app.use('/html', express.static(__dirname + '/public/html')); 
app.use('/img', express.static(__dirname + '/public/img')); 
app.use('/fonts', express.static(__dirname + '/public/fonts')); 
app.use(bodyParser.urlencoded({ extended: true })); 
app.use(bodyParser.json()); 

app.all('/*', function (req, res, next) { 
    // Just send the index.html for other files to support HTML5Mode 
    res.sendFile('index.html', { root: __dirname + '/public/html' }); 
}); 

app.use('/', apiRoutes); 

app.post('/contact', function (req, res) { 
    console.log('hi, inside POST of /api/sendcontact'); 
    var data = req.body; 

    var mailOptions = { 
     from: data.email, 
     to: '[email protected]', 
     subject: '[LITSCO CONTACT FORM] Email sent by ' + data.name, 
     text: data.message 
    }; 

    transporter.sendMail(mailOptions, function (error, info) { 
     if (error) { 
      console.log(error); 
      res.json({ error: 'Email not sent' }); 
     } else { 
      console.log('Message sent: ' + info.response); 
      console.log('Data:' + data.contactName); 
      res.json({ success: 'Email has been sent.' }); 
     } 
    }); 
}); 

app.listen(port); 
console.log('Up and running on Port: ' + port); 

我決定不包括在我的router.js文件後。

角控制器:

$scope.contactData = { 
     phone: '', 
     email: '', 
     name: '', 
     company: '', 
     message: '' 
    }; 
    $scope.postData = {}; 
$scope.postMail = function (contact) { 
      // wrap all your input values in $scope.postData 
      $scope.postData = angular.copy(contact); 

      var req = { 
       method: 'POST', 
       url: '/contact', 
       headers: { 
        'Access-Control-Allow-Headers': 'Origin, X-Requested-With, Content-Type, Accept' 
       }, 
       data: $scope.postData 
      }; 

      $http(req) 
       .then(function successCallback(response) { 
        console.log('success'); 
        //do something after success 
        // this callback will be called asynchronously 
        // when the response is available 
       }, function errorCallback(response) { 
        console.log('error'); 
        //do something after error 
        // called asynchronously if an error occurs 
        // or server returns response with an error status. 
       }); 
     }; 

HTML

<form class="col s12" ng-submit="postMail(contactData)"> 
        <div class="row"> 
         <div class="input-field col s12 m6"> 
          <input id="icon_prefix" type="text" ng-model="contactData.name"> 
         </div> 
         <div class="input-field col s12 m6"> 
          <input id="icon_telephone" type="tel" class="validate" ng-model="contactData.phone"> 
         </div> 
         <div class="input-field col s12 m6"> 
          <input id="icon_email" type="email" class="validate" ng-model="contactData.email"> 
         </div> 
         <div class="input-field col s12 m6"> 
          <input id="icon_business" type="tel" ng-model="contactData.company"> 
         </div> 
        </div> 
        <div class="row"> 
         <div class="input-field col s12"> 
          <textarea id="textarea1" class="materialize-textarea" ng-model="contactData.message"></textarea> 
         </div> 
        </div> 
        <div class="row right"> 
         <button class="btn waves-effect waves-light" type="submit" name="action">Submit 
         </button> 
        </div> 
       </form> 
+0

嘗試使用郵遞員來測試你的服務器端點,以這種方式您可以確定這是否是前端問題或後端問題。由於您沒有發佈所有的服務器端代碼,因此有幾件事需要檢查。 1.您已經定義並啓動了您的http服務器; 2.確保你的server.js中已經導出了app模塊 – spiritwalker

+0

@spiritwalker我已經更新了server.js代碼 - 這是我的整個server.js文件 –

+0

是你的app.all(「/ *」...抓住你的可能是POST請求了嗎?試試把它改成GET請求吧。 – Rnice4christ

回答

0

每@ Rnice4christ的app.all("/*".)被重寫後,所以更改爲app.get解決