如何在不破坏 NodeMailer 的情况下在 Express 中启用 HTML5 模式?
How to enable HTML5 mode in Express without breaking NodeMailer?
各位。我正在制作我的第一个 Node + Express + Angular 应用程序。
我有点用 https://github.com/codeschool/StayingSharpWithAngularSTB 作为样板。
大体布局为
[文件夹] 应用
-------- [子文件夹] 资产(Javascript、css、图像等)
---------- [子文件夹] 页面(包含 ng-view 内容)
-------- [子文件夹] 浏览量
------------------ index.html(这是主要的 index.html 将所有内容组合在一起)
[文件夹]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
这是发送邮件的 angular 控制器之一
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文件中,Html5模式效果很好!当我删除英镑并刷新时没有 404,但是我的联系表单的 none 工作,并且控制台没有给我任何错误......我的服务器文件非常小而且不是很复杂所以它应该很容易弄清楚如何同时拥有 HTML5 模式和工作联系表。有任何想法吗?我对 Express 了解不多,我使用教程 http://www.bossable.com/1910/angularjs-nodemailer-contact-form/ 了解如何使用 nodemailer。是否有另一种设置 nodemailer 的方法,这样就可以了?
我非常感谢对此的一些帮助。这让我发疯了;__;
因此,您必须满足每个请求 return index.html,
通过将 app.get('/',
更改为 app.get('/*',
各位。我正在制作我的第一个 Node + Express + Angular 应用程序。
我有点用 https://github.com/codeschool/StayingSharpWithAngularSTB 作为样板。
大体布局为
[文件夹] 应用
-------- [子文件夹] 资产(Javascript、css、图像等)
---------- [子文件夹] 页面(包含 ng-view 内容)
-------- [子文件夹] 浏览量
------------------ index.html(这是主要的 index.html 将所有内容组合在一起)
[文件夹]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
这是发送邮件的 angular 控制器之一
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文件中,Html5模式效果很好!当我删除英镑并刷新时没有 404,但是我的联系表单的 none 工作,并且控制台没有给我任何错误......我的服务器文件非常小而且不是很复杂所以它应该很容易弄清楚如何同时拥有 HTML5 模式和工作联系表。有任何想法吗?我对 Express 了解不多,我使用教程 http://www.bossable.com/1910/angularjs-nodemailer-contact-form/ 了解如何使用 nodemailer。是否有另一种设置 nodemailer 的方法,这样就可以了?
我非常感谢对此的一些帮助。这让我发疯了;__;
因此,您必须满足每个请求 return index.html,
通过将 app.get('/',
更改为 app.get('/*',