问题描述
当我使用Firebase UI登录时,出现错误:
未找到重定向URL。您必须在配置中指定signInSuccessUrl,将重定向URL传递到小部件URL,或从回调返回false。
这说明了为什么在我传递signinSuccesfulURL
时它会起作用,但是我确实从回调中返回了false!但是由于我使用的是打字稿,因此实际上返回了Promise<boolean>
。我不知道这是否与我的错误有关。
但是我不想使用signinSuccesfulURL
,因为我不希望它重定向,我希望它在成功登录后保留在当前页面上。
//firebaseui component
import StyledFirebaseAuth from "react-firebaseui/StyledFirebaseAuth"
import firebase from "gatsby-plugin-firebase"
import React from "react"
const firebaseFunctions = firebase.functions()
const firebaseuipage = dataToSubmit => {
console.log("within firebase ui",dataToSubmit)
var uiConfig = {
signInOptions: [
firebase.auth.GoogleAuthProvider.PROVIDER_ID,firebase.auth.FacebookAuthProvider.PROVIDER_ID,// {
// provider: firebase.auth.PhoneAuthProvider.PROVIDER_ID,// buttonColor: "#3A3A51",// },{
provider: firebase.auth.EmailAuthProvider.PROVIDER_ID,fullLabel: "Create Custom Account",buttonColor: "#ED6A5A",},],tosUrl: "<your-tos-url>",privacyPolicyUrl: function () {
window.location.assign("<your-privacy-policy-url>")
},callbacks: {
signInSuccessWithAuthResult: async(authResult) => {
const someFunction = firebaseFunctions.httpsCallable("some_function");
try {
let result = await someFunction(dataToSubmit)
} catch (error) {
console.error("within firebase service:",error)
}
console.log(authResult)
return false
},}
return (
<div>
<StyledFirebaseAuth uiConfig={(uiConfig as any)} firebaseAuth={firebase.auth()} />
</div>
)
}
export default firebaseuipage
//error
// I actually fixed this by passing uiConfig={(uiConfig as any)} in the above component
No overload matches this call.
Overload 1 of 2,'(props: Readonly<Props>): StyledFirebaseAuth',gave the following error.
Type '{ signInOptions: (string | { provider: string; fullLabel: string; buttonColor: string; })[]; tosUrl: string; privacyPolicyUrl: () => void; callbacks: { signInSuccessWithAuthResult: (authResult: any) => Promise<...>; }; }' is not assignable to type 'Config'.
The types returned by 'callbacks.signInSuccessWithAuthResult(...)' are incompatible between these types.
Type 'Promise<boolean>' is not assignable to type 'boolean'.
Overload 2 of 2,'(props: Props,context?: any): StyledFirebaseAuth',gave the following error.
Type '{ signInOptions: (string | { provider: string; fullLabel: string; buttonColor: string; })[]; tosUrl: string; privacyPolicyUrl: () => void; callbacks: { signInSuccessWithAuthResult: (authResult: any) => Promise<...>; }; }' is not assignable to type 'Config'.ts(2769)
index.d.ts(5,3): The expected type comes from property 'uiConfig' which is declared here on type 'IntrinsicAttributes & IntrinsicClassAttributes<StyledFirebaseAuth> & Readonly<Props> & Readonly<...>'
index.d.ts(5,3): The expected type comes from property 'uiConfig' which is declared here on type 'IntrinsicAttributes & IntrinsicClassAttributes<StyledFirebaseAuth> & Readonly<Props> & Readonly<...>'
解决方法
我觉得这行不通:
signInSuccessWithAuthResult: async(authResult) => {
const someFunction = firebaseFunctions.httpsCallable("some_function");
try {
let result = await someFunction(dataToSubmit)
} catch (error) {
console.error("within firebase service:",error)
}
console.log(authResult)
return false
},
由于您将函数标记为async
,因此它返回的是Promise,而不是FirebaseUI期望的简单true
或false
值。
尽管您无法将FirebaseUI的操作同步到您的Cloud Function调用中,但您可能可以不将回调标记为async
而仅返回false,就可以摆脱困境。这种情况。