¡Bienvenido! ¿Aún no estás registrado?, deberás registrarte antes de poder usar el Chat, Comentar y Descargar en el Foro. Usa un email válido para la activación.
Calificación:
  • 0 voto(s) - 0 Media
  • 1
  • 2
  • 3
  • 4
  • 5

COMPLEMENTOS [MOD] Identificación con RRSS
#1

4
Mejor respuesta del mensaje [MOD] Identificación con RRSSPedido: Debes agradecer para ver el contenido...
Autor: Debes agradecer para ver el contenido...
 
Identificación con RRSS

Bueno, en realidad es algo que había creado para ZCode, lo pude haber hecho con alguna librería php para facilitarlo, pero como solamente requeria algunos servicios, poner un monton de archivos para no usarlo, se me hacia una perdida de recursos innecesarios, por lo cual he decidido dejar: Google, Discord, Github y Facebook.

A este 'MOD' lo hice para ZCode, por lo cual algunas cosas deberán adaptarlos ustedes a su tema, como por ejemplo la configuración de las redes sociales.

Solo colocaré enlaces de youtube para obtener las claves de cada uno, ya que se convertiría en un tutorial demasiado extenso.

Google: Debes agradecer para ver el contenido... (Min. 12:49)
Twitter: Debes agradecer para ver el contenido... (Min. 26:03) [sin uso, por el momento]
Facebook: Debes agradecer para ver el contenido... (Min. 32:07)
Discord: Debes agradecer para ver el contenido... (Hasta el min 02:05)
Github: Debes agradecer para ver el contenido...

En el servidor de discord accediendo a Debes agradecer para ver el contenido... tendrás las formas de obtener las claves en modo guía, solo los pasos sin imágenes (y también están fijados en el canal "#actualizaciones")

Lo que realmente necesitaremos usar es Client-ID, Client-Secret y en RedirectURL/Callback le colocarás la url que da la administración de tu sitio.

1 - Ejecutar las siguentes consultas
 
