每個人。我正在製作我的第一個Node + Express + Angular應用程序。如何在不破壞NodeMailer的情況下在Express中啓用HTML5模式?
我有點用https://github.com/codeschool/StayingSharpWithAngularSTB作爲鍋爐板。
總體佈局是
[文件夾]應用
--------- [副文件夾]資產(Java腳本,CSS,圖像等)
------ --- [子文件夾]頁面(這包含ng-view的東西)
--------- [子文件夾]視圖
-------------- ------ index.html(這是容納所有東西的主要index.html)
[folder] node_modules
[文件夾]服務器
--------- [子文件夾]控制器
---------------------- core.server.controller。 JS
--------- expressConfig.js
--------- routes.js
app.js
的package.json
因此,這裏是我的服務器配置文件:
app.js
var app = require("./server/routes");
// Start the server
var port = process.env.PORT || 8000;
app.listen(port, function(){
console.log('Listening on port ' + port);
});
個/server/expressConfig.js
var bodyParser = require('body-parser');
module.exports = function(app, express) {
// Serve static assets from the app folder. This enables things like javascript
// and stylesheets to be loaded as expected. You would normally use something like
// nginx for this, but this makes for a simpler demo app to just let express do it.
app.use("/", express.static("app/"));
// Set the view directory, this enables us to use the .render method inside routes
app.set('views', __dirname + '/../app/views');
// parse application/x-www-form-urlencoded
app.use(bodyParser.urlencoded({ extended: false }));
// parse application/json
app.use(bodyParser.json());
};
/server/routes.js
var express = require('express');
var app = express();
var core = require('./controllers/core.server.controller')
// Load Express Configuration
require('./expressConfig')(app, express);
// Root route
app.get('/', function(req, res){
res.sendfile('index.html', {root: app.settings.views});
});
// routes for sending forms
app.route('/contact-form').post(core.sendMail);
app.route('/table-form').post(core.sendTableRes);
app.route('/artist-form').post(core.sendArtistRes);
module.exports = app;
/server/controllers/core.server.controller.js
var nodemailer = require('nodemailer');
var transporter = nodemailer.createTransport({
service: 'gmail',
auth: {
user: //my gmail,
pass: //my gmail password
}
});
// Send an email when the volunteer form is submitted
exports.sendMail = function (req, res){
var data = req.body;
transporter.sendMail({
from: //my gmail,
to: //another gmail,
subject: data.volunteerName+ ' wants to volunteer for our event 2016',
text: 'Volunteer Info \n Name : '+data.volunteerName+'\n Phone Number : '
+data.volunteerNum+'\n E-mail : ' +data.volunteerEmail
});
res.json(data);
};
// Other similar mailing functions
而這裏的一發送郵件的角度控制器
volunteerFormController.js
angular.module('MyApp').controller('FormController', function($http){
this.volunteer = {
};
this.addVolunteer = function(){
var data = ({
volunteerName : this.volunteer.name,
volunteerEmail : this.volunteer.email,
volunteerNum : this.volunteer.phone
});
$http.post('/contact-form', data).
then(function(response) {
//show thank you message with animate.css classes and hide form
$(".thanksFriend").addClass("animated tada showBlock");
$("form").addClass("flipOutX animated hideBlock");
}, function(response) {
$(".sorryFriend").addClass("animated tada showBlock");
});
};
});
這工作得很好!但是,如果我在Angular中啓用html5模式並在Express中使用
app.use(function(req, res){
res.sendfile('index.html', {root: app.settings.views});
});
在routes.js文件中,Html 5模式很有用沒有404s當我刪除磅和刷新,但沒有我的接觸形式的工作,並沒有給我任何錯誤控制檯...我的服務器文件是非常小的,它不是非常複雜,所以它應該很容易弄清楚如何同時使用HTML5模式和工作聯繫表單。有任何想法嗎?我對Express並不瞭解,我使用教程http://www.bossable.com/1910/angularjs-nodemailer-contact-form/來了解如何使用nodemailer。有沒有另外一種方法來設置nodemailer,這樣可以工作?
我真的很感激一些幫助與此有關。這讓我非常瘋狂; __;
我想你需要app.get改變'( '/',''到app.get( '/ *',' – YOU
@YOU哦,我的上帝!感謝永遠的。這工作!我不知道它爲什麼工作,但它做到了! – StephanieQ
因爲在SPA中,你服務的一切index.html – YOU