Today: Yesterday: Total: Online:
カテゴリー
その他
  • RSS1.0
  • RSS2.0
  • atom0.3
  • valid XHTML1.0
  • valid CSS2
  • Credit
RSSリーダーで購読する | この日記のはてなブックマーク数 | プロフィール
コメントが一番多い記事(233コメント):人の心理の裏をかくホームページ集客術:リピータになってもらうためには
ツイートが一番多い記事(94ツイート):ちょっと待て!twitterやfacebookに子供の写真を掲載する親達への警告
いいねが一番多い記事(574いいね):facebookスパムに要注意。なりすましの見分け方とアカウント乗っ取りの手口(2013年度版)

カテゴリー » Web/ミディリン August 31, 2005

新サイト:「温泉宿・施設予約検索」仮公開 ID:1125495619


新しいサイト作ってしまいました。


「温泉宿・施設予約検索」
http://midilin.sakura.ne.jp/travel/


サイト名は変更するかもしれませんが、
とりあえずシステムができたので、公開します。


全国の温泉とエリアから宿泊施設が検索できるシステムです。
温泉宿及びその他宿泊システム全国13000件近くの宿が検索できる他、
口コミ情報の書き込みと閲覧が可能になっています。


学生時代に日本全国旅したことがあったので
(もっともほとんど寝袋で野宿だったが)
旅関係のサイトは一度作ってみたかったのです。


たらい回しツアー(もうほとんどの人がこの企画を忘れているはず。6,7年前の企画だから)
のように旅のレビュー記事を書くことも考えたのですが
有益な情報を読者さんに提供した方が良いだろうと
PHPとMysqlを使って1つシステムを作ってみました(半分はプログラムの勉強も含めて)


今回苦労したのが、
(1)リスト出力
(2)動的URLを静的URLに書き換える
(3)口コミ情報閲覧・書きこみ機能


この3つでした。


(1)リスト出力
リスト出力とは右メニューで地方選択ができるのですが
地方(例えば東北)を選ぶと、青森、岩手〜などがずっと出てきて
さらに県を選ぶと、詳細な温泉情報のプルダウンを表示するというものです。


最初、このプルダウンをJavascriptで作って切り替えメニューを作ろうと思っていたのですが
選択リストの連携が5つあり、
(「地方検索」「都道府県検索」「温泉検索」「エリア検索」「エリア詳細検索」)
これらの関係をJavascirptで書くともの凄く複雑になる上、
ソースが膨大になるのですよね。


そこでやむを得ずサーバーを通して
1回プルダウンを選択するたびにデータベースに問い合わせをしていって
リストを出力するという方法にしました。


サーバーを通して処理をすると、毎回submit(フォームで送信ボタンを押すこと)が発動するので
処理が遅くなるのですよね。
だからできるだけJavascriptで処理をしたかったのですが、
PHPで処理を振り分けて、該当するSQLを発行してDBに問い合わせをするというのを作ってみました。


(2)動的URLを静的URLに書き換える
PHPなり、CGIなりフォームを使って検索をすると
GET形式で送信をするとき、複雑なパラメータがURLに付加されます。


例えば、北海道の温泉を検索するときはURLは


http://midilin.sakura.ne.jp/travel/?
currentpage=0&area01=1&area02=0&onsen=0&area03=0&area04=0
&kensuu=10&searchsubmit=search&buttonpush=push


という「動的なURL」になります。
しかし動的なURLは検索エンジン(googleやyahoo)にほとんど登録されないため
これを「静的なURL」(HTML)に書き換えてやるのです。
上記は

http://midilin.sakura.ne.jp/travel/0_1_10000_0_0_0_10_search.html

という形に変えてもアクセスできるようにしました。
(実際は上のようなHTMLは生成していません)


このURLをトップページの北海道からリンクを貼ることで
本来動的なページは検索エンジンにかからないものが、
HTMLとして見せることで検索エンジンにかかりやすくするという
アクセスアップ裏技の1つです。


