忍者ブログ
Admin*Write*Comment
アルトマーレのゴンドラ工場
[131]  [130]  [129]  [128]  [127]  [126]  [125]  [124
×

[PR]上記の広告は3ヶ月以上新規記事投稿のないブログに表示されています。新しい記事を書く事で広告が消えます。

今更ですが、あけましておめでとうございます。

仕事で土曜出社や23時帰宅がデフォになり、サイトの更新作業が全くできない状況です。(それでなくても今まで怠けてましたけど)

一応プログラマー職という事でプログラミングなら勉強と更新作業を両立できると思い、
まずはチャットを作ってみるコトにしました。目標は現行チャット(レンタル)を越えるコト。
週1回ぐらいのペースで更新していこうと思っています。


まず、そもそもチャットはどういう仕組みなのか。
・コメント書き込んだらサーバーのログファイルを更新
・ログファイルを定期的に取得する
基本的にはコレだけですね。(たぶん)

それを踏まえた上でチャットの作り方を探してみたところ、こんなサンプルを発見しました。
http://www6.atpages.jp/guardiancity/weblog/chat00.php

…初めてチャットというものを見た記憶が蘇りました。
サンプルに言うのもアレですが、現行チャットにはほど遠い存在ですね。
まず何よりもリロードがダサい。

調べたところ、現行チャットのような「画面遷移をせずにリロードする」というのは
Ajaxなるものを使えば実現できるそうです。

MGS3より オセロット少佐
Ajax「俺のリロードはレボリューションだ!」

今回はAjaxの一つ、prototype.jsを使用します。
Javascript内での読み込み用ソースはこんな感じ。

new Ajax.Request(url, // 読み込みをするURL
{
method: 'get', // GETで送信する
onSuccess: getData, // 呼び出し成功時にgetData関数を呼ぶ
onFailure: errMsg, // 呼び出し失敗時にerrMsg関数を呼ぶ(今回は省略)
parameters: paramList // URLに付加する引数(これも省略)
});

function getData(data)
{
var item = data.responseXML.getElementsByTagName('Log');
var log = "";

for(i = 0; i < item.length; i++)
{
var nameTag = item[i].getElementsByTagName('NAME'); // 発言者名
var name = nameTag[0].firstChild.nodeValue;

var commentTag = item[i].getElementsByTagName('COMMENT'); // コメント
var comment = commentTag[0].firstChild.nodeValue;

log += name + " " + comment + "\n"; // ログ出力用変数に追加
}

result.innerHTML = log; // html側の取得結果表示部分に
}

流れとしては
・urlにログファイルのアドレスを指定
・成功するとgetData関数が呼ばれる
・getData関数でxmlの中身を取り出す

そして書き込みはphpで行います。これも同様にAjaxのRequestで呼びます。

<?php
$name = $_GET['name']; // GETで送られてきた発言者名を変数に格納
$comment = $_GET['comment']; // コメントも同様

$xml = simplexml_load_file('log.xml'); // ログのxmlをロードする
$node = $xml->addChild('Log'); // 新規ノードLogを作る
$node->addChild('NAME', $name); // Logの子要素NAMEに発言者名を出力
$node->addChild('COMMENT', $comment); // コメントも同様
$xml->asXML('log.xml'); // xmlに書き込む
?>


こうして画面遷移をせずにリロードが可能となりました。
まずは満足。
http://www6.atpages.jp/guardiancity/weblog/chat01.html

チャット作りはまだまだ続く。
続くったら続く。
PR
この記事にコメントする
お名前
タイトル
メール
URL
コメント
文字色
パスワード   Vodafone絵文字 i-mode絵文字 Ezweb絵文字
secret
  • 無題
ニド URL 2010/01/23(Sat)11:56:14 編集
( ゚Д゚)ポカーン
  • 無題
チモ 2010/01/23(Sat)21:00:06 編集
さすがにサニタイジングされてた
残念だなぁ

それにしても懐かしいなぁ
プログラミングなんて1年ぐらいやってないや・・・
  • レスポンス
ジャッカル 2010/01/31(Sun)00:12:32 編集
>ニドさん
この記事の目的は「チャットの作り方教えます」じゃなくて「こんな風にヒマ潰ししてるよ」なので詳しく書いてないからポカーンとして当然ですw

>チモさん
サニタイジングはこっちでやってないんでxml書き込み関数内でやってくれてるみたいです。
この記事へのトラックバック
この記事にトラックバックする:
  • ABOUT
ポケモンとヴェネツィアを愛してやまない男が愚痴を垂らしているブログ
  • プロフィール

 HN:
ジャッカル

 本名:
ザ・フライ

 HP:
 性別:
Y染色体があるほう

 ぶんぷ:
カナズミシティ

 特技:
口笛

 特徴:
左利き

 語れるもの:
ポケモン
ポケスペ
メタルギア
ZOIDS
ジョジョ
武装錬金

 好きな映画:
スター・ウォーズ
スパイダーマン
リベリオン
スタンド・バイ・ミー
インディ・ジョーンズ
007
他セガールが主演のもの

 嫌いなもの:
ネタバレ

 最近遊んだゲーム:
しゃべる!DSお料理ナビ
世界のごはん しゃべる!DSお料理ナビ
スパロボK

 一言:
スキー行きたい

  • フリー対戦スレ住人さんのブログ
  • カレンダー
02 2017/03 04
S M T W T F S
1 2 3 4
5 6 7 8 9 10 11
12 13 14 15 16 17 18
19 20 21 22 23 24 25
26 27 28 29 30 31
  • 最新CM
(12/12)
(12/12)
(12/12)
(12/11)
(12/11)
  • カウンター
  • アクセス解析
  • フリーエリア
  • 忍者ポイント広告
Copyright © アルトマーレのゴンドラ工場 All Rights Reserved.*Powered by NinjaBlog
Graphics By R-C free web graphics*material by 工房たま素材館*Template by Kaie
忍者ブログ [PR]