//tips
99designの面白機能を試す。
https://99designs.jp/contests/poll/9224c82bd7
//smart contract
[id]ページのボタンを押すと同時に自分の[id]のメッセージに飛べるようにし、その際にはログイン済みであるかどうかの分岐も作っておく。
同時にクリックを押したページの[id]はlocalStorageに格納しておき、メッセージページでそちらの格納情報を取り出し、そのuseridへのメッセージとして処理させる。
メッセージページでもeditページと同じく、authhistoryでの照合を行わせるか。
useEffect(() => {
console.log('aaa')
console.log(localStorage.getItem('authhistory'))
setauthHistory(localStorage.getItem('authhistory'))
if (localStorage.getItem('authhistory')) {
console.log('authhistory')
if(localStorage.getItem('authhistory')!=ninja[0].mail){router.push('/ID/'+ninja[0].userid)}
}else{router.push('/')}
}, [])
[id]ページのボタンのイベント関数を整備していく。
<EmailOutlinedIcon className={classes.imagemargin} style={{fontSize: '32px'}} onClick={handleClickMessage}/>
const handleClickMessage = (e) => {
e.preventDefault();
//クリック時点で[id]の登録
localStorage.setItem('Sender',ninja[0].userid)
console.log('handleClickMessage')
console.log(ninja[0].userid)
const myid=localStorage.getItem('authuserid')
if(myid){
console.log('Success!')
router.push('/ID/'+myid+'/Message')
}else{
router.push("/login")
}
}
これでよさそう。
どこかの地点でログイン処理だけでも
localStorage.setItem('authuserid',ninja[0].userid)
を登録できるようにしておきたい。
これをログインページで処理する理由は[id]ページでのデータベース接続処理とは別途データベース接続を行う必要がなり、無駄に重くなりそうなので分けた。
LoginページでのMaxidを取るついでにauthhistoryとmailの照合を行い、そこで自身のuseridをとってしまうか。
Authhistoryがない場合に備えてauthinでもデータをセットできるようにしておく。
getDocs(colRef)
.then((snapshot)=>{
snapshot.docs.forEach(doc => {
posts.push(JSON.stringify(doc.data().userid))
if (localStorage.getItem('authhistory')) {
if(localStorage.getItem('authhistory')==doc.data().mail)
{localStorage.setItem('authuserid',doc.data().mail)}
}
});
}).then(()=>{
setMaxid(posts.reduce(aryMax))
まずは上記のようにeffect内部でセット。
さらにsendData()を handleOnAuthInの中に作り、ログイン時にこちらの関数が呼ばれるかを確認。
signInWithEmailAndPassword(auth,email,password)
.then((cred)=>{
console.log('user loged in:',cred.user)
localStorage.setItem('authhistory',email)
setUmail('')
setUpass('')
}).then(()=>{
console.log('localStorage.getItem(authhistory)')
console.log(localStorage.getItem('authhistory'))
sendData()
})
function sendData() {
// handleOnAuthIn内で実行
console.log("handleOnAuthIn内で実行");
}
無事にsendDataの関数内部まで呼ばれたので、こちらに再度データベースへのアクセス部分のコードを追加する。localStorage.setItem('authuserid',doc.data().mail)を組み込む形になる。
function sendData() {
// handleOnAuthIn内で実行
console.log("handleOnAuthIn内で実行");
const colRef= collection(firebaseApp, "mydata")
getDocs(colRef)
.then((snapshot)=>{
snapshot.docs.forEach(doc => {
if (localStorage.getItem('authhistory')) {
if(localStorage.getItem('authhistory')==doc.data().mail)
{localStorage.setItem('authuserid',doc.data().mail)}
}
});
}).then(()=>{
console.log("localStorage.setItem('authuserid'完了済み")
})
}
問題なく動作した。
今度は動作完了後に自分のページに自動で遷移できるように組み込む。この際にエラーが出たがuseridではなくmailに設定がなっていたためurlがうまく作動しなかった。再度トライ。
localStorage.setItem('authuserid',doc.data().userid)
エラーUncaught (in promise) FirebaseError: Firebase: Error (auth/user-not-found).が発生。
Could not reach Cloud Firestore backend. Backend didn't respond within 10 seconds.
This typically indicates that your device does not have a healthy Internet connection at the moment. The client will operate in offline mode until it is able to successfully connect to the backend.
async function sendData() {にしてみる。
きちんと作用した。無事にlocalStorage.setItem('authuserid'登録後に自身のページに遷移した。
indexのasync function handleOnAuthIn(e) {にも同様の機能をつけておくか。