HTMLに似せてみせるようにさせることも苦労したのですが、
「次の10件」「前の10件」を検索するというところが苦労したのですね。


例えば、120件検索データがあり、そのうち10件表示をしたら、
次は、10〜20というふうに検索できるようにするわけです。


しかし、検索ボタンを押して検索した場合は動的なURLが必要で
トップページのリンクからたどったときは静的なURLが必要になるわけです。


動的URLの次検索リンクとと静的URLの次検索リンクの2パターンをプログラムで作成して
検索ボタンを押した場合は動的URLを次へボタンを出力し
リンクによる(偽HTML)から次へを押すときは静的なHTMLのリンクを作るというところが
システムで組むのに手間取ったところです。


(3)口コミ情報閲覧・書きこみ機能
各宿に口コミ情報を書きこみ、閲覧できる機能を実現しました。
システム的には結構簡単で、口コミ情報をどんどん溜めておき
検索するときは宿情報をキーに、宿情報と口コミを出力するだけです。


ここからが、ちょっと専門的な話になって大変申し訳わけないのですが
フォームタグってありますよね。


メール送信フォームや、検索など
「送信」ボタン(つまりsubmit)ボタンを使うときに使うタグです。


画面に入力されたデータを送信するには
フォームタグの中に入力項目(テキストフィールドや、ラジオボタン)を入れる必要があるわけです。


今回の温泉宿検索では、
一つの温泉情報で1つの入力フィールドがあるため、
検索結果で複数のの宿情報ができた場合は
複数のフォームタグと、入力フィールド、送信ボタンが必要なわけです。


右メニューの検索フィールドで、フォームタグ(+検索ボタン)、
検索結果では、1つの宿情報で、1つのフォーム情報(formタグで囲んである)を持ち
1ページに10個の宿が出力されたら10個のフォームタグと送信ボタンを置いたのですが
これがうまく値がとれなかったのです。


今回のシステムはPHPで組んでいるのですが、
Perl(CGI)で似たようなシステムを作ったときは値がとれたのですよね。


似たようなことを以前、パステル・ミディリンの音楽ライブラリでやっていたことがありました。
現在の音楽ライブラリは、同じくPHP+Mysqlを使っていますが
一番最初(8年前)は「HTML管理」
次に「データをCSV化し、Perl(CGI)でデータ呼びだし」
そして今の「PHP+Mysql」のシステムがあります。


音楽ライブラリをCSV+CGIで公開していたときのことを覚えている方は
「リンク切れ連絡送信フォーム」というのがあったのを覚えていますでしょうか。


これはMP3のデータに限り、投稿者のMP3ファイルは投稿者が持つサーバーに置いてもらっているのですが
曲が削除されたとき、音楽ライブラリからはデットリンクになるので、
曲を視聴しに来た方がデットリンクに気がついた方はボタンを押すと
削除された曲情報が私や曲更新係さんに送信されるものです。


これも同じように、各音楽情報をフォームタグで囲み、
隠しフィールド(hiddenタグ)に曲情報を埋め込み
送信するとフォームタグに囲まれた曲情報を送るというシステムでした。


やり方としては同じなのですが、Perlだと値がとれるのに
PHPだとうまく値がとれなかったのですよね。


それで、どうしようか悩んだ上、検索も口コミ送信ボタンも1つの大きな
フォームタグで括り、入力フィールドの名称を
PHPを使って値を重複しないようにしました。


また送信ボタンにもすべた隠し属性を埋め込んでおきます・・・(A)
そして、フォームタグの中にもう一個隠しフィールドのhiddenタグを空で埋め込んでおきます。・・・(B)


そして口コミ情報の複数に並ぶ送信ボタンのうち、1つボタンを押した瞬間、
送信ボタンの番号(A)を空のhiddenフィールド(B)に値をいれてあげ
hiddenフィールドに値が入ったときには、
送信ボタンと同じ番号の入力情報(テキストフィールド)から値を取得するという方法に
切り替えたら、PHPでもうまく値をとることができました。


