Web 開発

  • [アーティクル]

Web 開発者向け Visual Studio 2010 SP1

Scott Hanselman

Visual Studio 2010 SP1 が 3 月にリリースされました。このサービス パックは、お客様やパートナー企業から寄せられたフィードバックと社内テストで見つかった問題に対処しています。Visual Studio 2010 SP1 のリリースと同時に、Web 開発者向けに多数の新しいコンポーネントも登場しました。今回の記事では、Visual Studio 2010 SP1 における Web 開発の機能強化について説明します。ほとんどの機能強化は、IIS Express 7.5、SQL Server Compact Edition 4.0 (以下 "SQL Server CE")、新しい Razor 構文、Web Platform Installer (Web PI) など、Microsoft Web Platform の新しいコンポーネントと Visual Studio SP1 を統合するために実施されています。ほかにも、ASP.NET MVC 3 などの bin に配置可能な依存関係のサポート、Visual Studio 2010 SP1 自体での HTML5 と CSS3 のサポートといった機能強化もあります。

この記事は、Visual Studio 2010 SP1 がインストールされていることを前提とします。Visual Studio 2010 SP1 はスタンドアロン インストーラーとしてダウンロードすることも、Web PI を使用してダウンロードすることもできます。ダウンロード場所の詳細については、bit.ly/hnU6mm (英語) を参照してください。

Web PI は無償ツールで、Microsoft Web Platform の最新コンポーネントのダウンロードを容易にします。詳細については、bit.ly/a6dLu を参照してください。

Visual Studio 2010 SP1 で注目の新機能

IIS Express 7.5、SQL Server CE、Visual Studio Tools for SQL Server CE、および Razor を使用する ASP.NET MVC 3 は、Visual Studio 2010 SP1 のインストール後に個別にインストールするコンポーネントです。実際には、Visual Studio 2010 SP1 内でのこれらの機能に対するサポートは、これらの機能をコンピューターにインストールするまで休止状態です。

コンポーネントをダウンロードしてインストールする方法はさまざまです。難しい方法もあれば、簡単な方法もあります。各スタンドアロン コンポーネントを自力で探してダウンロードすることもできます。これは、おそらく、エンタープライズ環境や、Visual Studio 2010 SP1 の配置を管理している場合に適切です。Web PI を使用すると、各パッケージを個別に探して、ダウンロードし、インストールできます。これは、特定の機能のみが必要な場合に便利です。個々のインストールについては、後ほど説明します。ただし、最も簡単な方法は Web PI に含まれているこれらのすべての機能を "ひとまとめ" に使用することです。Web PI を起動して "すべての機能" をダウンロードするために適切なオプションを自動選択する短い URL (hnsl.mn/VS2010SP1Bundle) が作成されています。

Web PI は、コンピューターにインストールされている機能を認識します。コンピューターに何もインストールされていない (開発ツールがインストールされていない) 場合、このリンクをクリックすると、無償の Visual Studio Web Developer Express SP1 とすべての新機能が自動的にインストールされます。ただし、いずれかのバージョンの Visual Studio が既にインストールされている場合、または Visual Studio 2010 SP1 と一部のツールがインストールされている場合は、最新状態にするために最小限必要な機能のみが Web PI によって自動的にダウンロードされます。つまり、"すべての機能をインストールする" リンクです。

インストールを開始する前に、Visual Studio のすべてのインスタンスを必ずシャットダウンします (タスク マネージャーで devenv.exe が実行されていないことを忘れずに確認してください)。

インストールされていない新しいコンポーネントを使用するプロジェクトが、知らないうちに開かれていることがあります。新機能の一部を使用する既存の Web プロジェクトを開いていると、Visual Studio 2010 SP1 が不足しているコンポーネントを自動的に検出し、Web PI を使用してインストールします。

Web PI の統合

ここでは、Web プロジェクトに必要な不足 Web コンポーネントを Visual Studio 2010 SP1 が自動検出する方法について説明し、Web PI ツール バーの導入も行います。

