Недействительное происхождение для клиента из API Google Oauth

Я получаю эту ошибку из API Google Oauth:

idpiframe_initialization_failed ", подробности:" Недействительное происхождение для клиента: http://127.0.0. itelist this origin для вашего идентификатора клиента проекта

Я пытаюсь отправить запрос с этого локального пути:

http://127.0.0.1:8887/

И я уже добавил этот URL к авторизованным исходным кодам JavaScript раздел:

Это мой код:

<!-- The top of file index.html -->
<html itemscope itemtype="http://schema.org/Article">
<head>
  <!-- BEGIN Pre-requisites -->
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js">
  </script>
  <script src="https://apis.google.com/js/client:platform.js?onload=start" async defer>
  </script>
  <!-- END Pre-requisites -->

<!-- Continuing the <head> section -->
  <script>
    function start() {
      gapi.load('auth2', function() {
        auth2 = gapi.auth2.init({
          client_id: 'MY CLIENT ID.apps.googleusercontent.com',
          // Scopes to request in addition to 'profile' and 'email'
          //scope: 'https://www.google.com/m8/feeds/'
        });
      });
    }
  </script>




</head>
<body>


<button id="signinButton">Sign in with Google</button>
<script>
  $('#signinButton').click(function() {
    // signInCallback defined in step 6.
    auth2.grantOfflineAccess().then(signInCallback);
  });
</script>



<!-- Last part of BODY element in file index.html -->
<script>
function signInCallback(authResult) {
  if (authResult['code']) {

    // Hide the sign-in button now that the user is authorized, for example:
    $('#signinButton').attr('style', 'display: none');

    // Send the code to the server
    $.ajax({
      type: 'POST',
      url: 'http://example.com/storeauthcode',
      // Always include an `X-Requested-With` header in every AJAX request,
      // to protect against CSRF attacks.
      headers: {
        'X-Requested-With': 'XMLHttpRequest'
      },
      contentType: 'application/octet-stream; charset=utf-8',
      success: function(result) {
        // Handle or verify the server response.
      },
      processData: false,
      data: authResult['code']
    });
  } else {
    // There was an error.
  }
}
</script>
  <!-- ... -->
</body>
</html>

Как я могу это исправить?

Ответы

Ответ 1

Если вам все равно, попробуйте добавить http://localhost: 8887 к авторизованным источникам JavaScript. В какой-то момент я сам допустил эту ошибку, и это исправило ее. Знайте, что вам придется использовать этот URL и для вашего запроса, хотя он переводится на http://127.0.0.1:8887/.

Ответ 2

У меня была очень похожая проблема с твоей. Я попытался добавить несколько удаленных портов из localhost, и ничего не работало. Закончилось удаление учетных данных и их настройка снова. Должна была ошибка для googles для моей установки.

Ответ 3

Переустановка Chrome кеша решила это для меня. Нажмите и удерживайте кнопку "Перезагрузить", затем очистите кэш и выполните полную перезагрузку.

Ответ 4

Я читал несколько мест в Интернете, которые люди используют для повторного создания учетных данных, чтобы заставить его работать.
Таким образом, я сделал, я создал новые учетные данные для одного и того же проекта и использовал мой новый идентификатор пользователя, и он отлично работал... Похоже, что версия белого списка немного флэче...

Nb: Я также использовал localhost вместо 127.0.0.1, IP-адреса недействительны.

Ответ 5

Я возился около 10 минут, а потом все заработало, когда я попробовал http://localhost/ в браузере (вместо 127.0.0.1)

Добавил URL в каждом месте, где вы можете сделать белые списки по адресу: https://console.developers.google.com/apis/credentials/

Ответ 6

"Неправильный источник для клиента", по-видимому, слишком часто используется API Google, т.е. Ошибочно используется и для ошибок аутентификации.

Если люди видят ошибку, проверьте правильность учетных данных.

(Это может объяснить, почему это работает для некоторых людей после повторного создания учетных данных - в некоторых случаях исходные учетные данные могут быть неверными).

Ответ 7

Я только что прошел через все эти решения, прежде чем понял, что вкладываю

HTTPS://локальный: 3000

и мой сервер разработки обслуживал

HTTP://локальный: 3000

Глупо, я знаю, но кто-то другой, вероятно, сделает ту же ошибку, и, возможно, этот комментарий поможет им :)

Ответ 8

У меня была такая же проблема, и я искал в течение 3 дней: Решить " popup_closed_by_user " Перейдите в console.google. Перейдите к вашему API Credentials:modify your credentials:

Authorized Javascript origin (http://localhost:port);Authorized redirect URI( http://localhost:port/auth/google/callback);

Example:|| Authorized Javascript origin (http://localhost:4200);Authorized redirect URI( http://localhost:4200/auth/google/callback)|| enter image description here'enter code here'