Configurazione dell'account di accesso esterno di Facebook in ASP.NET Core

Da Valeriy Novytskyy e Rick Anderson

Questa esercitazione con esempi di codice illustra come consentire agli utenti di accedere con il proprio account Facebook usando un esempio ASP.NET progetto Core creato nella pagina precedente. Per iniziare, creare un ID app Facebook seguendo i passaggi ufficiali.

Creare l'app in Facebook

• Aggiungere il pacchetto NuGet Microsoft.AspNetCore.Authentication.Facebook al progetto.

• Passare alla pagina dell'app Facebook Developers e accedere. Se non hai già un account Facebook, usa il collegamento Iscrizione a Facebook nella pagina di accesso per crearne uno. Dopo aver creato un account Facebook, seguire le istruzioni per registrarsi come sviluppatore di Facebook.

• Dal menu App personali selezionare Crea app. Viene visualizzato il modulo Crea un'app .

• Selezionare un tipo di app più adatto al progetto. Per questo progetto selezionare Consumer e quindi Avanti. Viene creato un nuovo ID app.

• Compilare il modulo e toccare il pulsante Crea app .

  

• Nella pagina Aggiungi prodotti alla tua app selezionare Configura nella scheda Di accesso di Facebook .

  

• Viene avviata la procedura guidata di avvio rapido con Choose a Platform (Scegli una piattaforma ) come prima pagina. Ignorare la procedura guidata per il momento facendo clic sul collegamento Accesso FaceBookImpostazioni nel menu in basso a sinistra:

  

• Viene visualizzata la pagina Impostazioni OAuth client :

  

