LoginSignup
1
1

More than 3 years have passed since last update.

@PKunito

無料のLiveChat（LiveHelperChat）をEC2で動かしてみる

Last updated at Posted at 2018-11-27

こちらの内容はブログに公開しています。

LiveChatを導入を検討したときに、有料版もいくつかあったのですがなるべくコストをかけたくなかったので無料版がないか探してみたらLiveHelperChatというものをみつけました。

demoを見てもLiveChatで必要そうな機能は一通り用意されているようなので実際にEC2を使って導入をしてみました。

EC２の環境を構築

環境構築

EC2のインスタンスを作成して、パッケージを最新にする

$ sudo yum update -y

日付をJSTに設定する

日付を確認するとUTCとなっているので、JSTに変更します

$ date
2018年  9月 19日 水曜日 02:27:42 UTC

タイムゾーンの設定
$ sudo cp /etc/localtime /etc/localtime.org
$ sudo ln -sf  /usr/share/zoneinfo/Asia/Tokyo /etc/localtime
$ sudo cp /etc/sysconfig/clock /etc/sysconfig/clock.org

再起動で戻らないように設定する
# sudo vi /etc/sysconfig/clock
ZONE="Asia/Tokyo"
UTC=false

確認するとJSTに変わっています。
$ date
Tue Oct 31 11:56:35 JST 2017
$ strings /etc/localtime
TZif2
TZif2
JST-9

・反映をさせるためにrebootします。
$ sudo reboot

・swapの設定


laravelインストール時にt2-minerだとメモリ不足でエラーになりますのでswapを設定していきます。

確認するとswapがないようです。（EC2はswapが設定されていません）

$ grep Mem /proc/meminfo
MemTotal:        1009420 kB
MemFree:          847152 kB
MemAvailable:     836316 kB

$ grep Swap /proc/meminfo
SwapCached:            0 kB
SwapTotal:             0 kB
SwapFree:              0 kB

$ free
             total       used       free     shared    buffers     cached
Mem:       1009420     161640     847780         60       8656      98424
-/+ buffers/cache:      54560     954860
Swap:            0          0          0

512MBのスワップを作成していきます
$ sudo dd if=/dev/zero of=/swapfile1 bs=1M count=512
512+0 レコード入力
512+0 レコード出力
536870912 バイト (537 MB) コピーされました、 5.02482 秒、 107 MB/秒

・確認
$ ll /swapfile1
-rw-r--r-- 1 root root 536870912  9月 18 11:56 /swapfile1

・スワップファイルの権限を変更し、フォーマットをする
$ sudo chmod 600 /swapfile1
$ sudo mkswap /swapfile1
スワップ空間バージョン1を設定します、サイズ = 524284 KiB
ラベルはありません, UUID=9b98d845-40f9-4944-a07b-88dd082a2439

・swapファイルを有効化
$ sudo swapon /swapfile1
$ sudo swapon -s
Filename                Type        Size    Used    Priority
/swapfile1                              file    524284  0   -2

・システムリブートでswapファイルが反映するように設定
# sudo cp -p /etc/fstab /etc/fstab.org

sudo sh -c "echo '/swapfile1 swap swap defaults 0 0' >> /etc/fstab"

cat /etc/fstab

LABEL=/     /           ext4    defaults,noatime  1   1
tmpfs       /dev/shm    tmpfs   defaults        0   0
devpts      /dev/pts    devpts  gid=5,mode=620  0   0
sysfs       /sys        sysfs   defaults        0   0
proc        /proc       proc    defaults        0   0
/swapfile1  swap        swap    defaults        0   0

swapが設定できたことを確認します。
$ grep Mem /proc/meminfo
MemTotal:        1009432 kB
MemFree:          307224 kB
MemAvailable:     828360 kB
$ grep Swap /proc/meminfo
SwapCached:            0 kB
SwapTotal:        524284 kB
SwapFree:         524284 kB
$ free
             total       used       free     shared    buffers     cached
Mem:       1009432     702208     307224         60       9164     625360
-/+ buffers/cache:      67684     941748
Swap:       524284          0     524284