不足コンポーネントのダイアログ ボックス: このサービス パックで導入された新しいダイアログ ボックスです。このダイアログ ボックスは、IIS 7.5 Express、SQL Server CE、または ASP.NET MVC Razor 構文を使用する既存の Web プロジェクトを開いたときに、これらのコンポーネントのいずれかがコンピューターにインストールされていない場合に表示されます。このダイアログ ボックスでは、Web プロジェクトで使用していてもインストールされていないコンポーネントを、Web PI を使用してダウンロードおよびインストールできます。

たとえば、図 1 は、SQL Server CE データベースを使用する Web サイトを開くときに、SQL Server CE がインストールされていないコンピューターで表示されるメッセージを示しています。

A Warning About a Missing Component and an Offer to Fetch It

図 1 不足コンポーネントに関する警告と不足コンポーネントのダウンロードを促すメッセージ

ここで、[はい] をクリックすると、Visual Studio 2010 SP1 によって、コンピューターに Web PI がインストールされているかどうかの検出が試みられます。インストールされていなければ、ブラウザー ウィンドウにダウンロード ページを表示し、少なくとも Web PI をインストールします。

Web PI がインストールされていれば、不足コンポーネントのインストールを選択した状態で Web PI を起動します。必要なコンポーネントがダウンロードされます。心配は不要です。Web PI は賢明です。Visual Studio 2010 SP1 は既にインストールされているため、ダウンロードされません。

図 2 は、不足コンポーネントのダイアログ ボックスで [はい] または [いいえ] をクリックした後の処理について説明しています (オレンジの図はユーザーの入力が必要な箇所、青色の図は Visual Studio 2010 SP1 が実行する手順を示しています)。

Steps Taken After You’re Presented with the Missing Component Dialog Box

図 2 不足コンポーネントのダイアログ ボックスを表示後に実行する手順

Web PI ツール バー: Web PI を使用してその他のコンポーネントをダウンロードする場合、[Web コンポーネントのインストール] ボタンを含む新しいツール バーが Visual Studio に追加されています。

[Web コンポーネントのインストール] をクリックすると、Web PI が起動するか、Web PI がインストールされていなければ、ダウンロード ページに移動します。ツール バーが表示されていない場合は、[表示] メニューの [ツール バー] をポイントし、[Web プラットフォーム インストーラー] をクリックすると表示できます。[Web コンポーネントのインストール] は、[ツール] メニューの下にも表示されます。

IIS Express 7.5 のサポート

さまざまなコンポーネントのインストール方法がわかったので、Visual Studio の IIS Express 7.5 機能について説明しましょう。

IIS Express 7.5 は、開発者向けに最適化された簡易版 IIS です。詳細については、bit.ly/cOfrt4 (英語) を参照してください。

IIS Express 7.5 は IIS 7.5 と同じコード ベースから構築され、SSL、URL 書き換え、MIME の種類などの IIS 機能を Web 開発者の開発コンピューターに提供します。この開発コンピューターは、完全製品版の Web サーバーと同様の機能を保持することになります。

IIS Express 7.5 は、Web PI (bit.ly/dfikKe) またはスタンドアロン インストーラー (www.microsoft.com/downloads/ja-jp/details.aspx?familyid=abc59783-89de-4adc-b770-0a720bb21deb&displaylang=ja-nec) を使用してダウンロードおよびインストールできます。

たとえば、Visual Web Development Server (旧称 "Cassini" という非常に小さな Web サーバー) を使用する、既存の Web サイトまたは Web プロジェクトがあるとします。この場合、ソリューション エクスプローラーで Web プロジェクトを右クリックし、IIS Express 7.5 を使用するようにプロジェクトを変換できます (図 3 参照)。

Converting from Visual Web Development Server to IIS Express 7.5

図 3 Visual Web Development Server から IIS Express 7.5 への変換

Visual Studio 2010 SP1 によって確認メッセージが表示され、Web プロジェクトが IIS Express 7.5 を使用するように正常に設定されていることが示されます。

