与mongodb一起使用express,passportjs和angularjs / ngRoute路由的jade渲染问题

时间:2015-10-24 15:44:32

标签: angularjs mongodb express pug passport.js

对此的任何帮助将不胜感激!在过去的一天半里,我一直在努力解决这个问题。

我目前正在处理的问题是在我的ng-view中加载经过身份验证的用户路由,其他所有内容都在其中。

以下图片描述了我的问题。

1. login screen within ng-view

2. successful login routes to new page instead of ng-view

这是我的代码

login.jade

block content
   form(method="POST" action="/")
      div
         label(for="username").
            Username:
         input(type="text" name="username" id="username")
      div
         label(for="password").
            Password:
         input(type="password" name="password" id="password")
      div
         input(type="submit" value="Login")

Jade HTML

doctype html
html(ng-app="myApp")
  head
    title= title

    script(src="/vendor/angular/angular.min.js")
    script(src="/vendor/angular-route/angular-route.min.js")
    script(src="/vendor/angular-material/angular-material.min.js")
    script(src="/vendor/angular-aria/angular-aria.min.js")
    script(src="/vendor/angular-animate/angular-animate.min.js")
    script(src="/javascripts/client.js")
    script(src="/javascripts/AboutController.js")
    script(src="/javascripts/ArchivesController.js")
    script(src="/javascripts/RegisterController.js")

    link(rel='stylesheet', href='/vendor/angular-material/angular-material.min.css')
    link(rel='stylesheet', href='/vendor/font-awesome/css/font-awesome.min.css')
    link(rel='stylesheet', href='/stylesheets/style.css')

    base(href="/")

  body.site
    .container
        nav
            img.logo(src="/images/logo.png")
            ul.nav
                li
                  a(href="/")
                    i.fa.fa-home.fa-3
                li
                  a(href="/archives")
                    i.fa.fa-archive.fa-3
                li
                  a(href="/about")
                    i.fa.fa-info.fa-3
                li
                  a(href="/register")
                    i.fa.fa-folder-open.fa-3

        block content
        div(ng-view)

    block footer
    footer
        div.navigation
          h4 Navigation
        div.links
          h4 Links
        div.github
          h4 Github Feed
        div.twitter
          h4 Twitter Feed

客户端Javascript

var app = angular.module('myApp',['ngRoute']);

app.config(function($routeProvider, $locationProvider){
    $routeProvider
        .when('/about',{
            templateUrl: '/about',
            controller: 'AboutController'
        })
        .when('/archives',{
            templateUrl: '/archives',
            controller: 'ArchivesController'
        })
        .when('/register',{
            templateUrl: '/register',
            controller: 'RegisterController'
        })
        .when('/login',{
            templateUrl: '/login'
        })
        .when('/profile',{
            templateUrl: '/profile',
        });

    $locationProvider.html5Mode(true);
});

路线

var express = require('express');
var router = express.Router();
var passport = require('passport');

/* GET home page. */

//router.get('/:name', function (req, res)
//{ var name = req.params.name;
//    res.render(name);
//});

router.get('/profile', isLoggedIn, function(req, res, next) {
    res.render('profile',{
        user : req.user
    });
});

router.get('/', function(req, res, next) {
  res.render('index', { title: 'Ryan Merchlewitz Home Page' });
});

router.get('/login', function(req, res, next) {
    res.render('login', { title: 'Ryan Merchlewitz Home Page' });
});

router.post('/',
    passport.authenticate('local',{
        successRedirect: '/profile',
        failureRedirect: '/'
    })
);


// route middleware to make sure a user is logged in
function isLoggedIn(req, res, next) {

    // if user is authenticated in the session, carry on
    if (req.isAuthenticated())
        return next();

    // if they aren't redirect them to the home page
    res.redirect('/');
}


module.exports = router;

0 个答案:

没有答案