メインコンテンツまでスキップ

snsモジュール:基本設定


概要

SNS連携を行うモジュールです。LINEアカウントによるソーシャルログインが可能です。
ソーシャルログインには、userモジュールの導入が必須です。


LINEサービスの事前準備

ソーシャルログイン機能を実装するにあたり、LINEの各種サービス設定を事前に進めておいてください。

LINEログインを始めよう(外部サイト)
https://developers.line.biz/ja/docs/line-login/getting-started/

  • ログイン設定をするLINEアカウント作成
  • プロバイダーの作成
  • LINEログインチャネルの作成

ソーシャルログイン機能の構築

SNSとユーザーシートの紐づけ(ソーシャルログイン定義)を設定した後、SNSログインボタンを設置するコンテンツにSNS変数を利用して記述します。
主な流れは、以下の4ステップです。

  1. LINE Developers:LINEログインチャネルの情報取得
  2. パレットCMS:ソーシャルログイン定義の設定
  3. LINE Developers:コールバックURLの設定
  4. パレットCMS:コンテンツの設定

LINE Developers:ログインチャネルの情報取得

LINE Developersの「コンソール」にログインし、連携するLINEログインチャネルを選択します。

LINEソーシャルログイン_LINE Developersコンソールログイン

チャネル基本設定から「チャネルID」と「チャネルシークレット」を控えておきます。

LINEソーシャルログイン_チャネル基本設定

パレットCMS:ソーシャルログイン定義の設定

ソーシャルログイン定義(登録)

パレットCMSのソーシャルログインを実装するシートに、SNS側の接続情報を定義します。

設定(歯車マーク)> SNS > ソーシャルログイン管理|ソーシャルログイン定義
LINEソーシャルログイン_ソーシャルログイン定義

「新規作成」からソーシャルログイン定義登録を行います。

LINEソーシャルログイン_ソーシャルログイン定義登録

定義名
接続するサービス名など、管理しやすい名称を設定します。

接続種別
LINEログインを選択します。

連携先
連携する(ソーシャルログイン機能を付加する)ユーザーシートを選択します。

ソーシャルログイン定義(編集)

基本情報登録後、「作成」を押下して、ソーシャルログイン定義の編集を行います。

ID
ソーシャルログイン定義のシステムIDが表示されています。
ユーザーログインコンテンツの記述に使用します。

コールバックURL
LINEログイン後に、ユーザーがリダイレクトされるURL「コールバックURL」を表示しています。
LINE Developersの設定で使用するため、控えておきます。

LINEソーシャルログイン_コールバックURL

定義名
設定した名称を確認します。

接続種別
LINEログインが表示されています。

連携先
選択したユーザーシートを確認します。

チャネルID
LINE Developers:ログインチャネルの情報取得で控えておいたチャネルIDを入力します。

チャネルシークレット
LINE Developers:ログインチャネルの情報取得で控えておいたチャネルシークレットを入力します。

LINEソーシャルログイン_ログインチャネル設定

ステータス
有効化します。

「更新」を押下して、設定を完了します。
設定した定義の編集は、ソーシャルログイン定義一覧のえんぴつマークから行います。

LINEソーシャルログイン_ソーシャルログイン定義一覧

LINE Developers:コールバックURLの設定

LINE Developersコンソールに戻り、ログインチャネル | LINEログイン設定 に、パレットCMSから取得したコールバックURLを設定します。

LINEソーシャルログイン_コールバックURL設定

パレットCMS:コンテンツの設定

ソーシャルログインボタンを設置するコンテンツに、ソーシャルログイン変数を設置します。
詳細は、サンプルコードのSNS:ソーシャルログインで解説します。