3

로드 할 때 인증 옵션을 제공하는 브라우저에서 작동하는 SPA를 구축했습니다. Google 로그인을 클릭하면 인증 토큰 등이 생길 때까지 firebase 인증 절차가 계속됩니다.firebase auth가 안드로이드 데스크탑에 설치된 PWA에서 작동하지 않습니다.

그러면 PWA를 전환하고 정상적으로 사용할 수 있습니다. 하지만 로그 아웃하면 Google Auth를 사용하여 앱으로 다시 로그인 할 수 없습니다. Google 로그인 팝업이 앱에서 실행되는지 또는 Chrome에서 실행되는지 여부에 관계없이 앱에 대한 확인은 전혀 발생하지 않으며 실제로 충돌하는 것으로 보입니다.

문제는 Google 로그인을위한 추가 탭을로드하는 것과 관련이 있습니다. 화면상의 대화 상자에 따르면 Android에서이 탭을 PWA 또는 Chrome에서 열지 묻습니다. 어느 옵션을 선택하든, 플로우가 완료되지 않습니다 (그리고 연결이 끊기므로, devtools에서 유용한 것을 볼 수 없습니다).

작동하는 것처럼 보이는 유일한 흐름은 Chrome에서 로그인을 계속하고 완료되었을 때만 앱 버전으로 전환하는 것입니다. StackOverflow에서 작성하는 것이 좋지만 사용자에게는 매우 복잡합니다.

이 상황을 디버깅하려면 어떻게해야합니까? - PWA에서 firebase auth를 수행 할 수 있어야합니다. 및/또는 - 사용자가 브라우저에 로그인 한 후에 Android 화면을 추가하여 홈 화면에 추가 할 시간이 얼마 남지 않았습니까?

googlesignin 함수입니다. 코드에서 흔히 onAuthState 메시지를 기다리고 필요한 모든 정보가 있기 때문에 아무 것도하지 않습니다. @jasan 당

function signinGoogle() { 
    var provider = new firebase.auth.GoogleAuthProvider(); 
    firebase.auth().signInWithPopup(provider).then(function(result) { 
     // This gives you a Google Access Token. You can use it to access the Google API. 
     var token = result.credential.accessToken; 
     // The signed-in user info. 
     var user = result.user; 
     // ... 
    }).catch(function(error) { 
     // Handle Errors here. 
     var errorCode = error.code; 
     var errorMessage = error.message; 
     // The email of the user's account used. 
     var email = error.email; 
     // The firebase.auth.AuthCredential type that was used. 
     var credential = error.credential; 
     // ... 
    }); 
} 
+1

PWA가 많은 것을 의미 할 수 코멘트의 요청, 나는 @bojeil 기반으로하는 솔루션을 발견했다 '. 자세한 내용을 입력하십시오. signInWithRedirect를 사용해보십시오. signInWithPopup에는 많은 PWA 환경/프레임 워크에서 문제가 있습니다. – bojeil

+0

@ simon-h이 문제를 해결 했습니까? 나는 똑같은 문제가 있다고 생각한다. 나도 당신의 질문을 먼저 보지 않았고, https://stackoverflow.com/questions/47122645/를 게시했다. – jasan

답변

1

function signinGoogle(cb) { 
    var provider = new firebase.auth.GoogleAuthProvider(); 
    // firebase.auth().signInWithPopup(provider).then(function(result) { 
    firebase.auth().signInWithRedirect(provider).then(function(result) { 
     console.log("Google signin successful") 
     // This gives you a Google Access Token. You can use it to access the Google API. 
     // var token = result.credential.accessToken; 

     // Send user to rest of program 
     cb(token) 
    }) 
    .catch(function(error) { 
     logger(error); 
    }); 
} 
관련 문제