2017-08-17 12 views
0

私は最終的にノードにログインページを作ろうとしています。ある人が別の場所に移動しようとすると、ログインページにルーティングされます。Node.JSから認証されたログインを作成するにはどうすればよいですか?

"/ login /"へのリダイレクトとして "/"を使用しています。 "/ login /"には、ユーザー名/パスワードを入力するフォームが含まれています。情報に入力すると、「/」に戻ります。

いくつかの問題が発生します。元のURLが "/"で、人が "/ login /"に行くとリダイレクトするコードを除外すると、フォームに記入してリダイレクトすることができます。

リダイレクトされたコードを保持すると、リダイレクトのためにログインページに自動的にリダイレクトされ、ログインページにリロードされます。私が抜け出せない奇妙なループです。私はちょうど "/ login /"に別の終わりを置くことができるが、それを "/"にしたいと思う。

リダイレクトループの修正に関するアイデアはありますか?編集:だから私は問題が何であるか知っている。私は比較のために(セッションを使用していない)保存していません。最高のミドルウェアをセッションでチェックするための手掛かりはありますか?

認証を追加したり、ユーザー名/パスワードをデータ構造に追加することはどうですか?

以下

私が思い付くしたコードです:

const express = require("express"); //Express 
const path = require ("path"); 
const session = require("express-session"); //Express Session 
const app = express(); 
const mustache = require ("mustache"); 
const mustacheExpress = require('mustache-express'); 
const bodyParser = require ("body-parser"); 

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

app.engine('mustache', mustacheExpress()); 
app.set('views', './views') 
app.set('view engine', 'mustache') 

app.use(session({ 
    secret: 'keyboard cat', 
    resave: false, 
    saveUninitialized: false, 
    cookie:{} 
})); 

app.use((req, res, next) => { 
    if (req.originalUrl === '/') { 
    res.redirect("/login/"); 
    } 
    next(); 
}); 


const list = [ 
    { 
    username: "", 
    password: "", 
    } 
]; 

const data = { 
    users:list 
}; 

app.get('/login/', function (req, res) { 
    res.render("users", data); 
}); 


app.post("/", function(req, res){ 
    console.log(req.body); 
    let username = req.body.username; 
    let password = req.body.password; 
    let response = `Here are your credentials for the site: <br/> 
    This is your username: ${username} <br/> 
    This is your password: ${password} <br/> 
    <img src="http://media1.giphy.com/media/c54YHGDH63jJC/giphy.gif"/>` 
    res.send(response); 
}); 

app.post("/", function (req, res) { 
    console.log(list); 
    list.push({username:req.body.username}); 
    list.push({username:req.body.password}); 
    res.redirect('/'); 
}) 

app.listen(3000, function() { 
    console.log('Creating login page'); 
}) 

答えて

0

たびに、ユーザは、それらが/ログインにリダイレクトされたルート(/)をヒットし、成功したログインが戻っルートにそれらをリダイレクトする場合、私はあなたが意識していると思うルーティングループを明確に持っています。

最も簡単な解決策は、ログイン成功時にユーザーを誘導する新しいルート(例:/ home)を確立することです。私は2つの可能性を提供するようにあなたが返信を送り返しているのを見ます。また、不要な同じPOSTルートに対して2つのハンドラがあります。私が提案するものは次のとおりです:

app.post("/login", function(req, res){ 
    console.log(req.body); 

    let username = req.body.username; 
    let password = req.body.password; 

    let response = `Here are your credentials for the site: <br/> 
     This is your username: ${username} <br/> 
     This is your password: ${password} <br/> 
     <img src="http://media1.giphy.com/media/c54YHGDH63jJC/giphy.gif"/>`; 

    // actions from duplicate route handler 
    console.log(list); 

    list.push({username:req.body.username}); 
    list.push({username:req.body.password}); 

    // this is assuming you are handling errors on the front end 
    res.status(201).send(response); 

}); 

私はあなたのapiからの成功応答に応じて、フロントエンドでjavascriptを使用してルートを変更します。

window.location.assign(urlToNewRoute); 

代わりに、クエリ文字列として応答でリダイレクトを送信し、その後、むしろres.status(201).send(応答)を送信するよりも、フロントエンドでこれを解析することができます。

res.redirect(`/home?message=${response}`); 

どのようにしてapiとフロントエンドサイトを設計するかはあなた次第です。これらはほんの数種類のオプションです。現実的には、POSTルートでエラー処理を行って、ユーザーが存在するかどうか、正しいパスワードなどを入力した後、201,400,404などの簡潔なステータスを送り返す必要があります。終わり。

これが役に立ちます。

0

あなたはそうです。セッション情報を入力して/login/から/にリダイレクトする必要があります。それを行う最も簡単な方法は、コントローラが検証できるトークンを返すことです。有効でない場合は/login/にリダイレクトすることができます。トークンにはJWTを使用できます。

関連する問題