CREATE TABLE IF NOT EXISTS `miembros_social` (
`
social_idint(11NOT NULL AUTO_INCREMENT,
`
social_user_idint(11NOT NULL DEFAULT 0,
`
social_namevarchar(20NOT NULL DEFAULT '',
`
social_nickvarchar(24NOT NULL DEFAULT '',
`
social_emailvarchar(80NOT NULL DEFAULT '',
PRIMARY KEY (`social_id`)
ENGINE=MyISAM DEFAULT CHARSET=latin1 AUTO_INCREMENT=;

CREATE TABLE IF NOT EXISTS `settings_social` (
`
social_idint(11NOT NULL AUTO_INCREMENT,
`
social_namevarchar(22NOT NULL DEFAULT '',
`
social_client_idtinytext NULL,
`
social_client_secrettinytext NULL,
`
social_redirect_uritinytext NULL,
PRIMARY KEY (`social_id`)
ENGINE=MyISAM DEFAULT CHARSET=utf8 AUTO_INCREMENT=


2 - Agregar en .htaccess debajo de
 
RewriteRule ^agregar.phpinc/php/agregar.php [QSA,L

añadir esto
 
# CALLBACK PARA REDES SOCIALES
RewriteRule ^(github|discord|google|facebook|twitter)\.phpinc/callback/$1.php [QSA,L


3 - Agregar en header.php debajo de
 
$smarty->assign('tsConfig'$tsCore->settings); 

esto
 
$smarty->assign('SocialMager'$tsCore->OAuth()); 


4 - Ir a inc/class/c.core.php y arriba de la última llave } agregan lo siguiente
 
    public function getEndPoints(string $social ''string $type '') {
        
$getEndPoints = [
            
'github' => [
                
'authorize' => 'Registrate o inicia tu sesión para ver este contenido
                '
token' => "Registrate o inicia tu sesión para ver este contenido",
                '
revoke' => "",
                '
user' => "Registrate o inicia tu sesión para ver este contenido",
                '
scope' => "user"
            ],
            '
discord' => [
                '
authorize' => 'Registrate o inicia tu sesión para ver este contenido
                
'token' => "Registrate o inicia tu sesión para ver este contenido",
                
'revoke' => "Registrate o inicia tu sesión para ver este contenido",
                
'user' => "Registrate o inicia tu sesión para ver este contenido@me",
                
'scope' => "email identify"
            
],
            
'google' => [
                
'authorize' => 'Registrate o inicia tu sesión para ver este contenido
                '
token' => "Registrate o inicia tu sesión para ver este contenido",
                '
user' => "Registrate o inicia tu sesión para ver este contenido",
                '
revoke' => "",
                '
scope' => "Registrate o inicia tu sesión para ver este contenido Registrate o inicia tu sesión para ver este contenido"
            ],
            '
facebook' => [
                '
authorize' => "Registrate o inicia tu sesión para ver este contenido",
                '
token' => "Registrate o inicia tu sesión para ver este contenido",
                '
revoke' => "",
                '
user' => "Registrate o inicia tu sesión para ver este contenido",
                '
scope' => "email,public_profile"
            ]
        ];
        return $getEndPoints[$social][$type];
    }

    /**
     * Genera URLs de autorización OAuth para diferentes proveedores sociales.
     *
     * @return array Un array asociativo con el nombre del proveedor como clave y la URL de autorización como valor.
     */
    public function OAuth(string $redirect = ''): array {
       // Obtener la lista de proveedores OAuth
       $OAuths = result_array(db_exec([__FILE__, __LINE__], '
query', 'SELECT social_namesocial_client_idsocial_client_secretsocial_redirect_uri FROM settings_social'));
       $routes = [];
        
       foreach ($OAuths as $auth) {
          // Preparar los parámetros para la solicitud OAuth
          $parameters['
client_id'] = $auth['social_client_id'];
          $parameters['
scope'] = $this->getEndPoints($auth['social_name'], 'scope');
          $parameters['
response_type'] = ($auth['social_name'] === 'github') ? '' : 'code';
          $parameters['
redirect_uri'] = $auth['social_redirect_uri'];
          // Eliminar el parámetro response_type si es '
github'
          if ($auth['
social_name'] === 'github') {
             unset($parameters['
response_type']);
          }
          if(in_array($auth['
social_name'], ['google', 'discord'])) {
                $parameters['
prompt'] = 'consent';
            }
          // Construir la URL de autorización
          $queryString = http_build_query(array_filter($parameters));
          $authorizeUrl = $this->getEndPoints($auth['
social_name'], 'authorize');
          $routes[$auth['
social_name']] = "$authorizeUrl?$queryString";
       }
       return $routes;
    } 


5 - Ir a inc/class/c.cuenta.php y justo debajo de
 
class tsCuenta 

agregan
 
    private function getSocialUser(int $user_id 0) {
        
// Redes viculadas
        
$socials result_array(db_exec([__FILE____LINE__], 'query'"SELECT social_name as name FROM miembros_social WHERE social_user_id = $user_id"));
        
$array_social = [
            
'discord' => false,
            
'facebook' => false,
            
'github' => false,
            
'google' => false
        
];
        foreach(
$socials as $sn) {
            
$name $sn['name'];
            if (isset(
$array_social[$name])) {
                
$array_social[$name] = true;
            }
        }
        return 
$array_social;
    } 

Luego dentro de la función
 
public function loadPerfil($user_id 0){ 

buscar
 
$perfilInfo $this->unData($perfilInfo); 

y agregar debajo
 
$perfilInfo['socials'] = $this->getSocialUser($user_id); 


6 - Luego en inc/class/c.user.php y arriba de la funcion
 
public function loginUser(...) 

agregar lo siguiente
 
    /*
     * Desconectar la red social de nuestra cuenta
    */
    
public function unlinkAccount() {
        global 
$tsCore;
        
# Buscamos para desactivar
        
$delete $tsCore->setSecure($_POST['social']);
        if(
$this->is_member) {
            
$data db_exec('fetch_assoc'db_exec([__FILE____LINE__], 'query'"SELECT u.user_id, m.social_id, m.social_name FROM u_miembros AS u LEFT JOIN miembros_social AS m ON m.social_user_id = u.user_id WHERE u.user_id = {$this->uid} AND m.social_name = '$delete' LIMIT 1"));
            
$sid = (int)$data['social_id'];
            
// Actualizamos la tabla
            
return (db_exec([__FILE____LINE__], 'query'"DELETE FROM miembros_social WHERE social_id = $sid AND social_name = '$delete' AND social_user_id = {$this->uid}")) ? true false;
        }
    }
    
/**
     * Se repiten en 2 funciones diferentes
    */
    
public function sessionUpdate(int $id 0bool $rem true) {
        
// Actualizamos la session
        
$this->session->update($id$remTRUE);
        
$this->loadUser(true);
        
$this->DarMedalla();
    } 

luego buscar en la funcion
 
public function loginUser(...) 

buscamos
 
$this->session->update($data['user_id'], $rememberTRUE);
$this->loadUser(true);
$this->DarMedalla(); 

y reemplazamos
 
$this->sessionUpdate($data['user_id'], $remember); 


7 - Ir a inc/php/admin.php y arriba de
 
} elseif($action == 'configs'){ 

añadir
 
    // Redes sociales
    
} elseif($action === 'socials') {
        
// CLASE MEDAL
        
require_once TS_CLASS "c.socials.php";
        
$tsSocials = new tsSocials();
        
$smarty->assign('tsNetsSocials', [
            
'discord' => 'Discord',
            
'facebook' => 'Facebook',
            
'github' => 'Github',
            
'google' => 'Google'
        
]);
        
//
        
$tsTitle 'Configurar redes sociales';
        if(empty(
$act)) $smarty->assign('tsSocials'$tsSocials->getSocials());
        
// Editar o Nuevo tema
        
elseif(in_array($act, ['editar''nueva'])) {
            
$tsTitle ucfirst($act) . ' red social';
            if(!empty(
$_POST['save']) OR !empty($_POST['edit'])) {
                
$social = ($act === 'editar') ? $tsSocials->saveSocial() : $tsSocials->newSocial();
                if(
$social$tsCore->redirectTo($tsCore->settings['url'].'/admin/socials?save=true');
            } else {
                if(
$act === 'editar'$smarty->assign("tsSocial"$tsSocials->getSocial());
                if(
$act === 'nuevo'$smarty->assign("tsError"$tsSocials->newSocial());
            } 
        } elseif(
$act === 'borrar') {
            if(
$tsSocials->eliminarRed()) $tsCore->redirectTo($tsCore->settings['url'].'/admin/socials?save=true');
        } 


8 - Ir a themes/TUTEMA/js/admin.js y agregar al final
 
$(document).ready(() => {
    
let redirectURI = $('#redirect_uri');
    if(empty(
redirectURI.val())) redirectURI.val(`${global_data.url}/discord.php`)
   $(
'#social_name').on('change', () => {
       
let replace = $('#social_name option:selected').val() ;
       
redirectURI.val(`${global_data.url}/${replace}.php`);
   });
   $(
"#botonCopiar").on("click", function() {
      
redirectURI.select();
      
document.execCommand("copy");
      
window.getSelection().removeAllRanges();
      $(
this).html("Redirect URL ha sido copiado correctamente!");
      
setTimeout(() => $(this).html('Copiar'), 5000);
   });
}); 


9 - Ir a themes/TUTEMA/js/cuenta.js al principio o final (donde quieran) agregan
 
function desvincular(social) {
    $.
post(`${global_data.url}/cuenta-desvincular.php`, { social }, req => {
        if(
req) {
            
mydialog.show();
            
mydialog.title('Bien');
            
mydialog.body('Ha sido desvinculado correctamente.');
            
mydialog.buttons(truetrue'Listo''mydialog.close();'truetruefalse);
            
mydialog.center();
        }
    });



10 - Ir a themes/TUTEMA/sections/main_header.tpl y arriba de
 
<link href="{$tsConfig.tema.t_url}/estilos.css" rel="stylesheet" type="text/css"

esto
 
<link href="{$tsConfig.tema.t_url}/socialButton.css" rel="stylesheet" type="text/css"


11 - Ir a themes/TUTEMA/templates/t.admin.tpl y debajo de
 
{include file='admin_mods/m.admin_configs.tpl'

agregar
 
{elseif $tsAction == 'socials'}
{include 
file='admin_mods/m.admin_socials.tpl'


12 - Ir a themes/TUTEMA/templates/admin_mods/m.admin_sidebar.tpl y debajo de
 
<li id="a_creditos"><span class="cat-title"><a href="{$tsConfig.url}/admin/creditos">Soporte y Cr&eacute;ditos</a></span></li

añadir
 
<li id="a_socials"><span class="cat-title"><a href="{$tsConfig.url}/admin/socials">Configurar redes</a></span></li


13 - Ir a themes/TUTEMA/template/modules/m.cuenta_sidebar.tpl (agregalo donde quieras)
 
<div class="">
    <
h4>Tus redes sociales</h4>
    {foreach 
from=$SocialMager key=nombre item=social}
       <
div class="btn-group-socials d-block">
             <
class="btn btn--{$nombre}href="{if $tsPerfil.socials.$nombre}javascript:desvincular('{$nombre}'){else}{$social}{/if}">
                 <
span class="btn--icon"><span class="icon_social icon_{$nombre}"></span></span>
                <
span class="btn--text">{if $tsPerfil.socials.$nombre}Desv{else}V{/if}incular {$nombre}</span>
             </
a>
       </
div>
    {
foreachelse}
        <
div class="empty">Conexiones a tus redes socialespero aun {$tsConfig.titulono las ha configurado!</div>
    {/foreach}
</
div


14 - Ir a themes/TUTEMA/template/t.login.tpl añaden, ya que con esto podrán iniciar sesión desde alguna red social
 
{if $SocialMager}
    <
div class="buttons-social">
        {foreach 
from=$SocialMager key=nombre item=social}
            <
class="btn btn--{$nombre} btn--only-icon btn-active" href="{$social}">
                <
span class="btn--icon"><span class="icon_social icon_{$nombre}"></span></span>
                <
span class="btn--text">Iniciar con {$nombre}</span>
            </
a>
        {/foreach}
    </
div>
{/if} 


15 - Ir a themes/TUTEMA/template/t.registro.tpl añaden, ya que con esto podrán crear cuenta desde alguna red social
 
{if $SocialMager}
    <
div class="buttons-social">
        {foreach 
from=$SocialMager key=nombre item=social}
            <
class="btn btn--{$nombre} btn--only-icon btn-active" href="{$social}">
                <
span class="btn--icon"><span class="icon_social icon_{$nombre}"></span></span>
                <
span class="btn--text">Crear cuenta con {$nombre}</span>
            </
a>
        {/foreach}
    </
div>
{/if} 


En el punto 14 y 15 tiene la clase 'btn--only-icon', el cual claramente muestra solo el icono, si quieren visualizar el texto deberán borrar dicha clase

Debes agradecer para ver el contenido...
c.socials.php en inc/class/
m.admin_socials.tpl en themes/TUTEMA/templates/admin_mods
socialButtons.css en themes/TUTEMA/

Accede al servidor de Discord y descarga ZCode
Responder
#2

0
Ha quedado genial en Crapeando Big Grin
Responder


Compartir en:

Salto de foro:


Usuarios navegando en este tema: 1 invitado(s)