コメント機能を実装するのは意外に大変です。
コメント機能と一言で言ってもコメントに対して返信できるようにするかといった仕様部分を決めたり、
返信がある場合はUIをどうするのかといったことも検討しないといけません。
そこでDISQUSというサービスを使って簡単にコメント機能を実装してみました。
このブログの各記事の一番最後にあるコメント機能がそれです。
上記のようなコメント欄がこのくらいのコードで実装できます。
こんな人にオススメ
- Railsで作成したWebサービスにコメント機能をつけたい人
DISQUS
ひとことで言うと「いい感じのコメント欄を提供してくれるサービス」です。
SNSのような仕組みもあるので気になる方はDISQUSのページを見てみてください。
https://disqus.com/
https://help.disqus.com/customer/en/portal/articles/466179-what-is-disqus-
コメント欄を実装する
アカウントを作成する
コメントを追加するサイトを登録する
ログイン後に以下の管理画面に入った後で New をクリックしてサイトを登録します。
ここで必要事項を入力してください。
I don't see my platform listed, install manually with をクリックして次へ。
右下にconfigure ボタンがあるのでクリック。
あとから 1. Place the following code where you'd like Disqus to load: のコードは使います。
実装
DISQUS用のパーシャルを作成してそれを呼び出しているだけです。
説明するよりもコードを見た方が早いと思うので以下のプルリクを参考にしてください。
このプルリクは以下の点が微妙です。
-
hamlを使用しているのにここだけerbを使っているところ
jsファイルを追加するのが面倒でerbにscriptタグを書いてしまいました。 -
disqusの設定をしていないところ
動作上は問題ないのですが、disqusにおすすめされている設定をしていません。
/**
* RECOMMENDED CONFIGURATION VARIABLES: EDIT AND UNCOMMENT THE SECTION BELOW TO INSERT DYNAMIC VALUES FROM YOUR PLATFORM OR CMS.
* LEARN WHY DEFINING THESE VARIABLES IS IMPORTANT: https://disqus.com/admin/universalcode/#configuration-variables*/
/*
var disqus_config = function () {
this.page.url = PAGE_URL; // Replace PAGE_URL with your page's canonical URL variable
this.page.identifier = PAGE_IDENTIFIER; // Replace PAGE_IDENTIFIER with your page's unique identifier variable
};
*/
page.shortnameやpage.titleもあるようですが、調べてないので設定は省きました。
参考
DISQUSの説明だけでも理解できましたが、先にこの記事をみておけば良かったです。
http://blog.nrowegt.com/how-to-add-disqus-comments-to-a-rails-5-application/
DISQUSを簡単に導入するためのGemです。
https://github.com/sandric/disqus_rails
以下のような理由で今回は使いませんでした。
- Rails5に対応しているかわからない
- star数があまり多くなく、コミットなどを見てもアクティブじゃない