ASP.NET CoreのFacebook認証 - tekitoumemo’s diary

f:id:tekitoumemo:20190105232452p:plain
前回、外部ログインのセットアップまでは説明したので今回はFacebook認証の追加だけです。

tekitoumemo.hatenablog.com

よく個人でサイトを作っている人を見るとFacebookは実装されてないことをよく見るのですが、ここは詰まる人が多いと思います。

前準備

Facebook for Developersでアプリを作成します。これもだいたい以下のURLに書いてます。
docs.microsoft.com

ここも基本的には「/signin-facebook」でcallback Urlを設定してください。
f:id:tekitoumemo:20190105232736p:plain
アプリIDとapp secretを取得しておいてください。

※Facebookはhttpsのみ対応しています。ssl入れてない人はあきらめましょう

Startupに登録

ConfigureServicesに以下を追加

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

複数のSNSログインを実装している場合は以下のようにメソッドチェーンで実装出来ます。

services.AddAuthentication()
    .AddMicrosoftAccount(microsoftOptions => { ... })
    .AddGoogle(googleOptions => { ... })
    .AddTwitter(twitterOptions => { ... })
    .AddFacebook(facebookOptions => { ... });

Viewを作成

// これか
<a asp-action="SignIn" asp-route-provider ="Facebook">Facebook</a>
// これでもおけ
<a href="/auth/signin?provider=Facebook">Facebook</a>

これで前回のTwitterの記事と同じ要領で実装終了です。

本番だと動かない！

テストだと動くのですが、本番だと動きませんでした。要因はいくつかあると思うのですが、僕の場合はRedirectUrlがhttpで403になったことが原因でした。F12で調べてみてください。添付した画像はhttpsですが、403の場合httpになっている可能性があります。
f:id:tekitoumemo:20190105233552p:plain
「なんだよこれ」と思って自力でOAuthを実装しようかと思って気がつきました。

リクエストをhttpsにする

app.Use((context, next) =>
{
    context.Request.Scheme = "https";
   return next();
});

これ以外にも以下の対処法があるみたいです。

app.UseForwardedHeaders(new ForwardedHeadersOptions
{
     ForwardedHeaders = ForwardedHeaders.XForwardedFor | ForwardedHeaders.XForwardedProto
});
app.UseHttpMethodOverride();

これはKestrelとリバプロが関係しているからXForwardedForで対処できるのかよくわかりません。よくわからなかったのでhttpsに変換する方法で対応しました（全部httpsでも困らないし）これがnginxだけなのかよくわかりません。

おそらくこれを対処しないとGoogleも出来ないですし、いつかTwitterもダメになっちゃうので気づいてよかったです。