2017-08-24 4 views
0

私の目標は、ユーザーがボタン送信をクリックしたときにID#username-lと#pwd-lの値をHTMLフォームで使用し、値をSQLデータベース内の値に変換し、その値がデータベース内の値と正確に等しい場合は、指定されたルートにユーザーをルーティングします(今のところ、ユーザーはテスト用に問題ありません)。現在、/にルーティングしていますか?どこにも指定されていないエラーはありません。コンソールは、クエリーがusername = nullとpassword = nullを返すことを示します。 DBには、username = test password =テスト用のシードがあります。どんな助けもありがとう!<Form>を使用して、jQuery、Sequelize、SQLをログインしてルートにする

HTML:

<form id="login-form"> 
         <div class="form-group"> 
         <label for="username-l">Username:</label> 
         <input type="username" class="form-control" id="username-l" placeholder="Enter username"> 
         </div> 
         <div class="form-group"> 
         <label for="pwd-l">Password:</label> 
         <input type="password" class="form-control" id="pwd-l" placeholder="Enter password"> 
         </div> 
         <button id="login-button" type="submit" class="btn btn-default">Login</button> 
        </form> 

SEQUELIZE:

app.get("/api/users", function(req, res) { 

    db.User.findAll({ 
     where: 
     { 
     username: req.body.username, 
     password: req.body.password 
     } 
    }).then(function(dbUser) { 
     // res.json(dbUser); 
     if (req.body.username === dbUser.username && req.body.password === dbUser.password) { 
     res.redirect("/users"); 
     } else { 
     console.log("error"); 
     } 
    }); 
    }); 

LOGIN.JS:、あなたに、できるだけ多くGET要求を、すべての

$("#login-button").on('click', function() { 
    var username = $("#username-l").val().trim(); 
    var password = $("#pwd-l").val().trim(); 

    $.get("/api/users", function(data){ 
     console.log(data); 
     if (username === data.username && username === data.password) { 
      reRoute(); 
     } else { 
      console.log("that does not exist"); 
     } 
    }); 
}); 

function getUser(userData) { 
    $.get("/api/users", userData).then(reRoute()); 
    } 

function reRoute() { 
    window.location.href = "/users"; 
} 

答えて

2

まずやっています私はHTTPを知っている、dosn't体を持っています。 第2に、私はjQueryの専門家でもなく、これまで使ったこともありませんが、Google searchは2番目のパラメータがクエリ文字列として渡されたことを示しています。これはGETが動作する方法です。送信するデータがある場合は、リクエスト本文ではなくクエリ文字列で送信します。

そのため、クエリ文字列ではなく本文からusernamepasswordを読み取るサーバーサイドコードの問題があります。だから、仕事に、このためには、あなたは(私はあなたがExpressを使用している推測している)、このようなクエリからユーザー名とパスワードを抽出する必要があります。

app.get("/api/users", function(req, res) { 
    const username = req.query.username; 
    const password = req.query.password; 
    // do the rest of the stuff with Sequelize and bussiness logic here 
    }); 

を追記上では、完全なルータのコールバックは、いくつかを持っていますユーザー名とパスワードがDBから取得したものと一致するかどうかの重複チェックのような悪いもの。すでにSequelizeに、DBからユーザ名とパスワードがフロントエンドから受け取った行を取得するよう依頼しています。そのため、インスタンスのユーザ名とパスワードが一致しているかどうかを確認する必要はありません。あなたが行うことは、インスタンスがnullであるかどうかを確認する必要があります。これは、そのユーザー名とパスワードを持つユーザーがDBにないことを意味するためです。だから、「固定」のコードは次のようになります。

app.get("/api/users", function(req, res) { 
    const username = req.query.username; 
    const password = req.query.password; 

    db.User.findAll({ 
    where: { 
     username, 
     password 
    } 
    }).then(function(dbUser) { 
    // res.json(dbUser); 
    if (dbUser != null) { 
     res.redirect("/users"); 
    } else { 
     // you'd maybe like to set response status to 404 
     // also some user friendly error message could be good as response body 
     console.log("Error: user not found"); 
    } 
    }); 
}); 

私はあなたの流れのアイデアを取得し、どこ間違いだった願っています。

+1

ご説明いただきありがとうございます。非常に明確で有用です。私は、私が間違いや冗長をどこにしているかを見て理解しています。乾杯! – willking

+0

問題を修正しましたか? – Pritilender

+0

今日のコードを変更し、できるだけ早く確認します – willking

関連する問題