質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
AWS(Amazon Web Services)

Amazon Web Services (AWS)は、仮想空間を機軸とした、クラスター状のコンピュータ・ネットワーク・データベース・ストーレッジ・サポートツールをAWSというインフラから提供する商用サービスです。

Q&A

解決済

1回答

620閲覧

AWSのCognito認証で画面サインインをする

takaahii

総合スコア7

AWS(Amazon Web Services)

Amazon Web Services (AWS)は、仮想空間を機軸とした、クラスター状のコンピュータ・ネットワーク・データベース・ストーレッジ・サポートツールをAWSというインフラから提供する商用サービスです。

0グッド

0クリップ

投稿2019/04/08 11:39

編集2019/04/09 11:00

前提・実現したいこと

ソースコード長いです。申し訳ありません。。。

現在AWSのCognitoを使ってサインアップ・サインインを行おうとしています。(サインアップはできました。)
基本的にチュートリアルを参考にしていますが、別途同じようなことをしている方もいたので参考にさせて頂いています。
チュートリアル
https://docs.aws.amazon.com/ja_jp/cognito/latest/developerguide/using-amazon-cognito-user-identity-pools-javascript-examples.html
別途参考ページ
https://hawksnowlog.blogspot.com/2016/10/try-login-with-aws-cognito.html
https://dev.classmethod.jp/cloud/aws/login-form-by-using-aws-sdk-for-javascript/

発生している問題・エラーメッセージ

以下のコードでエラー(再読み込み)になっているのが確認できました。          alert('processing3');     var cognitoUser = new AmazonCognitoIdentity.CognitoUser(userData);     alert('processing3'); (alertでprocessing3は出力され、processing4は出力されなかったため。)

該当のソースコード

javascript

1<!DOCTYPE html> 2<html lang="ja"> 3<head> 4 <meta charset="UTF-8" /> 5 <title>Cognitoサインイン</title> 6 <!-- aws sdk //--> 7 <script src="aws-sdk.min.js"></script> 8 <!-- aws cognito sdk (public beta!!) //--> 9 <script src="jsbn.js"></script> 10 <script src="jsbn2.js"></script> 11 <script src="sjcl.js"></script> 12 <script src="moment.js"></script> 13 <script src="aws-cognito-sdk.min.js"></script> 14 <script src="amazon-cognito-identity.min.js"></script> 15 <!-- jquery //--> 16 <script src="jquery-3.1.1.min.js"></script> 17 <!-- bootstrap3 //--> 18 <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous"> 19 <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap-theme.min.css" integrity="sha384-fLW2N01lMqjakBkx3l/M9EahuwpSfeNvV63J5ezn3uZzapT0u7EYsXMjQV+0En5r" crossorigin="anonymous"> 20 <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script> 21</head> 22<body> 23<div class="container"> 24 <form class="form-signin"> 25 <h2 class="form-signin-heading">サインイン</h2> 26 <div id="message" class="alert" style="display:none;"></div> 27 <label for="inputUsername" class="sr-only">ユーザー名</label> 28 <input type="text" id="inputUsername" class="form-control" placeholder="User name" required autofocus></input> 29 <label for="inputPassword" class="sr-only">パスワード</label> 30 <input type="password" id="inputPassword" class="form-control" placeholder="Password" required></input> 31 <br/> 32 <input type="submit" class="btn btn-lg btn-primary btn-bloc" id="login-button" value="ログイン"></input> 33 </form> 34</div> 35 36//ここからが本題です。 37<script> 38 <!-- 39 // Amazon Cognito 認証情報プロバイダーを初期化します 40 AWS.config.region = 'ap-northeast-1'; // リージョン 41 AWS.config.credentials = new AWS.CognitoIdentityCredentials({ 42 IdentityPoolId: 'ap-northeast-1:xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx', 43 }); 44 //--> 45</script> 46<script> 47 <!-- 48 49 $("#login-button").click(function(){ 50 alert('processing1'); 51 var authenticationData = { 52 Username : $('#inputUsername').val(), 53 Password : $('#inputUsername').val(), 54 }; 55 var authenticationDetails = new AmazonCognitoIdentity.AuthenticationDetails(authenticationData); 56 var poolData = { 57 UserPoolId: 'ap-northeast-1_xxxxxxxxx', 58 ClientId: 'yyyyyyyyyyyyyyyyyyyyyyyyy' 59 }; 60 61 var userPool = new AmazonCognitoIdentity.CognitoUserPool(poolData); 62 alert('processing2'); 63 var userData = { 64 Username : $('#inputUsername').val(), 65 Pool : userPool 66 }; 67 alert('processing3'); 68 var cognitoUser = new AmazonCognitoIdentity.CognitoUser(userData); **//←エラー箇所** 69 alert('processing4'); 70//以下から認証判定 71 cognitoUser.authenticateUser(authenticationDetails, { 72 onSuccess: function (result) { 73 var accessToken = result.getAccessToken().getJwtToken(); 74 var idToken = result.idToken.jwtToken; 75 76 }, 77 onFailure: function(err) { 78 alert(err.message); 79 }, 80 }); 81 alert('processing5'); 82 }); 83 //--> 84</script> 85</body> 86</html>

試したこと

初学者のこともあり、alertで確認しかできませんでした。
教えて頂けたら幸いです。。

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答1

0

自己解決

代入値が違いました。すみません。

投稿2019/04/09 11:01

takaahii

総合スコア7

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問