Question

我正在使用Firebase Auth signInWithPopup()，这绝对是非常棒的。但最初配置时，弹出窗口显示为：

选择一个帐户以继续访问myApp-123.firebaseapp.com

我真的很想读它：

选择一个帐户以继续访问myApp.com

如何让弹出窗口显示我自己的域名？

Answer 1

在我的解决方案中，我应该说我遵循的步骤有效。我可能做了一些并非绝对必要的事情，但据我所知，此时我还没有做任何事情。

此工作流程（和文档）有点分散，因为您必须同时调整Google Cloud Platform（GCP）凭据和Firebase身份验证。文档由此工作流程的每一方提供，但我无法找到涵盖整个工作流程的文档来进行此替换。

我首先调整了我的GCP凭证：

https://console.cloud.google.com //至少对我来说，这导致我参与了我的活跃GCP项目。
使用gcp搜索字段并输入“凭据”，这会将您带到项目的API Manager / Credentials。
“OAuth 2.0客户端ID”的页面底部标题，我只有一个条目，如果你有多个???不知道该告诉你什么，但要弄清楚哪一个你感兴趣。
在页面右侧点击编辑图标（笔），您将获得一个新页面...
在占位符为“http // www.example.com”的空白字段中添加自定义URI。你可能会有一个“https”域名，所以我会输入https // myApp.com
在页面下方，您应该看到“授权的重定向URI”，在此下面是https://yourFirebaseApp.firebaseapp.com/__/auth/handler的字段。尾部的__/auth/handler位是模糊指令中引用的auth回调。
在下面的空白字段中添加了“https://myApp.com/__/auth/handler”

我认为这是本次交易的GCP方面。

消防指示

打开项目的firebase控制台并打开“身份验证”页面。然后导航到“登录方法”页面，例如“认证/提供者”应该位于项目的尾部。
在“授权域名”下，您应该看到“本地主机”...默认和yourFirebaseApp.firebaseapp.com ...默认，单击“添加域”按钮，您将获得一个空字段奖励您需要输入自定义域名。最后点击“添加”按钮。在我的情况下经过两三次尝试后，这导致了“myApp.com”......自定义（在此过程中出现了某种故障，需要我重新启动一两次）。

最后在您的交易结束时，您需要修改您的代码。

您可能会记住从firebase项目中复制并粘贴到编译和部署Web App的代码中的代码块。我使用src/environments/environment.prod来获取此firebase配置数据。您现在可以将“authDomain”值更改为自定义域，执行生产构建并将其部署到firebase。

这个程序对我和我的项目有用，我发布了这个程序，希望这些说明可以通过执行此类或类似操作的其他人的反馈来改进。

Answer 2

我问了firebase支持并得到了以下回复。斜体中的项目是我的补充。这与Done的答案大致相同，但具有自定义域名。您无需在Firebase上托管您的应用。

-

你好Jayen，

感谢您与我们联系。我很乐意为你提供帮助。

要在OAuth许可屏幕中更新firebase-project-id.firebaseapp.com，您需要具有Firebase托管的自定义域（Firebase控制台＆gt;托管＆gt;连接域）。这是因为https://firebase-project-id.firebaseapp.com/__/auth/handler由Firebase托管托管。您需要将自定义域指向firebase-project-id.firebaseapp.com。

连接自定义域时，如果您未在firebase上托管应用，请使用新的子域（例如app.yourdomain.com），不要重定向它。 Firebase将提示您添加DNS条目并自动获取SSL证书。

将自定义域名连接到Firebase项目后，您还应该按照以下步骤操作：

转到Firebase控制台＆gt;选择项目＆gt;身份验证＆gt;登录方法＆gt; Facebook＆gt;复制＆＃39;要完成设置，请将此OAuth重定向URI添加到您的Facebook应用配置中。＆＃39;
- 看起来像https://firebase-project-id.firebaseapp.com/__/auth/handler
将项目ID替换为您的自定义域。它看起来像：https://yourdomain.com/__/auth/handler
转到GCP控制台＆gt;选择项目＆gt; API Manager＆gt;证书＆gt;将＃2中的链接添加到＆＃39;授权重定向URI＆＃39;
然后确保在您应用的配置中使用yourdomain.com作为authDomain而不是firebase-project-id.firebaseapp.com
```
firebase.initializeApp({
    apiKey: ....,
    authDomain: 'yourdomain.com',
     ...
});
```

如果您对此有任何其他疑问，请与我们联系。

此致

埃

-

在我的情况下，yourdomain.com是我托管我网站的地方，因此我在需要它的地方使用了app.yourdomain.com。

Firebase Hosting URL
处理程序网址：https://app.yourdomain.com/__/auth/handler
GCP Credentials
- 在 OAuth 2.0客户端ID 下选择正确的一个。客户端ID将与您在代码中配置Firebase的客户端ID相匹配。
authDomain: "app.yourdomain.com"

如何使用我的自定义域myApp.com替换myApp-123.firebaseapp.com

2 个答案:

消防指示