JWH_
JWH_

Reputation: 267

Nodejs Express redirecting does not work

I'm currently trying to redirect a user to a success screen after he click the login button. Everything seems to be working fine but the page does not change. Tried searching online but none of the solution helped.

Update It seems that the root cause is because of '/' in routes. Changed it to '/home' and it works now

Solved

Below is my html, server and route codes

index.html

<!DOCTYPE html>
 <html>
  <head>

   <script 
    src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js">
   </script>
   <link rel="stylesheet" 
href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
   <link rel="stylesheet" type="text/css" href="../public/css/style.css">

  </head>
<body>
 <div ng-app="myApp" ng-controller="loginController">
  <div class="container">
  <br>
  <br>
  <br>
  <br>
  <h1 class="welcome text-center" style="text-align:center;">Welcome</h1>

    <div class="card card-container">
    <!--
    <h2 class='login_title text-center'>Login</h2>
    -->
    <hr>

        <form class="form-signin">

            <p class="input_title">Username:</p>
            <input type="text" id="inputEmail" class="login_box" ng-model="username" required autofocus>
            <p class="input_title">Password</p>
            <input type="password" id="inputPassword" class="login_box" ng-model="password" required>
         <br>
         <br>
            <button class="btn btn-lg btn-primary" type="submit" ng-click="sub()">Login</button>
        </form><!-- /form -->
    </div><!-- /card-container -->
  </div><!-- /container -->

 </div>

  <script>
  var app = angular.module('myApp', []);

  app.controller("loginController", function($scope,$http) {

  $scope.sub = function() {

    var data = {
        username: $scope.username,
        password: $scope.password

    }

     var config = {
            headers : {
                'Content-Type': 'application/x-www-form-
  urlencoded;charset=utf-8;'
            }
        }


    $http.post('/login', data, config)
.then(
   function(response){
     console.log('action on success');
   }, 
   function(response){
           console.log('action on error');
   }
);

}

});

</script>
</body>
</html>

server.js

var express = require('express');
var bodyParser = require('body-parser');
var morgan = require('morgan');
var config = require('./config');


var app = express();

app.use(bodyParser.urlencoded({extended:true}));
app.use(bodyParser.json());
app.use(morgan('dev'));


app.use(express.static(__dirname + '/app'));
require('./app/routes')(app);


app.listen(3000,function(err){

if(err){

console.log(err);
}
else{

console.log("Listening on port 3000");
}

});

route.js

module.exports = function (app) {


app.get('/',function(req,res){

res.sendFile(__dirname + '/views/index.html');


});

app.post('/login', function(req, res){
console.log("post here!");
res.setHeader("Content-Type", "text/html")
res.sendFile(__dirname + '/views/success.html');
//res.redirect(__dirname + '/app/views/success.html');
res.end;

});

cmd response

Upvotes: 0

Views: 268

Answers (1)

ROHIT CHAUHAN
ROHIT CHAUHAN

Reputation: 148

Here are my suggestions,

  • If you are trying to redirect in routes files then use:

    return res.redirect('your url'); 
    
  • If you are trying to redirect in ajax files then use:

    window.location.href = 'your url';
    

Upvotes: 1

Related Questions