Bloguero-ec

Codigo Fuente, programación, Diseño Web

Iniciar sesión con google php y mysql

mayo 19, 2014
codigo-fuente,formulario,google,mysql,php,sistema



Iniciar sesión con google php y mysql es lo que vamos a ver en este tutorial. Probablemente hayas visto en varios websites , donde el usuario puede iniciar sesión con su cuenta de google dentro de una web , permitiendo utilizar cierta información del usuario .
Pero como iniciamos sesión en google y desde nuestra web..?

Hoy en día las redes sociales han hecho un cambio tecnológico en sus códigos fuentes y han creado lo que se conoce como OAuth .

Qué es OAuth y para que sirve o en que me beneficia a mi y mi web..?

OAuth (Open Authorization) es un protocolo abierto, propuesto por Blaine Cook y Chris Messina, que permite autorización segura de una API de modo estándar y simple para aplicaciones de escritorio, móviles y web.

Para desarrolladores de consumidores, OAuth es un método de interactuar con datos protegidos y publicarlos. Para desarrolladores de proveedores de servicio, OAuth proporciona a los usuarios un acceso a sus datos al mismo tiempo que protege las credenciales de su cuenta. En otras palabras, OAuth permite a un usuario del sitio A compartir su información en el sitio A (proveedor de servicio) con el sitio B (llamado consumidor) sin compartir toda su identidad.

De que forma me beneficia , pues bién como sabemos esto nos ahorrará la manera de crear un registro a nuestras web en otros casos obligatorios para poder acceder a una zona específica solo bastará con que el usuario haga clic en iniciar sesion desde google y dar las autorizaciones correspondientes a cierta web o aplicaciónes.

Para esto el usuario deberá tener una cuenta en google ..

Existe harto código fuente para esto y para muchas otras redes sociales como twitter y facebook…

Voy a brindar un poco de información de como se hace esto…

Necesitaremos tener una cuenta en google y acceder a la Consola de APi de google crear una nueva Cliente ID y proporcionar información y crear una key es todo en cuanto a google, ahora necesitaremos sus bibliotecas y cargarlas a nuestro hosting. Esto no funciona de manera local.

Archivos a utilizar:

Por el momento voy a publicar los de configuración el estilo la tabla y el index en archivo de descarga está las bibliotecas de google entre otros

tabla.sql

CREATE TABLE `usuario_google` (
 `id` int(10) unsigned NOT NULL AUTO_INCREMENT,
 `email` varchar(100) COLLATE utf8_unicode_ci NOT NULL,
 `name` varchar(100) COLLATE utf8_unicode_ci NOT NULL,
 `photo` varchar(255) COLLATE utf8_unicode_ci NOT NULL,
 `registered` timestamp NOT NULL DEFAULT CURRENT_TIMESTAMP,
 PRIMARY KEY (`id`),
 UNIQUE KEY `email` (`email`)
) ENGINE=MyIsam  DEFAULT CHARSET=utf8 COLLATE=utf8_unicode_ci;

index.php

<?php

require 'config.php';


$client = new apiClient();


// configuracion
$client->setClientId($client_id);
$client->setClientSecret($client_secret);
$client->setDeveloperKey($api_key);
$client->setRedirectUri($redirect_url);
$client->setApprovalPrompt(false);
$oauth2 = new apiOauth2Service($client);


if (isset($_GET['code'])) {
    
    $client->authenticate();
    
    $info = $oauth2->userinfo->get();
    
    $person = ORM::for_table('usuario_google')->where('email', $info['email'])->find_one();
    
    if(!$person){
        
        $person = ORM::for_table('usuario_google')->create();
        
        $person->email = $info['email'];
        $person->name = $info['name'];
        
        if(isset($info['picture'])){
            $person->photo = $info['picture'];
        }
        else{
            $person->photo = 'img/default_avatar.jpg';
        }
        
        $person->save();
    }
    //variable de sesion
    $_SESSION['user_id'] = $person->id();
    
    header("Location: $redirect_url");
    exit;
}
//destruimos la sesion
if (isset($_GET['logout'])) {
    unset($_SESSION['user_id']);
}

$person = null;
if(isset($_SESSION['user_id'])){
    $person = ORM::for_table('usuario_google')->find_one($_SESSION['user_id']);
}

