Nodejs,Express + Angular POST 404
Nodejs, Express + Angular POST 404
我正在开发我的 MEAN 堆栈(mySQL 而不是 MongoDB,我也在使用 EJS 模板引擎)应用程序,我 运行 遇到了 [=44] 的问题=] 将数据写入我的 MySQL 数据库。正如标题所说,我在控制台中收到“404”错误,我认为这表明无法找到 post 方法。如果我将方法放入服务器文件中,post 确实有效,但我收到一条消息说 'invalid json'.
有人知道为什么会这样吗?
我目前的代码如下。我是这方面的初学者,所以我非常感谢解释清楚的答案,因为这是了解哪里出了问题的最好方法。
Server/app:
> var express = require('express'); var path = require('path'); //var
> favicon = require('serve-favicon'); var logger = require('morgan');
> var cookieParser = require('cookie-parser'); var bodyParser =
> require('body-parser'); var http = require('http');
>
> var mysql = require('mysql');
>
> var app = express();
>
> var port = 1337;
>
> // view engine setup app.set('views', path.join(__dirname, 'views'));
> app.set('view engine', 'ejs');
>
> // uncomment after placing your favicon in /public
> //app.use(favicon(__dirname + '/public/favicon.ico'));
> app.use(logger('dev')); app.use(bodyParser.json());
> app.use(bodyParser.urlencoded({ extended: false }));
> app.use(cookieParser());
> app.use(require('stylus').middleware(path.join(__dirname, 'public')));
> app.use(express.static(path.join(__dirname, 'public')));
> app.use('/bower_components', express.static(__dirname +
> '/bower_components'));
>
> var clientRoute = require('./routes/clientConfig.js');
>
> new clientRoute(app);
>
> app.use(require('./server/Dao/clientDao.js'));
>
> module.exports = app;
>
> app.set('port', process.env.PORT || 1337);
> http.createServer(app).listen(app.get('port'), function () {
> console.log('Express server listening on port ' + app.get('port')); });
Angular 控制器:
> var clientModule = angular.module('clientModule', []);
>
> clientModule.controller('clientController', ['$scope', '$http',
> function ($scope, $http) {
> console.log("Hello world from controller");
>
> $scope.addClient = function () {
> console.log($scope.client);
>
> $http.post('/createClient', $scope.client).success(function(response) {
> console.log(response);
> })
> } }]);
Server-side post(我不知道,但它似乎没有很好地引用我的服务器文件夹):
> var express = require('express'); var router = express.Router(); var
> connectionProvider = require('../mysqlConnectionStringProvider.js');
>
> router.post('/createClient', function (req, res) {
> console.log(req.body);
>
> var connection = connectionProvider.mysqlConnectionStringProvider.getMySqlConnection();
>
> var insertStatement = "INSERT INTO Clients SET?"
>
> var client = {
> clientName : req.body.client.clientName, // this should be req.body.client.clientName
> clientAddress : req.body.client.clientAddress // this should be req.body.client.clientAddress
> }
>
>
> if (connection) {
> connection.query(insertStatement, client, function (err, result) {
>
> if (err) {
> console.log(err);
> }
>
> //console.log(result);
> });
> }
> connectionProvider.mysqlConnectionStringProvider.closeMySqlConnection(connection);
> });
>
> router.get('/createClient', function (req, res) {
>
> res.render('clients/createClient.ejs', {title : 'Add client'}); })
>
> module.exports = router;
Html:
<% include ../layout %>
<div class="container" ng-app="clientModule" ng-controller="clientController">
<form class="navbar-form navbar-left" action="/createClient" method="post" name="formClient">
<div class="row">
<div class="form-group">
<label for="">Client name</label>
<input type="text" class="form-control" placeholder="Please enter client name" name="clientName" ng-model="client.clientName" style="width: 100%" required>
</div>
</div>
<div> </div>
<div class="row">
<div class="form-group">
<label for="">Client address</label>
<input type="text" class="form-control" placeholder="Please enter client address" name="clientName" ng-model="client.clientAddress" style="width: 100%" required>
<p>{{client.clientAddress}}</p>
</div>
</div>
<div> </div>
<div class="row">
<div class="form-group">
<button class="btn btn-primary" ng-click="addClient()">Create client</button>
</div>
</div>
</form>
</div>
<script src="./controllers/clients/clientController.js"></script>
提前致谢!
要使用来自另一个文件的路由,您可以执行以下操作
routes/clientConfig.js
var express = require('express');
var router = express.Router();
router.get(...);
router.post(...);
router.put(...);
module.exports = router;
server.js
...
app.use(require('./routes/clientConfig.js'));
...
我正在开发我的 MEAN 堆栈(mySQL 而不是 MongoDB,我也在使用 EJS 模板引擎)应用程序,我 运行 遇到了 [=44] 的问题=] 将数据写入我的 MySQL 数据库。正如标题所说,我在控制台中收到“404”错误,我认为这表明无法找到 post 方法。如果我将方法放入服务器文件中,post 确实有效,但我收到一条消息说 'invalid json'.
有人知道为什么会这样吗?
我目前的代码如下。我是这方面的初学者,所以我非常感谢解释清楚的答案,因为这是了解哪里出了问题的最好方法。
Server/app:
> var express = require('express'); var path = require('path'); //var
> favicon = require('serve-favicon'); var logger = require('morgan');
> var cookieParser = require('cookie-parser'); var bodyParser =
> require('body-parser'); var http = require('http');
>
> var mysql = require('mysql');
>
> var app = express();
>
> var port = 1337;
>
> // view engine setup app.set('views', path.join(__dirname, 'views'));
> app.set('view engine', 'ejs');
>
> // uncomment after placing your favicon in /public
> //app.use(favicon(__dirname + '/public/favicon.ico'));
> app.use(logger('dev')); app.use(bodyParser.json());
> app.use(bodyParser.urlencoded({ extended: false }));
> app.use(cookieParser());
> app.use(require('stylus').middleware(path.join(__dirname, 'public')));
> app.use(express.static(path.join(__dirname, 'public')));
> app.use('/bower_components', express.static(__dirname +
> '/bower_components'));
>
> var clientRoute = require('./routes/clientConfig.js');
>
> new clientRoute(app);
>
> app.use(require('./server/Dao/clientDao.js'));
>
> module.exports = app;
>
> app.set('port', process.env.PORT || 1337);
> http.createServer(app).listen(app.get('port'), function () {
> console.log('Express server listening on port ' + app.get('port')); });
Angular 控制器:
> var clientModule = angular.module('clientModule', []);
>
> clientModule.controller('clientController', ['$scope', '$http',
> function ($scope, $http) {
> console.log("Hello world from controller");
>
> $scope.addClient = function () {
> console.log($scope.client);
>
> $http.post('/createClient', $scope.client).success(function(response) {
> console.log(response);
> })
> } }]);
Server-side post(我不知道,但它似乎没有很好地引用我的服务器文件夹):
> var express = require('express'); var router = express.Router(); var
> connectionProvider = require('../mysqlConnectionStringProvider.js');
>
> router.post('/createClient', function (req, res) {
> console.log(req.body);
>
> var connection = connectionProvider.mysqlConnectionStringProvider.getMySqlConnection();
>
> var insertStatement = "INSERT INTO Clients SET?"
>
> var client = {
> clientName : req.body.client.clientName, // this should be req.body.client.clientName
> clientAddress : req.body.client.clientAddress // this should be req.body.client.clientAddress
> }
>
>
> if (connection) {
> connection.query(insertStatement, client, function (err, result) {
>
> if (err) {
> console.log(err);
> }
>
> //console.log(result);
> });
> }
> connectionProvider.mysqlConnectionStringProvider.closeMySqlConnection(connection);
> });
>
> router.get('/createClient', function (req, res) {
>
> res.render('clients/createClient.ejs', {title : 'Add client'}); })
>
> module.exports = router;
Html:
<% include ../layout %>
<div class="container" ng-app="clientModule" ng-controller="clientController">
<form class="navbar-form navbar-left" action="/createClient" method="post" name="formClient">
<div class="row">
<div class="form-group">
<label for="">Client name</label>
<input type="text" class="form-control" placeholder="Please enter client name" name="clientName" ng-model="client.clientName" style="width: 100%" required>
</div>
</div>
<div> </div>
<div class="row">
<div class="form-group">
<label for="">Client address</label>
<input type="text" class="form-control" placeholder="Please enter client address" name="clientName" ng-model="client.clientAddress" style="width: 100%" required>
<p>{{client.clientAddress}}</p>
</div>
</div>
<div> </div>
<div class="row">
<div class="form-group">
<button class="btn btn-primary" ng-click="addClient()">Create client</button>
</div>
</div>
</form>
</div>
<script src="./controllers/clients/clientController.js"></script>
提前致谢!
要使用来自另一个文件的路由,您可以执行以下操作
routes/clientConfig.js
var express = require('express');
var router = express.Router();
router.get(...);
router.post(...);
router.put(...);
module.exports = router;
server.js
...
app.use(require('./routes/clientConfig.js'));
...