MemberSpace でコメントを追加する
FastComments を MemberSpace と組み合わせることで、会員限定のコメント機能を設定できます。
また、ユーザーがログインしているときに必要に応じて匿名でのコメントを許可することもでき、さらに ユーザーの会員資格に基づくカスタムバッジを設定することさえできます！
コード 
小さなコードスニペットで、FastCommentsとMemberSpaceを簡単に接続できます:
FastComments MemberSpace Snippet
Copy 
1
2<script src="https://cdn.fastcomments.com/js/embed-v2.min.js"></script>
3<div id="fastcomments-widget"></div>
4<script>
5 (function () {
6 const tenantId = 'demo';
7 const ALLOW_ANON = false;
8 const LOGIN_URL = 'https://example.com/login';
9 const PLAN_DISPLAY_LABELS = {
10 'VIP Plan': 'VIP'
11 };
12 let lastInstance;
13
14 function tick() {
15 if (!window.MemberSpace) {
16 return setTimeout(tick, 100);
17 }
18 if (!window.FastCommentsUI) {
19 return setTimeout(tick, 100);
20 }
21 const target = document.getElementById('fastcomments-widget');
22 if (!target) {
23 return setTimeout(tick, 100);
24 }
25 const data = MemberSpace.getMemberInfo();
26 if (data.isLoggedIn && data.memberInfo) {
27 lastInstance = FastCommentsUI(target, {
28 tenantId: tenantId,
29 urlId: window.location.pathname,
30 simpleSSO: {
31 displayLabel: getDisplayLabel(data.memberInfo),
32 username: data.memberInfo.name,
33 email: data.memberInfo.email,
34 avatar: data.memberInfo.profileImageUrl
35 }
36 });
37 } else if (lastInstance) {
38 lastInstance.destroy();
39 lastInstance = FastCommentsUI(target, {
40 tenantId: tenantId,
41 urlId: window.location.pathname,
42 simpleSSO: getAnonSSOConfig()
43 });
44 }
45 }
46
47 function getAnonSSOConfig() {
48 if (ALLOW_ANON) {
49 return undefined;
50 }
51 return {
52 loginURL: LOGIN_URL
53 };
54 }
55
56 function getDisplayLabel(memberInfo) {
57 if (!memberInfo.memberships) {
58 return;
59 }
60 for (const membership of memberInfo.memberships) {
61 const label = PLAN_DISPLAY_LABELS[membership.name];
62 if (label) {
63 return label
64 }
65 }
66 }
67
68 tick();
69 })();
70</script>
71
ユーザーがMemberStack経由でログインした状態であなたのサイトやアプリケーションにアクセスすると、自動的にFastCommentsにログインし、そのコメントは
Verifiedとしてマークされます。
また、上記の例では、VIP Planという名前のサブスクリプションプランがある場合、ユーザー名の横にVIPバッジを表示します。例を編集して
プランを追加できます。ご質問がありましたらサポートにお問い合わせください。
匿名コメントを許可する
匿名コメントも許可したい場合は、ALLOW_ANONを次のようにtrueに設定します:
const ALLOW_ANON = true;また、https://example.com/loginを、ユーザーがLoginボタンをクリックしたときに移動させたい場所に変更することを忘れないでください:
この方法で、メンバーサイトにログインしていないユーザーも、名前とメールアドレスを入力してコメントするオプションが得られます。
ドメインエラー
次のような認証エラーが発生する場合があります:
Domain Configuration Missing
これは、FastCommentsがこのドメインでアカウントの使用を許可することを知らないためです。
この場合、修正は簡単です。FastComments.comアカウントにサイトを追加するだけです。
カスタマイズ
FastCommentsは、あなたのサイトに合わせてカスタマイズできるように設計されています。
カスタムスタイルを追加したり、設定を調整したい場合は、カスタマイズドキュメントをご覧ください。