これって、PHPの仕様なのでしょうかね。
Perlだとできて、PHPだとできないというのは。

方法を変えたことで、口コミ書きこみ閲覧情報が実現できたので良かったですが、
かなりはまり、時間を費やしてしまいました。


そんな苦労が背景にありながらできたシステムです。
— posted by midilin @ 10:40PM | Comment(15) | TrackBack(0) 
[コメントが多かった順の記事]
人の心理の裏をかくホームページ集客術:リピータになってもらうためには(233)
ホームページ心理学第2弾「メールの書きだしとホームページ運営・集客の関係」(76)
娘が生まれた(69)
ゲームと言えば、何を思い出す? (50)
Microsoftからアクセス (30)
「目標の立て方」と「努力」と「実行力」(26)

上の記事に対するコメントです

1しん  September 1, 2005 @ 11:36pm
本当にたいしたものです:)

2パステル・ミディリン@安田まこと Website  September 1, 2005 @ 11:46pm
しんさん、お世話になっております。
コメントありがとうございます(^^)

3しん  September 2, 2005 @ 09:51am
安田さんのページを見ていると、ついつい時間を忘れてしまいます。
就寝時間も遅くなってしまうので、こうして職場で見ています。
私の後ろは壁なので、閲覧するのには最適です。
安田さんのページは自宅PCの「お気に入り」に入れさせていただきました。:D

4安田まこと Website  September 2, 2005 @ 12:19pm
しんさん、こんにちは。
お気に入り登録ありがとうございます!
時間を忘れると言っていただけてて嬉しいです。
時には楽しく、時には考えさせる、人の心にうったえかける、
そんなページを目指しています。
後ろが壁ならネットし放題ですね(笑)

5こぞう  September 3, 2005 @ 01:49pm
はじめまして 自分の足跡666を踏んで下さった方に挨拶に参りました♪

6パステル・ミディリン@安田まこと Website  September 3, 2005 @ 04:11pm
こぞうさん、初めまして。
ご挨拶ありがとうございました(^^)
今後ともよろしくお願いいたします。

7どんてん生活  September 3, 2005 @ 11:39pm
はじめまして。踏んで下さいましてどうもです。
早速ですが、「旅行」カテゴリにブックマークさせていただきました。
格別温泉好きでもないのですが、やはり旅の折には、温泉意識せずにはおられません。
作成の過程も大変面白く読ませていただきました。ありがとうございます。:)

8パステル・ミディリン@安田まこと Website  September 4, 2005 @ 03:33pm
どんてん生活さん、初めまして!
旅行サイトの方ブックマークありがとうございました!
やっぱり旅に出たときに一度は温泉に立ち寄りたいですよね。
現在のページは検索してたどっていかないと温泉の口コミ情報が書き込めないので
そのうち改善をしていきたいと思っています。
今後ともよろしくお願いいたします!

9LinJin  September 8, 2005 @ 12:19pm
(QQ)こんにちは!
わたしの中では
バイクと温泉は「セット」
です。早速サイトを拝見させていただきました。
HPの基本的なしくみがわかっていないので、もし教えていただけたら、と思い書き込みしました。
わたしは仕事柄、このような画面からデータを入力して、データベースに登録したり、
画面に一覧を表示したり、参照、更新・削除といった処理をするシステムをよくつくります。
画面はColdFusion、データベースはOracleを使用しています。
ColdFusionは基本的にはHTMLタグを用い、自由にJavaScriptの記述もできます。
HTMLとの大きな違いは、「CF」タグを使用して直接DBへの操作ができたり、
exeファイルを起動できたりするということです(と思います)。
ファイルの拡張子は「cfm」となります。
上記をふまえまして、質問は
「HPから書き込んだ情報や画面に表示させる情報はどこに蓄積されているのですか?」
です。
もしよろしければ、お願いします。すみません。

