Lace :: ajax :: ブラウザで使えるサクサクチャット
2006/5/23 (Tue) at 10:37 am
「ajaxってなんジャックス?」というベタなギャグをカマしている場合ではありません!
ajax = Asynchronous JavaScript + XML
Javascript + xmlにphpやcssを組み合わせてつくるエッジなウェブアプリケーションをさいきんはこう呼ぶらしいです。というわけでajaxの代表選手をひとつ入れてみたのでその紹介です。
チャットするためのウェブアプリケーション。従来のリロードタイプよりもずっと軽快でFlashのチャットよりもカスタマイズ容易。ちょっと書き換えるだけで日本語も使えるようになりました。とりあえずデモをご覧下さいといいたいのですがその前にひとつ注意事項を。
【Laceのデモで遊ぶときの注意】
人に見られて困るような内容をデモで入力しないこと。
現在のバージョンの仕様では、チャットのログが永遠に残るようになっています。実際に導入する際にはひと工夫カスタマイズが必要でしょう。パス制限するとか、ログを見られないようにするとか。こちらでは「とりあえず日本語を使えるようしてみた状態」のデモなのでデフォルト状態です。毎時0分にログを初期化するようにcronを動かしているだけです。
チャットに入力後、次のゼロ分までは誰かに見られる可能性があります。ゼロ分を超えると自動的に消えます。デモで遊んでいるときに運悪くゼロ分になると、とつぜんチャット画面がリセットされます。というベータな仕様になっておりますが、軽快感は十分にわかると思うんでちょっと遊んでみてください。それではこちらから↓
日本語動作確認デモのurl:
lace DEMO
サーバ移転に伴い、デモは終了しました。
※別窓で開きます。
【LACEシステム要件】
Apache 1.3系、2.0系いずれも可
日本語動かすにはmbstringモジュール必要。
【インストール及び日本語化クイックガイド】
1. 本家からlace-0.1.5.zipをダウンロード&解凍
2006年5月23日時点の最新バージョンは0.1.5。
2. 解凍してできたフォルダの中にあるwwwフォルダを好きな名前に変える。このフォルダがインストール先のディレクトリ名となる。
laceフォルダ内のconfig.phpをテキストエディタで開き以下の2行を環境に合わせて設定
インストール先を絶対urlで書く↓
[line 29] define('LACE_URL_ABS', 'http://www.myserver.com/lace/');
上に書いた文字列から「http://ホスト名」を除いた文字列を書く↓
[line 33] define('LACE_URL_REL', '/lace/');
3. 英語のままでよければこのまま "lace" フォルダをアップロード
lace.phpの以下の部分を書き換える。1カ所。
[line 30] デフォルト↓
header('Content-type: text/html; charset=utf-8');
[line 30] 書き換え後↓
header('Content-type: text/html;');
index.phpの以下の部分を書き換える。2カ所。
[line 63] デフォルト↓
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
[line 63] 書き換え後↓
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja">
[line 66] デフォルト↓
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
[line 66] 書き換え後↓
<meta http-equiv="content-type" content="text/html; charset=euc-jp" />
index.phpは文字コードeucで保存する。← 忘れずに!
日本語化作戦以上。たぶん。
※補足する。lace.phpのヘッダのcharset宣言であるが、最初ここをeuc-jpと指定したら、win-xpのieのみハングした。javascriptのせい? よくわからないです。んで、charset指定をブランクにしたら動いた。なので上の設定例ではブランクにせよとなっているが、ここらへんの挙動はサーバによって異なるのかもしれない。各自研究して下さい。4. laceフォルダをftpにてサーバへアップロード&パーミッション設定
chmod 777(or 707 or 700) /lace/data/activity.dat
chmod 777(or 707 or 700) /lace/data/lace.dat
chmod 777(or 707 or 700) /lace/data/log.dat
chmod 777(or 707 or 700) /lace/data/logs
以上で完了です。
ブラウザからlaceフォルダにアクセスしてみましょう。
どうですか?
言い忘れましたが、shift_jisでやりたい人はそれでもよいでしょう。上の設定はeucになっています。以上はとりあえず動かしてみようというだけのミニマムなやり方です。私のサーバではこれで動いていますが、環境によって結果が異なるようです。昨日、友人に勧めてみたらそこのサーバではチャットの挙動がへんでした。入力後リターンキーを押してもチャットウインドウに文字が入らないのです。なぜだかわかりません。とりあえずうちの環境はこちら↓
タイトルを変えたり、デザインをカスタマイズしたりするのは、config.php及びスタイルシートを編集することによって行えます。
Javascriptが出た頃というのは「おもしろいけど使えないツール」だと私は思っていました。クライアント環境に依存するというのが私は好きになれなくて、これは学ぶ価値が薄いのではないかと思っていましたが少し考えを変える必要があるのかも。
Laceに代表されるajax系ウェブアプリケーションは続々とたくさん出ているようで、エッジな方々はいろいろと試されているようです。リロードせずに動くというのがよいですね。Active-Xでやるしかなかった様々なことをやれそうです。セッションという概念がないというのが画期的だなぁと思います。
ほとんどの仕事現場では100%シュアな動作が求められるわけで、いくら動きが軽快で使いやすくても使えない人が出てくる(「クライアント環境に依存する」)というのは依然ネックではありますが、Javascriptをdisableにしている人の数は昔ほどに多くありませんし、もしかしたらこれは学ぶ価値がある世界なのかなと予感させるものであるように私には感じられました。
コメント・プリーズ!
-
海外産リアルタイムチャット「Lace」 - MAHOROBATISTA
日本のチャットスクリプトではないんですが、海外ではそこそこ有名なチャット、Laceを紹介します。LaceはPHPで書かれており、もちろんAjaxに対応し...
2009/9/16, 11:35 PM
PROFILE![]()
藤居ヒロヤ。ウェブデザイナー/ウェブディレクター。ウェブデザインオフィス、3OT NET主宰。名古屋市中区。「優しいデザイン」「激しいデザイン」「正しいデザイン」「セクシーなデザイン」「泣けるデザイン」「もっともなデザイン」... 。あなただけのウェブデザインを丹精込めておつくり致します。見積り依頼等、お気軽にお問い合わせ下さい。
- www. http://www.3ot.net/
- email. admin [atmark] 3ot.net
- phone. 052 323 7376
RECENT ENTRIES![]()
- トウモロコシがおいしい
- ダイコクドラッグが近所にできた
- ライブドアのBLOGOSをよく読みます
- jQuery :: 画像のリロード
- タムの絵
- Javascript :: ecl.jsにながらくお世話になりました
- サーバ移転&ブログのデザインをすこし変えました
- php :: 正規表現 :: 名前つきキャプチャというのを習った
- jQuery :: ネストしたリスト + ui.sortable.js
- jQuery :: event delegationてナニ?
RECENT COMMENTS![]()
- トウモロコシがおいしい [4]
- ふ (07/09)
- いら (07/03)
- ふ (07/03)
- いら (07/03)
- php :: ファイルを強制的にダウンロードさせる [9]
- ふ (05/26)
- ふ (05/26)
- ふ (05/26)
- esperia (05/26)
- esperia (05/26)
- ふ (05/25)
- esperia (05/25)
- ふ (04/14)
- とほりすがり (04/13)
- タムの絵 [2]
- ふ (12/05)
- いら (12/04)
TOOLS![]()
- s-box.js
- Link2WikipediaEncoder
- QR_CodeGenerator
- PagerankChecker
- IntrocucePhpCodeOnBlog
- FaviconGenerator
- Whois
- SiteThumbnailGenerator (Beta)
- EmailAddressEncoder (Legacy!)
BOOKMARKS![]()
RESOURCES![]()
- 99designs
- COMPUTER ARTS
- CPAN
- PHP標準関数逆引き辞典
- SMASHING MAGAZINE
- UNIXコマンド
- ajaxload.info
- deviantART
- deviantART :: PS Brushes
- deviantART :: PS Shapes
- fotosearch.com
- hotscripts.com
- hotscripts.com :: php
- iconlet.com
- jQuery Reference
- php.net :: 関数レファレンス
- psbrushes.net
- turnkeyforms.com
ARCHIVE![]()
- 2010年7月 (1)
- 2010年1月 (1)
- 2009年12月 (2)
- 2009年11月 (3)
- 2009年10月 (1)
- 2009年9月 (9)
- 2009年8月 (7)
- 2009年6月 (7)
- 2009年5月 (1)
- 2009年4月 (8)
- 2009年3月 (1)
- 2009年1月 (1)
- 2008年12月 (3)
- 2008年11月 (1)
- 2008年4月 (1)
- 2008年1月 (3)
- 2007年12月 (1)
- 2007年10月 (3)
- 2007年9月 (5)
- 2007年8月 (4)
- 2007年7月 (13)
- 2007年6月 (22)
- 2007年5月 (30)
- 2007年4月 (15)
- 2007年3月 (12)
- 2007年2月 (7)
- 2007年1月 (16)
- 2006年12月 (23)
- 2006年11月 (9)
- 2006年10月 (3)
- 2006年9月 (2)
- 2006年8月 (6)
- 2006年7月 (4)
- 2006年6月 (6)
- 2006年5月 (10)
- 2006年3月 (17)
- 2006年2月 (8)
- すべての投稿 (266)

すすめられた友人です:)
さくさく動いてよかったのに惜しいです。
もういっぺんやったら入るかもよ。
参考になりました。トラックバックさせて頂きます。
どうもです。この記事を書いたのはずいぶん古いんで、あまり参考にならなかったかも。いまなら文字コードは普通にutf-8ですよね。。