?>

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <title>Inicia sesion con tu cuenta de google...</title>
        
        <link rel="stylesheet" href="css/estilo.css" />
        
        <!--[if lt IE 9]>
          <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
        <![endif]-->
    </head>
    
    <body>

        <div id="barra">
            <?php if($person):?>
                <span class="sastifactorio">Usuario : <b><?php echo htmlspecialchars($person->name)?></span>
                <span class="avatar" style="background-image:url(<?php echo $person->photo?>?sz=35)"></span>
                <span> <a href="?logout" class="logoutBoton">desconectar</a></span>
                
            <?php else:?>
                <a href="<?php echo $client->createAuthUrl()?>" class="loginboton">Inicia sesión</a>
            <?php endif;?>

        </div>
      
    </body>
</html>

Dentro del index encontramos el archivo de configuración, hemos agregado el estilo si el usuario inicia sesión grabamos los datos dentro de la tabla caso contrario solo pedimos el inicio de sesión es cuestión de como acomoden su estilo.
config.php

<?php

require_once 'include/google-api-php-client/apiClient.php';
require_once 'include/google-api-php-client/contrib/apiOauth2Service.php';
require_once 'include/idiorm.php';
require_once 'include/relativeTime.php';


session_name('nombre-sesion');
session_start();

//configuracion de host
$host = 'localhost';
$user = 'usuario';
$pass = 'clave';
$database = 'base de datos';

ORM::configure("mysql:host=$host;dbname=$database");
ORM::configure('username', $user);
ORM::configure('password', $pass);

ORM::configure('driver_options', array(PDO::MYSQL_ATTR_INIT_COMMAND => 'SET NAMES utf8'));

// LLenar con tus datos de Api console google

$redirect_url = ''; 
$client_id = '';
$client_secret = '';
$api_key = '';

estilo.css

Este es el estilo que le he dado lo podrás ver en el demo..

#barra{
    /*Altura y margen interno*/
    height: 40px;
    /*Fija*/
    position: fixed;
    top:0px;
    left:0px;
    right:0px;
    padding-top:10px;
    padding-left:20px;
    padding-right:20px;
    /*Capa, sobre todo*/
    background:#000;
}

#barra h1{
    font:36px 'Open Sans Condensed', sans-serif;
    color:#4a4a4a;
    text-align:center;
    margin-top:75px;
}

.loginboton {
    font-weight: bold;
    background: #4387FD;
    border: 1px solid #4387FD;
    line-height: 28px;
    padding: 0px 12px;
    border-radius: 2px;
    float:right;
    color:#FFF;
    text-decoration:none;

}
#barra .sastifactorio{
    font:15px 'Open Sans Condensed', sans-serif;
    color:#CCC;
    text-align:left;
}


#barra .avatar{
    background:url('img/avatar.jpg') no-repeat center bottom;
    width:30px;
    height:30px;
    display:block;
    float:right;
    border-radius:50%;
}


#barra .logoutBoton{
    background-color:#a3a3a3;
    box-shadow:0 -5px 2px #999 inset, 0 1px 1px #ccc;
    border:1px solid #999;
    color:#fff !important;
    font-weight:bold;
    display:inherit;
    width:60px;
    text-decoration:none;
    border-radius:3px;
    font-size:11px;
    padding:5px;
}

Descargar

Suerte y espero les sirva en algún proyecto

El administrador ha desactivado su demostración cualquier duda déjenos su comentario…

Visita nuestro nuevo Login Php Mysql Panel de Administración

  • Genaro Jimenez

    interesante pero no todos tienen google, ojala hotmail hiciera lo mismo

  • Juan Marcos Tripolone CorpInTe

    Warning: require(setup.php): failed to open stream: No such file or directory in /home/gopool/public_html/google-access/index.php on line 3

    Warning: require(setup.php): failed to open stream: No such file or directory in /home/gopool/public_html/google-access/index.php on line 3

    Fatal error: require(): Failed opening required ‘setup.php’ (include_path=’.:/usr/lib/php:/usr/local/lib/php’) in /home/gopool/public_html/google-access/index.php on line 3

    • No encuentra el archivo setup.php verifica que las rutas se encuentren indexadas correctamente…
      Adicional verifica si no existe una nueva versión de esta librería…

      • Juan Marcos Tripolone CorpInTe

        Hola Bloguero-ec ! Muchas gracias por tu amabilidad y tu pronta respuesta. Pero, de dónde saco el “setup.php”? No lo encuentro por ningún lado! :'(

        • Pues yo si lo veo tanto en la publicación como en la descarga…

Mas Publicaciones

Siguenos




Conviertase en Editor

Te gustaría ser editor en Bloguero-ec.? Escribe tutoriales referente a programación, diseño web, CSS, entre otros y deja tu marca personal en nuestro sitio, contáctanos y empieza a editar Ya..

Compartir..!

© Copyright 2017 Bloguero-ec - Derechos Reservados

A %d blogueros les gusta esto: