Nodejs，Express + Angular POST 404

Posted 2023-03-07

【中文标题】Nodejs，Express + Angular POST 404

【英文标题】：Nodejs, Express + Angular POST 404

【发布时间】：2016-02-25 23:13:39

【问题描述】：

我正在处理我的 MEAN 堆栈（mysql 不是 MongoDB，而且我也在使用 EJS 模板引擎）应用程序，并且在将数据发布到我的 MySQL 数据库时遇到了问题。正如标题所说，我在控制台中收到“404”错误，我认为这表明找不到 post 方法。如果我将该方法放入服务器文件中，则该帖子确实有效，但我收到一条消息说“无效 json”。

有人知道为什么会这样吗？

我当前的代码如下所示。我是这方面的初学者，所以我非常感谢解释清楚的答案，因为这是了解问题所在的最佳方法。

服务器/应用程序：

> 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')); );

角度控制器：

> 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);
>         )
>      ]);

服务器端帖子（我不知道，但它似乎没有很好地引用我的服务器文件夹）：

>  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>&nbsp;</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>&nbsp;</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>

提前致谢！

【问题讨论】：

那么问题出在哪里？行没有插入？您是否遇到任何错误？

帖子无法正常工作。我收到“404 错误”，（我认为）表明该帖子未被调用。我只是不知道哪里出错了。抱歉解释不好。我已经编辑了我的帖子。

我看到一些错别字，在您的 html 中您有 ng-model="clients.clientName" 通知 clients 和在您的控制器中 console.log($scope.client); 通知 client 和 @ 987654327@你将函数createClient传递给服务器，你想要传递$scope.client但首先在html中改变它，这应该修复I get a message saying 'invalid json'。而且我不确定`app.exports`应该做什么？我认为应该是module.exports

需要一个带有路由的文件使用require('./routes/clientConfig.js')(app);，文件看起来像module.exports = function(app) app.get(...);不需要Router，那么Router显然是有原因的，但你不需要使用它.我展示的是其中一种方式。

感谢@Molda 的指点！我让“发布”功能在我的服务器文件中工作。如何让它在另一个文件夹中工作？我觉得我必须引用该文件中的“应用程序”，以便它知道如何运行“快递”等。我只是不知道如何引用？

【参考方案1】：

要使用另一个文件中的路由，您可以执行以下操作

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'));
...