jQuery Mobile

PHP

MySQL

WebMatrix

ExpressWeb

で作成・公開する

勉強会申し込みサイト

すみません。

時間がないので、

どんどんいきます！

※質問は後日、または懇親会にて。

勉強会申し込みサイト

About atend form.

背景

• これまでは Google フォームで作成。

背景

• 参加申し込みしたかどうかの確認問い合わせがちらほら。

• @sandinist さんが Ruby on Rails で作成、heroku に配置して運用。

–申し込み完了後、登録完了メールが自動送信されるようになった。

ほかのプラットフォームで

作るとどうなるだろう?

要件

Requirements

要件

• Webフォーム上からの参加申し込み

–氏名、e-mail、LT登壇有無...

• 自分が参加申し込みしたか確認できること。

–一解決策として、登録完了のメール自動送信

• 参加者名簿が作れること。

– CSV形式でのエクスポートとか

プラットフォームと開発ツール

Platform and Tools

jQuery

jQuery Mobile

jQuery Validation

1.6.4

1.0.1

1.9.0

Ver.5.3.5

MySQL Ver.5.1

ちなみに自分は

PHPも

MySQL も

初心者 です。

WebMatrix Ver.2 β

作画: Paese (http://paese.sblo.jp/)

開発ツール - WebMatrix 2 (β)

• Ver.1 からさらに進化

• PHP でもインテリセンス強化

• MySQL のテーブル作成やデータ編集も GUI で

できる

– それで初めてのPHP & MySQL で作ってみようと思い

立った。

ExpressWeb Windows Server2008R2 / IIS7.5

公開・運用 - ExpressWeb

• データジャパン(株)のホスティングサービス。

• 有料とはいえ、十二分に安価。

• ASP.NET アプリの配置先としては最強!?

– MVC3 も使える。

– SQL Server も使える。

• そのほかにも盛りだくさん。

– PHP、Perl、MySQL、サブドメイン無制限 etc.

• 14日間無料のお試しアカウントもあります。

• 最短3分で発行。

開発環境の構築

Building Development Environment

Web PI Web Platform Installer / Ver.4.0 β

開発環境の構築

• Web Platform Installer のおかげで、あきれるほ

ど簡単。

– WebMatrix と MySQL を選ぶ

• 今回はさらに MySQL Connector/NET のインス

トールが必要だが、検索しないと出てこないので

注意！

http://www.microsoft.com/web/webmatrix/

を開いて、右上の「Try the latest Beta」をクリック。

構想

Design

参加申し込みフォーム

参加者一覧

手順

1. 申し込みフォーム、入力のバリデーション

2. データベースの構築、申し込み内容の保存

3. 参加者一覧

4. インターネットに公開

お断り

スニペット

使いまくります。 http://blogs.msdn.com/b/osamum/archive/2011/12/2

6/10251004.aspx

物江さん、ありがとうございます。

インテリセンスもカリカリにカスタマイズ、チューニング

してます。

メール送信機能は実装しません。

開発開始！

Live Coding.

参加者一覧は

スタッフのみ

アクセス可

認証

承認

認証と承認

• 実直に PHP で組んでもよし。

– PEAR:Auth とかあるそうで。

• 今時代なら OAuth とか?

– Twitter アカウントでログイン、みたいな。

しかし

今回は

Digest

認証

なぜ?

ExpressWebでは

SSLが使えない!

パスワード が

平文 で流れてしまう...orz

ダイジェスト認証なら大丈夫

• パスワードが平文で流れることがありません。

• リプレイ攻撃にも強い。

• そして HTTP 標準な仕組みなので、さらなる特

典が... どんな特典かは、いまはヒミツ。

どうやってダイジェスト認証?

• Apache なら簡単だけど、ExpressWeb = IIS ではどうやるの?

• 「あ、オレ、IISのダイジェスト認証の設定、知ってるよ！Active Directory のユーザーで認証するんだよな」

• あのー、ExpressWeb = ホスティングサービスなんですけど...orz

大丈夫。

ASP.NET の

モジュールを

使います!

Http Authentication Module

• 基本認証ないしはダイジェスト認証を、ASP.NET

のレイヤで提供。

• Web.config に書いたユーザー情報で認証。

あのー、

PHP なんですけど?

IIS7 の統合パイプラインモード

• ASP.NET なページへの要求に限らず、すべての

要求を、ASP.NET のライフサイクルとして扱う。

• .php に対する要求に対しても、ASP.NET HTTP

モジュールが処理。

• これで、.php なページも、Http Authentication

Module による認証が機能する！

NuGet Package Manager ページを有効にする手順の動画

http://youtu.be/asKDyXzaT0g

認証の実装、承認の構成

Live Coding.

参加者一覧は当日の受付に使う。

• 申し込み一覧は、なぜ素の HTML、素の TABLE

要素で組んだか?

• 独自のフォーム認証や、OAuth ではなく、なぜ

HTTP 標準の認証（今回は SSL は使えなかっ

たのでダイジェスト認証）を採用したか?

Excel の

Webクエリ

実際にやってみよう

Demo

(アリスも知らなかった)

Excel の Web クエリ

• エクスポート/インポートとは違います！

• Excel表とWebページが関連付けされます！

• F9 押すだけで、最新情報になる！

インターネットに公開

Publish

まとめ

Conclusion

まとめ

• WebMatrix

– PHP + MySQL のスクラッチ開発、ExpressWeb への発

行、リモートビューによる保守（これは Visual Studio に

もできない芸当）はかなり便利。

• IIS 統合パイプラインモード

– PHP なサイトでも ASP.NET 技術の恩恵にあずかれる。

• ExcelのWebクエリ

– HTML 中の TABLE 要素は、CSV エクスポート/インポー

トとかしなくてもExcelに取込・更新可能。

HTTP 認証ならスタッフ専用ページでも大丈夫！

ほかのプラットフォームで

作るとどうなるだろう?

運用費¥0で

Windows Azure上

に作ってみる！

to be continue!