• Immettere il tuo URI di sviluppo con /signin-facebook aggiunto nel campo URI di reindirizzamento OAuth validi (ad esempio: https://localhost:44320/signin-facebook). L'autenticazione di Facebook configurata più avanti in questa esercitazione gestirà automaticamente le richieste in /signin-facebook route per implementare il flusso OAuth.

• Selezionare Salva modifiche.

• Selezionare il link Impostazioni>Basic nel riquadro di navigazione a sinistra.

• Prendere nota di App ID e App Secret. Nella sezione successiva, integrerai entrambi nella tua applicazione ASP.NET Core.

• Quando si distribuisce il sito è necessario rivedere la pagina di configurazione dell'account di accesso di Facebook e registrare un nuovo URI pubblico.

Archiviare l'ID e il segreto dell'app Facebook

Archiviare impostazioni riservate, ad esempio l'ID app Facebook e i valori dei segreti con Secret Manager. Per questo esempio, seguire questa procedura:

1. Inizializzare il progetto per l'archiviazione privata in base alle istruzioni in Abilitare l'archiviazione privata.

2. Archiviare le impostazioni riservate nell'archivio segreto locale con le chiavi segrete Authentication:Facebook:AppId e Authentication:Facebook:AppSecret:

   dotnet user-secrets set "Authentication:Facebook:AppId" "<app-id>"
   dotnet user-secrets set "Authentication:Facebook:AppSecret" "<app-secret>"
   

Il separatore : non funziona con le chiavi gerarchiche delle variabili di ambiente in tutte le piattaforme. Ad esempio, il : separatore non è supportato da Bash. Il doppio carattere di sottolineatura, __, è:

• Supportato da tutte le piattaforme.
• Sostituito automaticamente da due punti, :.

Configurare l'autenticazione di Facebook

services.AddAuthentication().AddFacebook(facebookOptions =>
{
    facebookOptions.AppId = Configuration["Authentication:Facebook:AppId"];
    facebookOptions.AppSecret = Configuration["Authentication:Facebook:AppSecret"];
});

var builder = WebApplication.CreateBuilder(args);
var services = builder.Services;
var configuration = builder.Configuration;

services.AddAuthentication().AddFacebook(facebookOptions =>
    {
        facebookOptions.AppId = configuration["Authentication:Facebook:AppId"];
        facebookOptions.AppSecret = configuration["Authentication:Facebook:AppSecret"];
    });

L'overload AddAuthentication(IServiceCollection, String) imposta la proprietà DefaultScheme. L'overload AddAuthentication(IServiceCollection, Action<AuthenticationOptions>) consente di configurare le opzioni di autenticazione, che possono essere usate per configurare schemi di autenticazione predefiniti per scopi diversi. Le chiamate successive a AddAuthentication sostituiscono le proprietà AuthenticationOptions configurate in precedenza.

AuthenticationBuilder metodi di estensione che registrano un gestore di autenticazione possono essere chiamati una sola volta per ogni schema di autenticazione. Esistono sovraccarichi che consentono di configurare le proprietà dello schema, il nome dello schema e il nome visualizzato.

Accedere con Facebook

• Avvia l'applicazione e seleziona Accedi.
• In Usa un altro servizio per accedere selezionare Facebook.
• Si viene reindirizzati a Facebook per l'autenticazione.
• Immettere le credenziali di Facebook.
• Si viene reindirizzati di nuovo al sito in cui è possibile impostare il messaggio di posta elettronica.

L'accesso viene eseguito usando le credenziali di Facebook:

Reagire per annullare l'autorizzazione di accesso esterno

AccessDeniedPath può fornire un percorso di reindirizzamento all'agente utente quando l'utente non approva la richiesta di autorizzazione richiesta.

Il codice seguente imposta AccessDeniedPath su "/AccessDeniedPathInfo":

services.AddAuthentication().AddFacebook(options =>
{
    options.AppId = Configuration["Authentication:Facebook:AppId"];
    options.AppSecret = Configuration["Authentication:Facebook:AppSecret"];
    options.AccessDeniedPath = "/AccessDeniedPathInfo";
});

È consigliabile che la AccessDeniedPath pagina contenga le informazioni seguenti:

• L'autenticazione remota è stata annullata.
• Questa app richiede l'autenticazione.
• Per tentare nuovamente l'accesso, selezionare il link di accesso.

Test AccessDeniedPath

• Vai su facebook.com
• Se si è connessi, è necessario disconnettersi.
• Eseguire l'app e selezionare Accesso a Facebook.
• Selezionare Non ora. Si viene reindirizzati alla pagina specificata AccessDeniedPath .

Inoltrare le informazioni della richiesta tramite un proxy o un bilanciatore di carico

Se l'app viene distribuita dietro un server proxy o un servizio di bilanciamento del carico, alcune delle informazioni di richiesta originali potrebbero essere inoltrate all'app nelle intestazioni della richiesta. Queste informazioni in genere includono lo schema di richiesta sicura (https), l'host e l'indirizzo IP client. Le app non leggono automaticamente queste intestazioni di richiesta per individuare e usare le informazioni di richiesta originali.

Lo schema viene usato nella generazione di collegamenti che influisce sul flusso di autenticazione con provider esterni. La perdita dello schema sicuro (https) fa sì che l'app generi URL di reindirizzamento non sicuri e non corretti.

Utilizzare il middleware delle intestazioni inoltrate per rendere disponibili le informazioni della richiesta originale all'applicazione per l'elaborazione delle richieste.

Per altre informazioni, vedere Configurare ASP.NET Core per l'utilizzo di server proxy e servizi di bilanciamento del carico.

Per altre informazioni sulle opzioni di configurazione supportate dall'autenticazione di Facebook, vedere le informazioni di riferimento sulle FacebookOptions API. Le opzioni di configurazione possono essere usate per:

• Richiedere informazioni diverse sull'utente.
• Aggiungi parametri di stringa di query per personalizzare l'esperienza di accesso.

Risoluzione dei problemi

• solo ASP.NET Core 2.x: Se Identity non è configurato chiamando services.AddIdentity in ConfigureServices, il tentativo di autenticazione comporterà ArgumentException: è necessario specificare l'opzione 'SignInScheme'. Il modello di progetto usato in questa esercitazione garantisce che questa operazione venga eseguita.
• Se il database del sito non è stato creato applicando la migrazione iniziale, si ottiene Un'operazione di database non è riuscita durante l'elaborazione della richiesta errore. Toccare Applica migrazioni per creare il database e aggiorna la pagina per superare l'errore.

Passaggi successivi

• Questo articolo ha illustrato come eseguire l'autenticazione con Facebook. È possibile seguire un approccio simile per l'autenticazione con altri provider elencati nella pagina precedente .

• Dopo aver pubblicato il sito Web nell'app Web di Azure, è necessario reimpostare nel AppSecret portale per sviluppatori di Facebook.

• Impostare Authentication:Facebook:AppId e Authentication:Facebook:AppSecret come impostazioni dell'applicazione nel portale di Azure. Il sistema di configurazione è configurato per leggere le chiavi dalle variabili di ambiente.

Risorse aggiuntive

Vari provider di autenticazione