ただし、IIS Express 7.5 を使用するように何度も繰り返しプロジェクトを設定するのは面倒です。そのような場合、IIS Express 7.5 をすべてのプロジェクトの既定の Web サーバーに設定できます。これを行うには、[ツール] メニューの [オプション] をクリックし、[オプション] ダイアログ ボックスで [プロジェクトおよびソリューション] の [Web プロジェクト] をクリックします。[新しいファイルベースの Web サイトおよびプロジェクトに対して IIS Express を使用する] チェック ボックスをオンにします (図 4 参照)。

Making IIS Express 7.5 Your Default Web Server

図 4 IIS Express 7.5 を既定の Web サーバーに設定

もちろん、プロジェクトごとに設定を選択し、IIS Express 7.5 から Visual Studio Web Development Server に戻すことも可能です。ソリューション エクスプローラーでプロジェクトを右クリックし、Visual Studio Web Development Server を使用するように変換するだけです。

IIS Express 7.5 と管理者以外のユーザー

IIS Web サイトまたは Web プロジェクトを作成したり、既存の IIS Web サイトまたは Web プロジェクトを開いたりするには、特権を昇格したユーザー (管理者モード) で Visual Studio 2010 SP1 を実行する必要があります。これは、特権を持たない多くのユーザーにとって面倒なことです。IT 部門から制限を受けていることもあれば、適切な理由がなければ管理者として実行することは避けたいと考える場合もあります。

さいわい、管理者アカウントのコンテキストで Visual Studio 2010 SP1 を実行しなくても、Web プロジェクトの Web サーバーとして IIS Express 7.5 を使用できます。IIS Express 7.5 をインストールすれば、すべてのユーザーが管理者以外のユーザーとして Visual Studio 2010 SP1 および IIS Express 7.5 を操作できます。

IIS Express 7.5 のプロパティ

IIS Express 7.5 には、プロパティ ウィンドウから設定できる多数のカスタム プロパティがプロジェクトごとに存在します。プロパティ ウィンドウを表示するには、ソリューション エクスプローラーで該当のプロジェクトをクリックし、F4 キーを押します。図 5 はプロパティ ウィンドウを示しています。

The Project Properties Window

図 5 プロジェクトのプロパティ ウィンドウ

IIS Express 7.5 固有のプロパティは、次のとおりです。

  1. 匿名認証 - 匿名認証を有効または無効にします。匿名認証を有効にすると、クライアント ブラウザーにユーザー名とパスワードを入力しなくても、すべてのユーザーがサイトにアクセスできます。既定では、匿名認証は有効になっています。

  2. マネージ パイプライン モード (統合モードまたはクラシック モード):

    統合モード - ApplicationPool オブジェクトは、IIS 7 および ASP.NET の統合要求処理パイプラインを使用して、マネージ コードの要求を処理します。

    クラシック モード - IIS 7 は、aspnet_isapi.dll を使用してマネージ コードの要求をルーティングします。これにより、アプリケーションが IIS 6 で実行されている場合と同様に要求が処理されます。

  3. SSL 有効 - true に設定すると、そのサイトに対して SSL が有効になります。

  4. SSL URL - SSL URL です。

  5. URL - Web サイトの URL です。

  6. Windows 認証 - このプロパティは有効または無効にできます。Windows NT LAN Manager (NTLM) プロトコルまたは Kerberos プロトコルを使用して認証する場合は、Windows 認証を使用します。

プロパティ ウィンドウで変更した設定は、"My Documents\IISExpress\config\applicationhost.config" に保存されます。これらの設定は "C:\Program Files" フォルダーに保存されません。各ユーザーには、独自の IIS Express 7.5 構成があります。これらは IIS Express 7.5 ローカル インスタンスで厳密に設定され、config ファイルはソリューション ファイルに含まれないため、ソース管理に保存されません。注意してください。

Visual Studio 2010 RTM との IIS Express 7.5 プロジェクトの共有

IIS Express 7.5 を使用するプロジェクトが localhost:20221 にあり、Visual Studio 2010 RTM を使用しているチーム メンバーとそのプロジェクトを共有したいとします。チーム メンバーが自身のコンピューターでその Web プロジェクトを開くと、"ローカル コンピューターにサーバー 'http://localhost:20221' が見つかりませんでした" というエラーが表示されます。