Apache、PHP、MySQLのインストール


sudo yum install -y httpd24 php72 mysql57-server php72-mbstring php72-pdo php72-mysqlnd

ドキュメントルートの権限を設定


apacheのドキュメントルート（/var/www）はrootが所有しているためec2-userで使用できるように設定をします。

apacheグループにec2-userを追加します。

$ sudo usermod -a -G apache ec2-user
$ exit

一度ログアウトをして反映させます。
$ exit

再ログインして、apacheグループが設定されているかを確認します。
$ groups
ec2-user wheel apache

/var/www/のグループ所有権をapacheグループに変更する
$ sudo chown -R ec2-user:apache /var/www

グループの書き込み権限を追加とサブディレクトリにグループIDを設定する
$ sudo chmod 2775 /var/www
$ find /var/www -type d -exec sudo chmod 2775 {} \;
$ find /var/www -type f -exec sudo chmod 0664 {} \;

composerのインストール


$ cd ~
$ curl -sS https://getcomposer.org/installer | sudo php
All settings correct for using Composer
Downloading...

Composer (version 1.7.3) successfully installed to: /home/ec2-user/composer.phar
Use it: php composer.phar

$ sudo cp composer.phar /usr/local/bin/composer
$ sudo ln -s /usr/local/bin/composer /usr/bin/composer

$ composer -V
Composer version 1.7.3 2018-11-01 10:05:06

MySQL実行する


$ sudo service mysqld start
Starting mysqld:                                           [  OK  ]

・MySQLサーバーの設定
$ sudo mysql_secure_installation

Securing the MySQL server deployment.

Connecting to MySQL using a blank password.

VALIDATE PASSWORD PLUGIN can be used to test passwords
and improve security. It checks the strength of password
and allows the users to set only those passwords which are
secure enough. Would you like to setup VALIDATE PASSWORD plugin?

Press y|Y for Yes, any other key for No:

rootのパスーワード入力しますが、デフォルトでは設定されていないので『Enter』を押します。
Please set the password for root here.

New password:

Re-enter new password:

新しいパスワードを設定します。
By default, a MySQL installation has an anonymous user,
allowing anyone to log into MySQL without having to have
a user account created for them. This is intended only for
testing, and to make the installation go a bit smoother.
You should remove them before moving into a production
environment.

Remove anonymous users? (Press y|Y for Yes, any other key for No) :

「Y」を入力して匿名ユーザアカウントを削除します。
Normally, root should only be allowed to connect from
'localhost'. This ensures that someone cannot guess at
the root password from the network.

Disallow root login remotely? (Press y|Y for Yes, any other key for No) :

「Y」を入力してリモートログインを無効にします。
By default, MySQL comes with a database named 'test' that
anyone can access. This is also intended only for testing,
and should be removed before moving into a production
environment.

Remove test database and access to it? (Press y|Y for Yes, any other key for No) :

「Y」と入力してテストデータベースを削除します。
Reloading the privilege tables will ensure that all changes
made so far will take effect immediately.

Reload privilege tables now? (Press y|Y for Yes, any other key for No) :

「Y」と入力してリロードします。

システムrebootしてもMySQLを起動するように設定をする

$ sudo chkconfig mysqld on

Live Helper Chat


Live Helper Chatのインストール


$ cd /var/www/html
$ mkdir livechat
$ cd livechat

