2017年 11月 の投稿一覧

先日から試行錯誤していた内容のまとめ。

いまloopback.ioを利用してAPIを作ることに取り組んでいるのだけれども、frameworkが提供するユーザ認証の仕組み(メールアドレス及びパスワード)だけではなく、Node.js向けの認証ミドルウェアであるPassportを利用して他の認証機構を利用しようという取り組み。

loopback + passport でfacebookやtwitterのアカウントを利用したソーシャルログインの話題は散見するのだけれども、passport-slackを使ってloopbackフレームワークで作成するプロジェクトでのユーザ認証をする話をあまりみかけず、あれこれ試行錯誤した...。

基本的にloopbackプロジェクトが用意しているpassportを利用したユーザ認証のサンプルが以下にあるのでこれに倣えばよい。

github.com

ただサンプルと作り始めているプロジェクトの差分がどこなのだ問題がはっきりせず苦労したので、主に差分を中心にまとめます。

大前提

https://api.slack.com/apps を開いてユーザ認証に使いたいアプリケーションの情報を追加する。

Redirect URIにローカルで開発する用に http://localhost:5000/auth/slack/callback といった形で登録しておく。併せてApp Credentials から Client ID と Client Secret を控えておいて、.env に以下の様な形で書いておく。

SLACK_CLIENT_ID=12345.6789
SLACK_CLIENT_SECRET=xxxyyyzzz

passportでユーザ認証させるために必要なnpmパッケージを導入

先のサンプルで加えられているnpmパッケージと、Slackログインさせるためのpassport-slackをインストールする。

$ npm install --save connect-ensure-login
$ npm install --save cookie-parser
$ npm install --save express-flash
$ npm install --save express-session
$ npm install --save loopback-component-passport
$ npm install --save loopback-passport
$ npm install --save passport-slack

passportが各種情報を収めるモデルを用意する

https://github.com/strongloop/loopback-example-passport で追加されてるモデルを追記する。

• common/models/access-token.json
• common/models/user-credential.json
• common/models/user-identity.json

上のモデルをloopbackがデフォルトで作成するUserモデルに紐付ける

common/models/user.json

{
"name": "user",
"plural": "users",
"base": "User",
"properties": {},
"validations": [],
"relations": {
"accessTokens": {
"type": "hasMany",
"model": "accessToken",
"foreignKey": "userId"
},
"identities": {
"type": "hasMany",
"model": "userIdentity",
"foreignKey": "userId"
},
"credentials": {
"type": "hasMany",
"model": "userCredential",
"foreignKey": "userId"
}
},
"acls": [],
"methods": {}
}

上の一通りのモデルの設定を server/model-config.json に追記する。

 {
"_meta": {
"sources": [
"loopback/common/models",
"loopback/server/models",
"../common/models",
"./models",
+      "./node_modules/loopback-component-passport/lib/models"
],
"mixins": [
"loopback/common/mixins",
"loopback/server/mixins",
"../common/mixins",
"./mixins"
]
},
"User": {
"dataSource": "db",
"public": false
},
"AccessToken": {
"dataSource": "db",
"public": false
},
+  "userCredential": {
+    "dataSource": "db",
+    "public": false
+  },
+  "userIdentity": {
+    "dataSource": "db",
+    "public": false
+  },

server/server.js に追記

loopbackのcliツールであるlbコマンドで作ったプロジェクトでデフォルトで作成されたファイルをサンプルのものに置き換える。

• server/server.js

ここで今回自分は設定ファイルをJSONではなくてJSで取る様にしたので以下の様に修正した。(.envからOAuthのパラメータ取ってもらいたかったので)

var config = {};
try {
config = require('../providers.js');  // JSにしただけ
} catch (err) {
console.trace(err);
process.exit(1); // fatal
}

Slackログイン用の各種情報を書いたproviders.js を置く

.env に記載したClient IDとClient Secretが差し込まれる様にしている。

module.exports = {
"slack-login": {
"provider": "slack",
"module": "passport-slack",
"clientID": process.env.SLACK_CLIENT_ID,
"clientSecret": process.env.SLACK_CLIENT_SECRET,
"authPath": "/auth/slack",
"callbackURL": "/auth/slack/callback",
"callbackPath": "/auth/slack/callback",
"successRedirect": "/",
"failureRedirect": "/signin",
"scope": ["identity.basic", "identity.email", "identity.avatar", "identity.team"],
"failureFlash": true
}
};

ここまでできたらloopbackのプロジェクト立ち上げて /auth/slack にアクセスすると一度Slackへ遷移したのち認証に成功するとコールバックしてくるのが確認できる。