使用 Firebase 进行 Microsoft 身份验证答案

【问题标题】：microsoft authentication using firebase使用 Firebase 进行 Microsoft 身份验证
【发布时间】：2022-01-10 14:36:05
【问题描述】：

我正在使用 firebase 进行 Microsoft 身份验证。它是 vuejs 2 技术中的一个网络项目。我已经按照这个Documentation 一步一步地为firebase 和代码部分也按照这个Documentation 在Azure 门户中创建帐户但收到此错误：

error FirebaseError: Firebase: Error getting verification code from microsoft.com response: error=invalid_request&error_description=Proof%20Key%20for%20Code%20Exchange%20is%20required%20for%20cross-origin%20authorization%20code%20redemption.&state=AMbdmDnE2TjhyB-T1hIHqYTh73Za9GIrASM-9NFz4trUb4QSLmP6W_qIFNCSl2fmUyq0tTvTNeB3Yg1a3XmOHg93aDItLCJTEEf9B-6EdpPLzR-_mkV9bI3QLoTyT3JQl9Pldczh3BfRlTZQ2KwKfV8IxgpHoXxKJByVzaB-M1wxWO9ESh7Ap_2BvNYHrq2tSFQHbK9D70l7xzi292de6G4rbGUgKmtuTtND4B671A1sxhD2-1WTWaCXkLMv_R7q5JTiWmfqn12ZipA_RWnMBDkPRhglBVReg6jBCRWKv1PvWN2dVQOQfjIoTKRfUs8VK4KfMDR6rYAVst8UStsO79nPN27_32yBjoU9pdl3 (auth/invalid-credential).
at _errorWithCustomMessage (vendors~app~._node_modules_@firebase_auth_dist_esm2017_index-1679a2b2.js~8334e211.js:568:20)
at _performFetchWithErrorHandling (vendors~app~._node_modules_@firebase_auth_dist_esm2017_index-1679a2b2.js~8334e211.js:1085:23)
at async _performSignInRequest (vendors~app~._node_modules_@firebase_auth_dist_esm2017_index-1679a2b2.js~8334e211.js:1100:29)
at async _signInWithCredential (vendors~app~._node_modules_@firebase_auth_dist_esm2017_index-1679a2b2.js~8334e211.js:4706:22)
at async PopupOperation.onAuthEvent (vendors~app~._node_modules_@firebase_auth_dist_esm2017_index-1679a2b2.js~8334e211.js:7965:26)

请提出解决上述问题的可能方法

【问题讨论】：

标签： firebase vue.js authentication vuejs2 firebase-authentication

【解决方案1】：

我可以通过以下两个步骤来解决这个问题

第 1 步：我在 azure 门户上创建了 SPA 平台，但它应该是 web 平台，所以只需删除 SPA 并添加 web 平台来解决此问题

要根据您的目标平台或设备配置应用程序设置，请按以下步骤操作：

在 Azure 门户的应用注册中，选择您的应用程序。
在管理下，选择身份验证。
在平台配置下，选择添加平台。下
配置平台，为您的应用程序类型选择磁贴
（平台）配置其设置。

第 2 步：我们必须在 fire base 控制台中使用应用程序机密，这需要从 azure 门户正确复制创建和添加客户端密码的基本步骤

在 Azure 门户的应用注册中，选择您的应用程序。
选择证书和机密 > 客户端机密 > 新客户端机密。
为您的客户端密码添加说明。
选择密钥的过期时间或指定自定义生命周期
选择添加。
记录 secret 的值，以便在您的客户端应用程序代码中使用。 离开此页面后，此秘密值将不再显示。

请正确阅读最后一步，如果您离开页面，我们必须复制键值，该值将像这样用 *** 隐藏，因此在这种情况下，只需删除此键并添加新的客户端键，然后复制值（它是“Value”字段而不是“Secret ID”字段）

现在只需将该密钥添加到应用程序机密字段中的 Fire Base 控制台

注意：请尝试正确遵循这些文档Firebase documentation 和microsoft azure documentation

【讨论】：