inappbrowser 内に webapp を含む ionic アプリを作成しています。Web アプリケーションにログインできるように、資格情報を Web アプリケーションのログイン フォームに送信する別の ionic ログイン フォームを作成しました。
これが私の現在のコードの流れです:
ユーザーの資格情報がストレージに保存されている場合は、webapp を開いてユーザーを自動的にログインさせます。それ以外の場合は、ログイン ページにとどまります。
しかし問題は、ユーザーが新しいログインをするたびにストレージをクリアすると、null 値が返されることです。
また、自分のコードが適切な方法であるかどうかもよくわかりません。他の方法はありますか?
userInput: string = "";
passInput: string = "";
userKey:string = 'username';
passKey:string = 'password';
constructor(
private platform: Platform,
private iab: InAppBrowser,
private storage: Storage
) { this.init(); }
init() {
let promiseList = [];
Promise.all([
this.storage.get(this.userKey).then((username) => {
console.log('Retrieved username is', username);
promiseList.push(username)
}),
this.storage.get(this.passKey).then((password) => {
console.log('Retrieved password is', password);
promiseList.push(password)
})
]).then(() => {
console.log('promiseList', promiseList)
if (validated) { this.openWebApp(promiseList) }
else { //remain in the login page }
})
}
login() {
// this.storage.clear()
this.storage.set(this.userKey, this.userInput)
this.storage.set(this.passKey, this.passInput)
this.init();
}
openWebApp(credentials) {
console.log('credentials', credentials, credentials[0], credentials[1])
this.platform.ready().then(() => {
const browser = this.iab.create('https://www.mywebapp.com/login', '_blank', {location:'no', footer:'no', zoom:'no', usewkwebview:'yes', toolbar:'no'});
browser.on('loadstop').subscribe(event => {
browser.show();
browser.executeScript({
code: `document.getElementById("usernameInput").value=${credentials[0]} document.getElementById("passwordInput").value=${credentials[1]} document.getElementById("submitBtn").click()`
})
});
});
これが私が達成したいことです:
ユーザーが新しい資格情報で再度ログインする場合は、古い資格情報を消去して新しい資格情報を保存します。