$ wget https://github.com/remdex/livehelperchat/archive/master.zip
$ unzip master.zip
$ mv livehelperchat-master/* ./

$ rm master.zip
$ rm -r livehelperchat-master/
$ ls
composer.json  lhc_web  README.md
$ cd lhc_web

$ chmod 777 -R cache

インストール



ライブラリのインストール

インストール画面でNoになっている箇所を対処していきます。

$ sudo yum install -y php72-gd

$ sudo service httpd restart

データベースの作成


コマンドからデータベースを作成する
$ mysql -h localhost -uroot -p

mysql> create database livechat;
Query OK, 1 row affected (0.00 sec)

mysql> show databases;
+--------------------+
| Database           |
+--------------------+
| information_schema |
| livechat           |
| mysql              |
| performance_schema |
| sys                |
+--------------------+
5 rows in set (0.00 sec)

データベースの設定


先ほど作成したデータベースの項目を設定する

  • username

  • password

  • host

  • port

  • database name


管理者の設定

  • Admin username
  • Admin password
  • E-mail
  • Your name
  • Your surname
  • Default department

インストール完了

Login here からログインしてみる



 

日本語に変更


デフォルトだと日本語表示ができないので、こちらのページを参考に日本語を追加します。

翻訳ファイルのダウンロード


transifexでLiveHelperChatの翻訳が行われているようです。こちらで無料でアカウントが作成できるのでログインをしてファイルをダウンロードします。

サイドメニューの「言語」を選択して検索項目にJapaneseと入力をすると２つのリソースが表示されます。

下に表示されている方が翻訳されているようなので、そちらを選択します。


desktopとwebの2つが表示されますが、今回はwebを利用します


ダウンロードします。

「for_use_live-helper-chat_translation_webts_ja_JP.ts」ファイルがダウンロードされます。

EC2にファイル設定します


scpでファイルをアップロードします
scp -i ~/.ssh/AWS認証キー ~/Downloads/for_use_live-helper-chat_translation_webts_ja_JP.ts ec2-user@xxx.xxx.xxx.xxx:~/

「/var/www/html/livechat/lhc_web/translations」に各言語の翻訳ファイルがあるので、ja_JPというディレクトリを作成してtranslation.tsという名前でファイルを設置します。
$ cd /var/www/html/livechat/lhc_web/translations/

$ ls
ar_EG  cs_CS  el_EL  fi_FI  hr_HR  ka_KA  no_NO  ro_RO  sv_SV  vi_VN
bg_BG  da_DA  es_MX  fr_FR  id_ID  lt_LT  pl_PL  ru_RU  th_TH  zh_ZH
ca_ES  de_DE  fa_FA  he_HE  it_IT  nl_NL  pt_BR  sq_AL  tr_TR

$ mkdir ja_JP
$ mv ~/for_use_live-helper-chat_translation_webts_ja_JP.ts /var/www/html/livechat/lhc_web/translations/ja_JP/translation.ts

設定ファイルの変更


「/var/www/html/livechat/lhc_web/settings」にあるsettings.ini.phpを編集していきます。

編集の前にファイルのオーナーを変更しておきます。

$ cd /var/www/html/livechat/lhc_web/settings
$ sudo chown -R ec2-user:apache settings.ini.php
$ vi settings.ini.php

'available_site_access'という項目があるので、'ja'を追加します。
        29 => 'cat',
        30 => 'site_admin',
↓
        29 => 'cat',
        30 => 'ja',
        31 => 'site_admin',

'site_access_options'の項目を探すと各言語ごとに設定がありますので、jaも追加します。
'ja' =>
array (
  'locale' => 'ja_jp',
  'content_language' => 'ja',
  'dir_language' => 'rtl',
  'title' => '',
  'description' => '',
  'theme' =>
  array (
    0 => 'customtheme',
    1 => 'defaulttheme',
  ),
  'default_url' =>
  array (
    'module' => 'chat',
    'view' => 'startchat',
  ),
),

'site_admin'の設定をjaに変更します。
'site_admin' =>
array (
  'locale' => 'ja_JP',
  'content_language' => 'ja',
  'dir_language' => 'ltr',
  'theme' =>
  array (
    0 => 'customtheme',
    1 => 'defaulttheme',
  ),
  'login_pagelayout' => 'login',
  'default_url' =>
  array (
    'module' => 'front',
    'view' => 'default',
  ),
),

画面から日本語に設定


サイドメニューのSettingsからLanguages configurationを選択します。


「ja_JP」選択すると日本語に変換されます。

埋め込みタグ

設定の「組込コード」から各種のコードが取得できます。

サイトに埋め込みだけでLiveChat以外にもFAQなども実装できるようです。

1
1
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
Sign upLogin
1
1