何かのサービスサイトを訪問し、「何かお困りですか?」とチャットウインドウが開くようなサイトを訪問したことは無いでしょうか?
本日は、そんなチャットシステムが簡単に構築できるAPI、iFlyChatの導入方法の紹介です。
「Webサイトからお問い合わせが来ない…」とお悩みの方必見!
当サイトのノウハウを詰め込んだ『Web集客の無料ガイド』をご提供
- iFlyChatをダウンロードします。
https://github.com/iflylabs/iflychat-php
- iFlyChatにアクセスし、アカウントを作成します。
- アカウント作成後、「Dashboard > Generate a new API key」と進み、iFlyChatを使用するドメイン名を入力し、API Keyを取得します。
- ダウンロードし解凍した、iflychat_api_settings.phpを開き下記の行を修正します。
- /* 作成したAPI KEY */
- 'api_key' => 'XXXXXXX',
- /* iflychatの格納場所 */
- 'path' => '/test/iflychat-php/',
- 下記のコードを参考にページに組み込みます。
- <?php
- require_once('./iflychat-php/iflychat_api.php');
- $rand = mt_rand();
- $current_user_info = array(
- 'name' => $rand, //ユーザー名
- 'id' => $rand, //ユーザーID
- 'is_admin' => TRUE, //チャットルーム作成などのadmin権限
- 'avatar_url' => 'my_picture.jpg', //ユーザー写真
- 'upl' => 'user.html' //ユーザーページ
- );
- $ifly_code = iflychat_render_chat($current_user_info);
- ?>
- <!DOCTYPE html>
- <html lang="ja">
- <head>
- <meta charset="utf-8">
- <title>iFlyChat Test</title>
- <script src ="https://ajax.googleapis.com/ajax/libs/
- jquery/1.4.4/jquery.min.js"></script>
- </head>
- <body>
- iFlychat Test Your Account is <?php print $rand ?>
- <?php print $ifly_code; ?>
- </body>
- </html>
以上で、簡単にチャットシステムを組み込むことが可能です。
検証環境は、iPhone、android、macなどで検証を行いましたが、全て動作しました。このiFlyChatを試す前に、WebRTCを使ったものや、他のチャットシステムを試しましたが、Safariで動作しないや、iPhoneで動作しないなどがあったため、このチャットシステムに行き着きました。