SocialLogin

TsgcHTMLComponent_SocialLogin — um painel de botões de login social OAuth (Google, Facebook, Apple, GitHub, Microsoft, Twitter, LinkedIn ou personalizado) que constrói a URL de autorização de cada provedor, em Delphi, C++ Builder e .NET.

Visão geral

TsgcHTMLComponent_SocialLogin

Um componente de painel de botões que emite um botão Bootstrap com marca por provedor, cada um vinculando ao endpoint de autorização OAuth 2.0 daquele provedor. Adicione provedores, escolha um layout e então leia a propriedade HTML.

Classe do componente

TsgcHTMLComponent_SocialLogin

Renderiza

Painel de botões OAuth do Bootstrap 5

Família

Autenticação

Linguagens

Delphi, C++ Builder, .NET

QuickStart

Adicione provedores, renderize o painel

Chame AddProvider para cada provedor com seu client ID e URI de redirecionamento, defina o Layout e o divisor e então leia HTML. Cada botão vincula à URL de autorização do provedor.

uses
  sgcHTML_Enums, sgcHTML_Component_SocialLogin;

var
  oSocial: TsgcHTMLComponent_SocialLogin;
begin
  oSocial := TsgcHTMLComponent_SocialLogin.Create(nil);
  try
    oSocial.Title := 'Sign in';
    oSocial.Subtitle := 'Choose your login method';
    oSocial.Layout := slVertical;
    oSocial.ShowDivider := True;
    oSocial.DividerText := 'or continue with';

    oSocial.AddProvider(spGoogle, 'GOOGLE_CLIENT_ID',
      'https://app.acme.com/oauth/google');
    oSocial.AddProvider(spGitHub, 'GITHUB_CLIENT_ID',
      'https://app.acme.com/oauth/github');

    WebModule.Response := oSocial.HTML;   // branded OAuth buttons
  finally
    oSocial.Free;
  end;
end;

// Each item can build its own authorization URL:
vURL := oSocial.Providers.Items[0].GetAuthorizationURL;

// includes: sgcHTML_Enums.hpp, sgcHTML_Component_SocialLogin.hpp

TsgcHTMLComponent_SocialLogin *oSocial = new TsgcHTMLComponent_SocialLogin(NULL);
try
{
  oSocial->Title = "Sign in";
  oSocial->Subtitle = "Choose your login method";
  oSocial->Layout = slVertical;
  oSocial->ShowDivider = true;
  oSocial->DividerText = "or continue with";

  oSocial->AddProvider(spGoogle, "GOOGLE_CLIENT_ID",
    "https://app.acme.com/oauth/google", "");
  oSocial->AddProvider(spGitHub, "GITHUB_CLIENT_ID",
    "https://app.acme.com/oauth/github", "");

  String html = oSocial->HTML;   // branded OAuth buttons

  // Each item can build its own authorization URL:
  String url = oSocial->Providers->Items[0]->GetAuthorizationURL();
}
__finally
{
  delete oSocial;
}

using esegece.sgcWebSockets;

var social = new TsgcHTMLComponent_SocialLogin();
social.Title = "Sign in";
social.Subtitle = "Choose your login method";
social.Layout = TsgcHTMLSocialLoginLayout.slVertical;
social.ShowDivider = true;
social.DividerText = "or continue with";

social.AddProvider(TsgcHTMLSocialProvider.spGoogle, "GOOGLE_CLIENT_ID",
    "https://app.acme.com/oauth/google");
social.AddProvider(TsgcHTMLSocialProvider.spGitHub, "GITHUB_CLIENT_ID",
    "https://app.acme.com/oauth/github");

string html = social.HTML;   // branded OAuth buttons

// Each item can build its own authorization URL:
string url = social.Providers.Items[0].GetAuthorizationURL();

Referência

Principais propriedades & métodos

Os membros que você usa com mais frequência.

Provedores

AddProvider(aProvider, aClientID, aRedirectURI, aScope) adiciona um botão; Providers é a coleção TsgcHTMLSocialProviderItems que você também pode editar manualmente.

Tipos de provedor

O enum TsgcHTMLSocialProvider cobre spGoogle, spFacebook, spApple, spGitHub, spMicrosoft, spTwitter, spLinkedIn e spCustom.

Item por provedor

Cada item expõe Provider, ClientID, RedirectURI, Scope, AuthURL, State, ButtonText, IconURL e CustomColor; GetAuthorizationURL retorna a URL completa.

Cabeçalho & divisor

Title e Subtitle encabeçam o painel; ShowDivider e DividerText desenham a regra "ou continue com".

Layout & estilo

Layout escolhe slVertical ou slHorizontal; MaxWidth, ShowIcons, ButtonPadding e ButtonBorderRadius ajustam os botões.

Saída

HTML retorna o painel de botões; uma folha de estilos injetada adiciona o efeito de hover. Sirva-o ou atribua-o ao BodyContent de um template de página.

Recursos

Continue explorando

	Todos os Componentes sgcHTMLExplore a matriz completa de recursos com mais de 60 componentes.	Abrir
	Baixar Versão de Avaliação GratuitaA avaliação de 30 dias inclui os projetos de demonstração 60.HTML.	Abrir
	PreçosLicenças Single, Team e Site com código-fonte completo.	Abrir