このエラーが発生する理由は、Visual Studio 2010 RTM が IIS Express を認識せず、locahost:20221 を検出しようとするためです。

この問題に対処するには、Web アプリケーション プロジェクトの [プロパティ] ページの [Web] タブで [すべてのユーザーにサーバー設定を適用 (プロジェクト ファイルに格納)] チェック ボックスをオフにします (図 6 参照)。

Make Server Selection and Related Settings on a Per-User Basis
(クリックすると拡大表示されます)

図 6 ユーザーごとにサーバーを選択し、関連する設定を行う

ソリューション エクスプローラーでプロジェクトを右クリックし、[プロパティ] をクリックして、[プロパティ] ページを表示します。

これによって、サーバーの選択 (Visual Web Development Server または IIS Express 7.5) および関連する設定が、プロジェクト ファイルではなくユーザー ファイルにユーザー単位に保存されます。そのため、サーバーの選択はソース管理に保存されません。

その結果、チームの Visual Studio 2010 RTM ユーザーは依然として Visual Studio Development Server を使用でき、Visual Studio 2010 SP1 ユーザーは同じプロジェクトで IIS Express 7.5 を使用できます。Web サイト プロジェクトの場合、プロジェクトを共有し、IIS Express 7.5 を使用できるようにするには、チームのすべてのメンバーが Visual Studio 2010 SP1 を使用している必要があります。

SQL Server CE のサポート

Microsoft SQL Server CE は、無償で提供されている埋め込み型データベースで、ASP.NET Web サイトおよびデスクトップ アプリケーションの構築に使用できます。Microsoft SQL Server CE は、インストールを必要としない簡易データベースです。運用サーバーでは、SQL Server CE データベース エンジンのアセンブリを bin フォルダーに追加するだけで、Web プロジェクトから SQL Server CE データベースを使用できます (Visual Studio によって必要なアセンブリを bin フォルダーに自動追加する方法については、「配置可能な依存関係」で説明します)。

SQL Server CE の詳細については、bit.ly/dsWBbM (英語) および bit.ly/hvgQQV (英語) を参照してください。Visual Studio 2010 SP1 の SQL Server CE のサポートを利用するには、Web PI (bit.ly/maOfQX) またはスタンドアロン インストーラーを使用してコンポーネントをダウンロードできます。スタンドアロン インストーラーを使用する場合は、SQL Server CE ランタイム (www.microsoft.com/downloads/ja-jp/details.aspx?familyid=033cfb76-5382-44fb-bc7e-b3c8174832e2&displaylang=ja-nec) および Visual Studio for SQL Server ツール (bit.ly/kvxEQi) の 2 つのコンポーネントをインストールします。

ここでは、必須コンポーネントをインストールした後に明らかになる SQL Server CE 機能について説明します。

Visual Studio 2010 SP1 では、新しいテンプレートを使用して SQL Server CE データベースを作成できるようになります (図 7 参照) ([新しい項目の追加] ダイアログ ボックスを表示するには、ソリューション エクスプローラーでプロジェクトを右クリックし、[新しい項目の追加] をクリックします)。Visual Studio 2010 SP1 では、Web アプリケーション プロジェクトに .sdf ファイルを追加する際に、System.Data.SqlServerCE への参照が自動的に追加されます。しかし、Web サイトの場合は、web.config が更新されてアセンブリが追加されます。

Creating a SQL Server CE Database
(クリックすると拡大表示されます)

図 7 SQL Server CE データベースの作成

.sdf ファイルを使ってさまざまなタスクを実行する場合、ソリューション エクスプローラーで .sdf ファイルをダブルクリックし、[サーバー エクスプローラー] ペインを表示します (図 8 参照)。

Right-Clicking on an .sdf File to Perform Various Tasks

図 8 .sdf ファイルの右クリックによるさまざまなタスクの実行

サーバー エクスプローラーは、新しいテーブルの作成、既存テーブルの編集、テーブル スキーマの編集、テーブル データの表示などのさまざまなタスクを実行するのに役立ちます。

