如何整合google登录我的网站并收集用户详细信息? [英] How do I integrate google sign in to my website and collect the users details?

查看:48
本文介绍了如何整合google登录我的网站并收集用户详细信息?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我想将google登录按钮集成到我的网站上.我知道html,但不确定php和java脚本.最终,我希望google登录来登录用户并提供他们的信息,以便我可以将其安全地存储在phpmyadmin上的数据库中.为此,我已经访问了 Google教程,但发现它没有解释如何全面收集用户信息.我尝试遵循此方法,到目前为止,我有,但与它的实际情况相去甚远.我看过其他教程,例如此教程.但是我发现它们都不遵循google的说明,例如您必须在其中下载google API,但是在google网站上却没有提及下载任何内容.

以下是我到目前为止已经完成的操作的代码:使用Google教程:

<html lang="en">
  <head>
    <meta name="google-signin-scope" content="profile email">
    <meta name="google-signin-client_id" content="808271051181-424qcdq0emrd0pd77frfiuacvcetp58t.apps.googleusercontent.com">
    <script src="https://apis.google.com/js/platform.js" async defer></script>
  </head>
  <body>
    <div class="g-signin2" data-onsuccess="onSignIn" data-theme="dark"></div>
    <script>
      function onSignIn(googleUser) {
        // Useful data for your client-side scripts:
        var profile = googleUser.getBasicProfile();
        console.log("ID: " + profile.getId()); // Don't send this directly to your server!
        console.log('Full Name: ' + profile.getName());
        console.log('Given Name: ' + profile.getGivenName());
        console.log('Family Name: ' + profile.getFamilyName());
        console.log("Image URL: " + profile.getImageUrl());
        console.log("Email: " + profile.getEmail());

        // The ID token you need to pass to your backend:
        var id_token = googleUser.getAuthResponse().id_token;
        console.log("ID Token: " + id_token);
      };
    </script>
  </body>
</html>

解决方案

您也许可以从javascript的配置文件中获取所有数据,但我想将其所有数据都转换为php变量,以便可以将其存储在数据库中.为此,我从javascript发送了Google ID令牌作为发布数据(该操作方法

还要在正文中添加表单代码:

<form action="login.php" method="post">
    <input type="hidden" name="id" id="userid">
</form>

然后,您需要另一个文件我称为login.php,其中包含以下功能:

function get_var($var)
{
    $id = $_POST["id"]; // id from google
    $id_token = file("https://www.googleapis.com/oauth2/v3/tokeninfo?id_token=" . $id); // decrypted id
    foreach ($id_token as $part) {
        // part is a factor of the user such as name or email
        // remove unecessary charcters
        $peice = str_replace("\"", "", $part);
        $peice = str_replace(",", "", $peice);
        $peice = substr($peice, 0, strpos($peice, ":") + 2);
        if (strpos($peice, $var) !== false) {
            $var = str_replace("\"", "", $part);
            $var = str_replace(",", "", $var);
            $var = substr($var, strpos($var, ":") + 2);
            return $var;
        }
    }
}

通过此操作,您应该能够获取所需的所有信息.示例使用:

$name = trim(get_var("name"));
$email = trim(get_var("email"));

要查看所有可访问的信息,请在get_var中打印$id_token或转到此处中获取有关从ID令牌获取数据的更多信息. /p>

I want to integrate the google sign in button onto my website. I know html but I am unsure on php and java script. Ultimately, I would like the google sign in to sign in the user and give me their information so i can store it on my database on phpmyadmin securely. I have visited the google tutorial for this but found it did not explain how to collect the users information fully. I have attempted to follow this and so far I have this but it is far from what it should be like. I have watched other tutorials such as this one. However i find they all do not follow the googles instructions as for example you have to download a google API in them, however on the google website it does not mention downloading anything.

Below is the code of what i have managed to do so far by using the google tutorial:

<html lang="en">
  <head>
    <meta name="google-signin-scope" content="profile email">
    <meta name="google-signin-client_id" content="808271051181-424qcdq0emrd0pd77frfiuacvcetp58t.apps.googleusercontent.com">
    <script src="https://apis.google.com/js/platform.js" async defer></script>
  </head>
  <body>
    <div class="g-signin2" data-onsuccess="onSignIn" data-theme="dark"></div>
    <script>
      function onSignIn(googleUser) {
        // Useful data for your client-side scripts:
        var profile = googleUser.getBasicProfile();
        console.log("ID: " + profile.getId()); // Don't send this directly to your server!
        console.log('Full Name: ' + profile.getName());
        console.log('Given Name: ' + profile.getGivenName());
        console.log('Family Name: ' + profile.getFamilyName());
        console.log("Image URL: " + profile.getImageUrl());
        console.log("Email: " + profile.getEmail());

        // The ID token you need to pass to your backend:
        var id_token = googleUser.getAuthResponse().id_token;
        console.log("ID Token: " + id_token);
      };
    </script>
  </body>
</html>

解决方案

You might be able to get all data from the profile in javascript, but I wanted to get all their data into php variables so that I could store in my database. To do this I sent the google id token as post data from javascript (how to do that here). You still need all the other google sign in code you have, but I replaced onSingIn with this:

function onSignIn(googleUser) {
    var profile = googleUser.getBasicProfile();
    document.getElementById("userid").value = googleUser.getAuthResponse().id_token;
    document.getElementById("userid").form.submit();
}

Also add the form code in the body:

<form action="login.php" method="post">
    <input type="hidden" name="id" id="userid">
</form>

You then need another file I called it login.php which contains the following function:

function get_var($var)
{
    $id = $_POST["id"]; // id from google
    $id_token = file("https://www.googleapis.com/oauth2/v3/tokeninfo?id_token=" . $id); // decrypted id
    foreach ($id_token as $part) {
        // part is a factor of the user such as name or email
        // remove unecessary charcters
        $peice = str_replace("\"", "", $part);
        $peice = str_replace(",", "", $peice);
        $peice = substr($peice, 0, strpos($peice, ":") + 2);
        if (strpos($peice, $var) !== false) {
            $var = str_replace("\"", "", $part);
            $var = str_replace(",", "", $var);
            $var = substr($var, strpos($var, ":") + 2);
            return $var;
        }
    }
}

With this you should be able to get all the information you need. Example uses:

$name = trim(get_var("name"));
$email = trim(get_var("email"));

To view all the accessible information either print out $id_token in get_var or go to https://www.googleapis.com/oauth2/v3/tokeninfo?id_token= adding an id token at the end. More information about getting data from an ID token here.

这篇关于如何整合google登录我的网站并收集用户详细信息?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