Вход в Firebase Google не запрашивает пароли пользователей

Firebase Google Login не запрашивает пароли пользователей и перенаправляет на неправильную страницу.

Вход в систему электронной почты firebase работает.

Я настроил авторизованные URI перенаправления на правильные в коде JS конфигурации, в консоли firebase и в ключе Google Cloud API.

Когда я нажимаю кнопку Google, он перенаправляется на что-то вроде:

www.myurl.com/__/auth/handler?apiKey=xxxxxxxxxxxxxxxxxxxxx&appName=%5BDEFAULT%5D-firebaseui-temp&authType=signInViaRedirect&redirectUrl=https%3A%2F%2Fwww.myurl.com%2Fsign-in&v=9.13.0&providerId=google.com&scopes=profile

Код на моем сайте следующий:

В заголовке:

<script src = "https://www.gstatic.com/firebasejs/9.13.0/firebase-app-compat.js"></script>
<script src = "https://www.gstatic.com/firebasejs/9.13.0/firebase-auth-compat.js"></script>
<script src = "https://www.gstatic.com/firebasejs/ui/6.0.2/firebase-ui-auth.js"></script>
<link
      type = "text/css"
      rel = "stylesheet"
      href = "https://www.gstatic.com/firebasejs/ui/6.0.2/firebase-ui-auth.css"
      />

в теле у меня есть элемент со следующим кодом:

<div id = "firebaseui-auth-container"></div>

<script type = "text/javascript">
      //const auth = firebase.auth();
      // FirebaseUI config.
      var uiConfig = {
        // Important: the following URL should be in both Firebase and Gloogle Cloud authorised clients
        signInSuccessUrl: "/private/main",
        // autoUpgradeAnonymousUsers: true,
        signInOptions: [
          // Leave the lines as is for the providers you want to offer your users.
          firebase.auth.GoogleAuthProvider.PROVIDER_ID,
          firebase.auth.EmailAuthProvider.PROVIDER_ID,

        ],
        // tosUrl and privacyPolicyUrl accept either url string or a callback.
        // Terms of service url/callback.
        tosUrl: "/terms-of-services",
        // Privacy policy url/callback.
        privacyPolicyUrl: "/privacy-policy"
      };
      // App's Firebase configuration
      const firebaseConfig = {
        apiKey: "xxxxxxxxxxxxxxxxxx",
        authDomain: "myurl.com",
        projectId: "xxxxxxxxxxxxxxxxx",
        storageBucket: "xxxxxxxxxxxxxxxx",
        messagingSenderId: "xxxxxxxxxxxxxxxxx",
        appId: "xxxxxxxxxxxxxxxxx",
      };

      // Initialize Firebase
      const app = firebase.initializeApp(firebaseConfig);

      // Initialize the FirebaseUI Widget using Firebase.
      var ui = new firebaseui.auth.AuthUI(firebase.auth());
      // The start method will wait until the DOM is loaded.
      ui.start("#firebaseui-auth-container", uiConfig);
    </script>

Возможно, пользователь уже вошел в систему с помощью Google. У вас есть наблюдатель за состоянием авторизации, который сообщает вам, так ли это?

Doug Stevenson 11.01.2023 00:42

Нет, пользователь не вошел в систему, я также удалил свою учетную запись в Firebase, чтобы убедиться.

Escachator 11.01.2023 12:01
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Безумие обратных вызовов в javascript [JS]
Безумие обратных вызовов в javascript [JS]
Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
JavaScript Вопросы с множественным выбором и ответы
JavaScript Вопросы с множественным выбором и ответы
Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...
0
2
67
2
Перейти к ответу Данный вопрос помечен как решенный

Ответы 2

Кажется, есть проблема с синтаксисом в элементе firebaseui-auth-container, где перенаправления не вызываются должным образом, что приводит к неправильной странице входа также в соответствии с вашим комментарием, если пользователь также уже зарегистрирован, и вы проверили это, тогда перенаправления и рендеринг могут вызвать такое поведение.
Я бы посоветовал вам удалить лишнюю запятую после Email AuthProvider ниже и проверить, правильно ли работают параметры подписи.

signInOptions: [ // Leave the lines as is for the providers you want to offer your users.    
  firebase.auth.GoogleAuthProvider.PROVIDER_ID,  
  firebase.auth.EmailAuthProvider.PROVIDER_ID]

Наряду с вышеуказанными изменениями попробуйте добавить следующие пользовательские параметры, если вы хотите настроить принудительный повторный ввод пароля каждый раз, когда страница загружается для повторной аутентификации и входа в систему.

  signInOptions: [
{
      provider: firebase.auth.GoogleAuthProvider.PROVIDER_ID,
      scopes: [
        'public_profile',
        'email',
        'user_likes',
        'user_friends'
      ],
      customParameters: {
        // Forces password re-entry.
        auth_type: 'reauthenticate'
      }
    },

Также проверьте раздел URL-адреса перенаправления по умолчанию при успешном входе в систему.

// Will use popup for IDP Providers sign-in flow instead of the default, redirect.
  signInFlow: 'popup',
  signInSuccessUrl: '<url-to-redirect-to-on-success>'

Я также рекомендую вам проверить ссылки ниже для подобных примеров:

Большое спасибо, Вайдехи. В итоге оказалось, что решение было в другом. Я добавил это здесь, если это кому-то поможет.

Escachator 13.01.2023 23:30
Ответ принят как подходящий

Оказывается, решение состояло в том, чтобы добавить к ключу Google Cloud API домен аутентификации firebase, который появляется в переменной firebaseConfig, кроме URL-адреса, на котором размещен веб-сайт, выполняющий аутентификацию.

Другие вопросы по теме