また、Visual Studio 2010 SP1 のその他のデータ機能 (キーとインデックスの管理など)、Entity Framework デザイナー、およびサーバー エクスプローラーとデータベース エクスプローラーも SQL Server CE データベースをサポートするように更新されています。

Razor のサポート

Visual Studio 2010 SP1 では、Web プロジェクト システムと HTML エディターが新しい Razor 構文をサポートするように変更されています。この新しい構文は、ASP.NET Web ページおよび ASP.NET MVC 3 で使用します。

ASP.NET MVC Razor 構文の詳細については、bit.ly/aj0AuM (英語) を参照してください。

Visual Studio 2010 SP1 の Razor 構文サポートを利用するには、ASP.NET MVC 3 をダウンロードする必要があります。

ASP.NET MVC 3 をダウンロードする Web PI リンクは、bit.ly/biXkTD です。ASP.NET MVC 3 スタンドアロン インストーラーは、www.microsoft.com/downloads/ja-jp/details.aspx?familyid=82cbd599-d29a-43e3-b78b-0f863d22811a&displaylang=ja-nec からダウンロードできます。

ASP.NET MVC 3 と共にインストールされるコンポーネントについては、bit.ly/e7T4A3 (英語) のブログ記事を参照してください。

Razor 構文については、以下のサポートが追加されています。

色付け: Visual Studio 2010 SP1 および ASP.NET MVC 3 では、Razor ファイル (.cshtml または .vbhtml) を開くと、Visual Studio エディターによって HTML コンテンツと C# コンテンツまたは Visual Basic コンテンツが色分けされます。

また、[ツール] メニューの [オプション] をクリックし、[オプション] ダイアログ ボックスで [環境] の [フォントおよび色] をクリックすることで、Razor コード ブロックの既定の背景色を変更することもできます (図 9 参照)。

Changing the Default Background Color for Razor Code Blocks

図 9 Razor コード ブロックの既定の背景色の変更

IntelliSense: Razor ファイルでは、HTML および C# または Visual Basic 言語の完全な IntelliSense サポートが提供されます。図 10 はその例を示しています。

IntelliSense Support for Razor Code
(クリックすると拡大表示されます)

図 10 Razor コードの IntelliSense サポート

デバッグ: 他の言語ファイルに対するサポートと同様に、Razor ファイルにブレークポイントを追加して、IDE のすべてのデバッグ機能 (ステップ オーバーやウォッチ リストなど) を使用できます。

Razor インライン式の場合、余白をクリックしてブレークポイントを追加することはできません。式までカーソルを移動してから、F9 キー (ブレークポイントを追加するショートカット キー) を押すことで追加できます。

配置可能な依存関係

ここまでは、SQL Server CE、Razor、および ASP.NET MVC 3 の機能をダウンロード、インストール、および操作する方法について説明しました。そこで、これらの機能を使用する Web プロジェクトをリモート Web サーバーに発行します。リモート サーバーに SQL Server CE、Razor、または ASP.NET MVC 3 がインストールされているかどうかはわからず、リモート サーバーにインストールできるコンポーネントを制御することもできません。Visual Studio 2010 SP1 は、[配置可能な依存関係の追加] 機能を使用してこれらのコンポーネントのバイナリを "bin に配置" することができます (図 11 参照)。

The Add Deployable Dependencies Feature

図 11 [配置可能な依存関係の追加] 機能

bin フォルダーは Web プロジェクトでは特殊なフォルダーで、ASP.NET によって認識されます。bin フォルダーには、カスタム ASP.NET コントロールのコンパイル済みアセンブリ、コンポーネント、または Web アプリケーションで参照されるその他のコードを含めることができます。

ここでは、Web アプリケーションが、あるコンポーネント (たとえば、SQL Server CE) に依存している可能性があり、この依存コンポーネントがインストールされていないサーバー (SQL Server CE がインストールされていないサーバー) に Web サイトを発行することを想定しています。

