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
インストール
http://xxx.xxx.xxx.xxx/livechat/lhc_web/にブラウザでアクセスしてインストール画面を表示する
ライブラリのインストール
インストール画面で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
- 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 [email protected]:~/
「/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なども実装できるようです。
コメント