ログインのためにサーバーにリクエストを送信するにはどうすればいいですか

JavaScript、jQueryの初心者です。ログインのためにサーバーにリクエストを送信するにはどうすればいいですか

私の質問です：私はと呼ばれるサーバーを持っている：http://server.address:port/login次のパラメータ

にユーザー名
パスワード

成功した場合を使用して、サーバは、このようなJSONオブジェクトを送り返します：

{ 
"username" : "name of the user" 
"token": "tokenfromserverobject" 
}

関連するコードを内部に書きたいと思っています。

タグです。

上記のようにPOSTメソッドを使用してログインを送信し、サーバーの応答から取得するにはどうすればよいですか？

<!DOCTYPE html> 
 
<html lang="en" xmlns="http://www.w3.org/1999/html"> 
 
<head> 
 
    <meta charset="UTF-8"> 
 
    <title>Login Page</title> 
 
    <meta name="author" content="Anonymous"> 
 
    <link href="bootstrap.css" rel="stylesheet"> 
 
    <link href="bootstrap-grid.css" rel="stylesheet"> 
 
    <link href="bootstrap-reboot.css" rel="stylesheet" > 
 
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5"/css/bootstrap.min.css> 
 
    <link href="bootstrap.min.css" rel="stylesheet"> 
 
    <link href="bootstrap-reboot.min.css" rel="stylesheet"> 
 
    <link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css" rel="stylesheet"> 
 
    <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.2/html5shiv.js"></script> 
 
    <script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script> 
 
    <link rel="stylesheet" type="text/css" href="style.css"> 
 
    <link rel="stylesheet" type="text/css" href="bootstrap.css"> 
 
    <link rel="stylesheet" type="text/css" href="bootstrap.min.css"> 
 
    <link rel="stylesheet" type="text/css" href="bootstrap-reboot.min.css"> 
 
    <!-- Latest compiled and minified CSS --> 
 
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> 
 

 
    <!-- Optional theme --> 
 
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous"> 
 

 
    <!-- Latest compiled and minified JavaScript --> 
 
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script> 
 
    <script src="jquery-1.10.2.min.js"></script> 
 
    <script type="text/javascript"> 
 

 
    </script> 
 

 

 
</head> 
 
<body background="login-background.jpg"> 
 
<div class="container"> 
 
    <div class="card card-container"> 
 
     <img id="profile-img" class="profile-img-card" src="user.png" /> 
 
     <p id="profile-name" class="profile-name-card"></p> 
 
     <form class="form-signin"> 
 
      <span id="reauth-email" class="reauth-email"></span> 
 
      <input type="text" id="inputEmail" class="form-control" placeholder="Username" required autofocus> 
 
      <input type="password" id="inputPassword" class="form-control" placeholder="Password" required> 
 
      <div id="remember" class="checkbox"> 
 
       <label> 
 
        <input type="checkbox" value="remember-me"> Remember me 
 
       </label> 
 
      </div> 
 
      <button class="btn btn-lg btn-primary btn-block btn-signin" type="submit" id="sendauth">Sign in</button> 
 
     </form><!-- /form --> 
 
     <a href="#" class="forgot-password"> 
 
      Forgot the password? 
 
     </a> 
 
     <hr> 
 
     <img src="unnamed.png"> 
 
     <ul id="ulResponses"/> 
 
    </div><!-- /card-container --> 
 
</div><!-- /container --> 
 

 
</body> 
 
</html>

出典

2017-04-02 Lucas

Ajaxで試してみてください：

$.ajax({ 
    type: 'POST', 
    url: 'http://server.address:port/login', 
    data: { 
     'Username': 'yourUserName', 
     'Password': 'yourPass' 
    }, 
    success: function(msg){ 
     alert(msg); 
    } 
});

出典

2017-04-02 21:08:57 5ka

ログインのためにサーバーにリクエストを送信するにはどうすればいいですか

答えて

関連する問題