"bin に配置" するとは、インストーラーを使用してグローバル アセンブリ キャッシュ (GAC) に依存関係のあるコンポーネントをインストールするのではなく、アプリケーションを配置する際に、依存関係のあるコンポーネントをそのアプリケーションの bin フォルダーにコピーすることを意味します。

ダイアログ ボックスを表示するには、ソリューション エクスプローラーで Web プロジェクトを右クリックし、[配置可能な依存関係の追加] をクリックします。

Visual Studio 2010 SP1 は、コンピューターにインストールされていて配置可能なコンポーネントの一覧を示すダイアログ ボックスを表示します。ASP.NET MVC 3 プロジェクトの場合のみ、追加オプションとして ASP.NET MVC が表示されます (図 12 参照)。

The Add Deployable Dependencies Dialog Box for a Bin Deploy

図 12 bin に配置するための [配置可能な依存関係の追加] ダイアログ ボックス

[OK] をクリックした後にどのような処理が行われるか確認します。Web サイトの場合、選択したコンポーネントに必要なアセンブリが、コンピューター上の依存関係のインストール場所からアプリケーションの bin フォルダーにコピーされます。これで、Web サイトを Web サーバーにコピーまたは発行すると、コンポーネントは bin フォルダーのアセンブリを使用して機能するようになります。

Web アプリケーション プロジェクトでは、選択したコンポーネントのアセンブリが _bin_deployableassemblies フォルダーにコピーされます。Web アプリケーション プロジェクトをビルドするとき、または配置用にパッケージ化するときに、バイナリが _bin_deployableassemblies フォルダーから bin フォルダーにコピーされます。

このため、カスタム ビルド プロセス時に bin フォルダーからファイルを削除しても、プロジェクトの発行時に依存関係のあるコンポーネントが _bin_deployableassemblies フォルダーから再度適切にコピーされます。

HTML 5 および CSS3 のサポート

HTML エディターに HTML5 の暫定サポートが追加されているため、IntelliSense および HTML 要素と属性の検証を利用できます。将来のバージョンの Visual Studio では、HTML5 のエクスペリエンスをさらに向上する完全バージョンを提供する予定です。

HTML5 のサポートを利用するには、[ツール] メニューの [オプション] をクリックし、[テキスト エディター]、[HTML]、[検証] の順にクリックして、リスト ボックスの一覧の [HTML5] をクリックします。または、[HTML ソースの編集] ツール バーで [HTML5] をクリックすることも可能です (図 13 参照)。HTML ファイルまたは Razor ファイルの編集中にツール バーを有効にするには、[表示] メニューの [ツール バー] をポイントし、[HTML ソースの編集] をクリックします。

Selecting HTML5 from the HTML Source Editing Toolbar

図 13 [HTML ソースの編集] ツール バーで [HTML5] をクリックする

Visual Studio 2010 SP1 では、CSS3 のサポートにいくつか機能強化が施されています。ただし、これらの機能強化は HTML5 の機能強化ほど手の込んだものではありません。CSS エディターでは、div:nth-child(2n+1) などのより高度なセレクターと新しい色の値 (rgba、hsl、hsla)、および 8 桁の 16 進数値がサポートされるようになりました。

まとめ

Visual Studio 2010 SP1 では Visual Studio の機能がいくつか強化されていますが、それ以上に、新しい Web コンポーネントとして、IIS Express 7.5、Razor を使用する ASP.NET MVC 3、ツールを含む SQL Server CE、HTML5 や CSS3 など、Web PI と密接に結び付いているコンポーネントと連携します。Visual Studio 2010 SP1 を使用すると Web 開発が快適になるため、こうしたツールをお楽しみいただけたらさいわいです。

Scott Hanselman は、マイクロソフトの支社に勤務する主席コミュニティ アーキテクトです。Twitter (twitter.com/shanselman、英語) でフォローしたり、hanselman.com (英語) で公開されているブログを読んだり、hanselminutes.com (英語) で公開されているポッドキャストを聴いたりすることができます。

Deepak Verma は、マイクロソフト本社に勤務するテスト担当のソフトウェア開発エンジニアです。彼のチームのブログは、blogs.msdn.com/b/webdevtools (英語) で公開されています。