10安田まこと Website  September 8, 2005 @ 01:01pm
LinJinさん、こんにちは!
mixiでお世話になっています。

バイクで駆け巡った後、 温泉に入るの気持ちよさそうですよね(笑)

さて、ご質問の件について、お答えしますね。

私はColdFusionを使ったことがありませんので確かなことはいえませんが
ColdFusionって、確かマクロメディアから出しているWebアプリケーションサーバのことですよね?

であれば、画面から入力したデータ
(HPから書き込んだ情報)はOracleにたまり
HTMLベースなどの画面情報
(画面に表示させる情報)はOracleから受け取った値をcfmファイル上で出力するという考え方でよいと思います。

もしデータベース以外にデータをためるのであっても
cfmファイルやexeファイルに情報をもつのではなく
別にプロパティファイルやCSVファイルに情報を作成してそこにデータを持つというのが正しい気がします。

PHPやJavaも同じですよね。
Webサーバーにアパッチを使ったとしても、アパッチが持っている情報は
URLやDBのデータソース(ODBCなど)を決定するXML情報を持っていますが
画面から入力したデータはJSPやPHPを返してデータベースに格納されることはあっても、
アパッチそのものに格納されるわけではありません。

また画面上の表示はHTML部分をJspやPHPに記述し
データベースから値をひっぱってきて、JspやPHP上に検索内容を表示するということですから。PHPやjspがcfmにかわっただけかと思います。

ColdFusionがどういう仕様かわかりませんが、
普通のWebアプリケーションサーバであれば、上記のような動きと値の保持をしていると思います。

11LinJin  September 11, 2005 @ 01:44pm
たいへん丁寧なご回答ありがとうございます。(QQ)
と、いうことは、もし自分が現在契約しているプロバイダを利用してHPをつくると、
「作成した画面から入力された情報はプロバイダにあるサーバに蓄積される」
と考えてもよいのでしょうか?

12パステル・ミディリン@安田まこと Website  September 11, 2005 @ 03:58pm
LinJinさん、そういうことです。
もっとも、プロバイダが別の会社にDBサーバーとか、持っていたら別でしょうけれど
普通は自社で持っているでしょうからね。

13スチービー  September 28, 2005 @ 07:44pm
はじめまして。
Mixiの足跡からきました。なんか、凄いですね。こういうの。
安田さんの旅への愛情を感じます。
僕も寝袋の旅は好きで、学生時代、ヨーロッパをヒッチハイク&野宿ってな旅を一ヶ月程しました。
只今、バイクの免許を取りに教習所に通っているので、バイク免許とれたら、いろいろこのページを参考にしていろいろ行きたいと思います。

14安田まこと Website  September 29, 2005 @ 12:03pm
スチービーさん、初めまして!
スチービーさんも寝袋の旅をされたのですね。
しかし、ヨーロッパをヒッチハイクで旅とは凄い!!!!
ヨーロッパはイタリアにしか行ったことがなく
しかもツアーだったのですが、それでも怖いところとかありましたもの。
本当に凄いですね!
バイクの免許、早く取れると良いですね。
もし行ったことがある温泉などありましたら、ぜひ口コミ入力してみてくださいね!
今後ともよろしくお願い致します♪

15スチービー  September 30, 2005 @ 02:25pm
はい!こちらこそ、今後ともよろしくお願いします。

コメントをどうぞ。名前(ペンネーム)は必須です。URLはオプションです。

Comment Form
名前(ペンネーム): 文字色:
リンク作成 »
スパム対策画像認証(右に表示されている画像の番号を入れてください):
下のアイコンをクリックするとテキストエリアに挿入できます
:) :D 8-) ;-) :P :E :o :( (TT) ):T (--) (++!) ?;w) (-o-) (**!) ;v) f(--; :B l_P~ (QQ)

←メールアドレスを入力しておくと midilin がレスをした際に通知します: