AngularJS POST页面404找不到错误

时间:2017-11-28 21:06:36

标签: javascript angularjs node.js express

我正在尝试从我的网络应用程序联系页面发送电子邮件。

我在前端使用AngularJS,在服务器端使用node.js。

我在本地机器上运行它。

我相信我使用了错误的url作为控制器http.post方法,但我不知道该使用什么。运行Web应用程序时的URL是:http://localhost:63342/Hardcore%20Gaming%20JS/index.html#/contact

我想将硬核%20Gaming%20JS / index.html#添加到网址或其中的一些变体?我试图将其包含在网址中,但它没有解决问题。

  

客户端错误:POST http://localhost:63342/contact 404(未找到)

我的控制器代码:

mainApp.controller('controller_contact', ['$scope', 'MyService', '$http', function ($scope, MyService, $http) {
        $scope.formInput = {
            name: "",
            email: "",
            message: ""
        };

        $scope.submitForm = function (isValid) {
            $scope.formInput = {
                name: $scope.formInput.name,
                email: $scope.formInput.email,
                message: $scope.formInput.message
            };

            if (isValid) {
                console.log($scope.formInput);
                $http.defaults.headers.post["Content-Type"] = "application/x-www-form-urlencoded";
                $http.post('/contact', $scope.formInput)
                    .success(function (data) {
                        console.log("Success!" + data);
                    })
                    .error(function (data) {
                        console.log('Error: ' + data);
                    });

                console.log('Message sent successfully');
            }
        }

    }])

这是我的服务器(Node.js):

// server.js

// set up =============================
var express = require('express');
var app = express();
var mongoose = require('mongoose');
var morgan = require('morgan');
var bodyParser = require('body-parser');
var methodOverride = require('method-override');
var port = process.env.PORT || 8080;

// configurations =====================
mongoose.connect('mongodb://localhost/');

app.use(express.static(__dirname + '/Hardcore Gaming JS'));
app.use(morgan('dev'));
app.use(bodyParser.urlencoded({'extended': 'true'}));
app.use(bodyParser.json());
app.use(bodyParser.json({type: 'application/vnd.api+json'}));
app.use(methodOverride());

// routes ==================================

// api ----------------------------------
app.post('/contact', function (req, res) {
    console.log("Req: " + req);
    // serverside email code goes here.
    console.log("Res: " + res);
});

// listen (start app with node server.js)
app.listen(port);
console.log("App listening on port " + port);

这是我的HTML:

<div class="container" ng-controller="controller_contact">

    <h2>Contact Us</h2>

    <form class="contactForm" name="form_contact" ng-controller="controller_contact"
          ng-submit="submitForm(form_contact.$valid)" novalidate>

        <div class="form-group">
            <label for="contact_form_name">Name</label>
            <input id="contact_form_name" type="text" name="name" ng-model="formInput.name" placeholder="Full name"
                   required>
        </div>

        <div class="form-group">
            <label for="contact_form_email">Email</label>
            <input id="contact_form_email" type="email" name="email" ng-model="formInput.email"
                   placeholder="Email address"
                   required>
        </div>

        <div class="form-group">
            <label for="contact_form_message">How can we help you?</label>
            <textarea id="contact_form_message" name="message" rows="4" ng-model="formInput.message"
                      placeholder="Type message here." required></textarea>
        </div>

        <input type="submit" value="Send" ng-disabled="form_contact.$invalid"/>

    </form>
    <br>
</div>

0 个答案:

没有答案