Visual Studio を使用してサイトを配置する (C#)

作成者: Scott Mitchell

PDF のダウンロード

Visual Studio には、Web サイトを配置するためのツールが含まれています。 このチュートリアルでは、これらのツールについて詳しく説明します。

はじめに

前のチュートリアルでは、単純な ASP.NET Web アプリケーションを Web ホスト プロバイダーに配置する方法について説明しました。 具体的には、FileZilla のような FTP クライアントを使用して、必要なファイルを開発環境から運用環境に転送する方法をチュートリアルで説明しました。 Visual Studio には、Web ホスト プロバイダーへの配置を容易にする組み込みのツールも用意されています。 このチュートリアルでは、2 つのツールについて説明します。FTP または FrontPage Server Extensions を使用してリモート Web サーバーとの間でファイルを移動できる Web サイトのコピー ツールと、Web サイト全体を指定した場所にコピーする発行ツールです。

Note

Visual Studio によって提供されるもう 1 つの配置関連ツールは、Web セットアップ プロジェクト アドインです。 Web セットアップ プロジェクトは、Web サイトのコンテンツと構成情報を 1 つの MSI ファイルにパッケージ化します。 このオプションは、イントラネット内に配置されている Web サイトや、顧客が自分の Web サーバーにインストールする事前パッケージ化された Web アプリケーションを販売する企業に最も役立ちます。 Web 配置プロジェクト アドインは、開発環境と運用環境のビルド間の構成の違いを指定しやすくする Visual Studio アドインです。 このチュートリアル シリーズでは、Web セットアップ プロジェクトについて説明しません。Web 配置プロジェクトは、「開発と運用の間の一般的な構成の違い」のチュートリアルにまとめられています。

Web サイトのコピー ツールを使用したサイトの配置

Visual Studio の Web サイトのコピー ツールは、スタンドアロン FTP クライアントと機能が似ています。 簡単に言うと、Web サイトのコピー ツールを使用すると、FTP または FrontPage Server Extensions を使用してリモート Web サイトに接続できます。 FileZilla のユーザー インターフェイスと同様に、Web サイトのコピー ユーザー インターフェイスは 2 つのペインで構成されます。左側のペインにはローカル ファイルが一覧表示され、右側のペインには宛先サーバー上のファイルが一覧表示されます。

Note

Web サイトのコピー ツールは、Web サイト プロジェクトでのみ使用できます。 Visual Studio では、Web アプリケーション プロジェクトを操作しているときにこのツールが提供されます。

Web サイトのコピー ツールを使用して、書評アプリケーションを運用環境に発行する方法を見てみましょう。 Web サイトのコピー ツールは、Web サイト プロジェクト モデルを使用するプロジェクトでのみ機能するため、このツールの使い方は BookReviewsWSP プロジェクトでのみ調べることができます。 そのプロジェクトを開きます。

ソリューション エクスプローラーの Web サイトのコピー アイコンを選択するか (図 1 ではこのアイコンが丸で囲まれています)、[Web サイト] メニューから [Web サイトのコピー] オプションを選択して、Web サイトのコピー ツール プロジェクトを起動します。 どちらの方法でも、図 1 に示す Web サイトのコピー ユーザー インターフェイスが起動します。リモート サーバーにはまだ接続していないため、図 1 の左側のペインのみが表示されます。

The Copy Web Site Tool's User Interface is Divided Into Two Panes

図 1: Web サイトのコピー ツールのユーザー インターフェイスが 2 つのペインに分割されている (クリックするとフルサイズの画像が表示されます)

サイトを配置するには、まず Web ホスト プロバイダーに接続する必要があります。 Web サイトのコピー ユーザー インターフェイスの上部にある [接続] ボタンをクリックします。 これにより、図 2 に示す [Web サイトを開く] ダイアログ ボックスが表示されます。

左側から次の 4 つのオプションのいずれかを選択して、宛先 Web サイトに接続できます。

  • ファイル システム - コンピューターからアクセスできるフォルダーまたはネットワーク共有にサイト配置するには、これを選択します。
  • ローカル IIS - コンピューターにインストールされている IIS Web サーバーにサイトを配置するには、このオプションを使用します。
  • FTP サイト - FTP を使用してリモート Web サイトに接続します。
  • リモート サイト - FrontPage Server Extensions を使用してリモート Web サイトに接続します。

ほとんどの Web ホスト プロバイダーは FTP をサポートしていますが、FrontPage Server Extensions のサポートを提供するものはより少なくなります。 そのため、FTP サイト オプションを選択し、図 2 に示すように接続情報を入力しました。

Screenshot of the Open Web Site dialog, which shows the connection information is filled into the text fields.

図 2: 接続先 Web サイトを指定する (クリックするとフルサイズの画像が表示されます)

接続後、Web サイトのコピー ツールは、リモート サイトのファイルを右側のペインに読み込み、各ファイルの状態 (新規、削除済、変更済、変更なし) を示します。 ローカル サイトからリモート サイトに、またはその逆にファイルをコピーできます。

Web サイトのコピー ツールの動作を確認できるように、BookReviewsWSP プロジェクトに新しいページを追加し、配置してみましょう。 Visual Studio で Privacy.aspx という名前の新しい ASP.NET ページをルート ディレクトリに作成します。 ページでマスター ページ Site.master を使用し、サイトのプライバシー ポリシーをこのページに追加します。 図 3 は、このページが作成された後の Visual Studio を示しています。

Add a New Page Named <code>Privacy.aspx</code> to the Website's Root Folder

図 3: Web サイトのルート フォルダーに Privacy.aspx という名前の新しいページを追加する (クリックするとフルサイズの画像が表示されます)

次に、Web サイトのコピー ユーザー インターフェイスに戻ります。 図 4 に示すように、左側のペインには新しいファイル (Policy.aspxPolicy.aspx.cs) が含まれています。 さらに、これらのファイルは矢印アイコンと [新規] の状態でマークされ、ローカル サイトには存在するがリモート サイトには存在しないことが示されています。

The Copy Web Site Tool Includes the New <code>Privacy.aspx</code> Page in its Left Pane

図 4: Web サイトのコピー ツールの左側のペインに新しい Privacy.aspx ページが含まれている (クリックするとフルサイズの画像が表示されます)

新しいファイルを配置するには、それらを選択し、矢印アイコンを選択してリモート サイトに転送します。 転送が完了すると、ローカルとリモートの両方のサイトに Policy.aspx および Policy.aspx.cs ファイルが存在し、状態は [変更なし] になっています。

新しいファイルの一覧に加えて、Web サイトのコピー ツールでは、ローカルとリモートのサイト間で異なるファイルが強調表示されます。 この動作を確認するには、Privacy.aspx ページに戻り、プライバシー ポリシーにいくつかの単語を追加します。 ページを保存し、Web サイトのコピー ツールに戻ります。 図 5 に示すように、左側のペインの Privacy.aspx ページの状態は [変更済] で、リモート サイトと同期していないことを示しています。

The Copy Web Site Tool Indicates that the <code>Privacy.aspx</code> Page has been Changed

図 5: Web サイトのコピー ツールは、Privacy.aspx ページが変更されたことを示している (クリックするとフルサイズの画像が表示されます)

Web サイトのコピー ツールは、前回のコピー操作以降にファイルが削除されたかどうかも示します。 ローカル プロジェクトから Privacy.aspx を削除し、Web サイトのコピー ツールを最新の情報に更新します。 左側のペインには Privacy.aspx および Privacy.aspx.cs ファイルが残っていますが、最後のコピー操作以降に削除されたことを示す [削除済] の状態になっています。

Web アプリケーションの発行

Visual Studio 内から Web アプリケーションを配置するもう 1 つの方法は、[ビルド] メニューからアクセスできる [発行] オプションを使用することです。 [発行] オプションは、アプリケーションを明示的にコンパイルしてから、必要なすべてのファイルを指定されたリモート サイトにコピーします。 後ほど説明しますが、[発行] オプションは Web サイトのコピー ツールよりも大雑把です。 Web サイトのコピー ツールを使用すると、ローカルおよびリモート サイト上のファイルを調べ、必要に応じて個々のファイルをアップロードまたはダウンロードできますが、[発行] オプションでは Web アプリケーション全体が配置されます。

[発行] オプションを使用すると、必要なすべてのファイルが指定したリモート サイトにコピーされるだけでなく、アプリケーションも明示的にコンパイルされます。 Web アプリケーション プロジェクトを明示的にコンパイルする必要があることを考えると、Web アプリケーション プロジェクトで [発行] オプションを使用できることに驚きはありません。 少し驚くかもしれないのは、[発行] オプションが Web サイト プロジェクトでも使用できることです。 「配置が必要なファイルを決定する」のチュートリアルで説明しているように、Web サイト プロジェクトは、"プリコンパイル" と呼ばれるプロセスを通じて明示的にコンパイルできます。 このチュートリアルでは、Web アプリケーション プロジェクトで [発行] オプションを使用することに重点を置いています。今後のチュートリアルでプリコンパイルについて説明し、その時点で、Web サイト プロジェクトでの [発行] オプションの使用について確認します。

Note

Visual Studio では Web サイト プロジェクトと Web アプリケーション プロジェクトの両方に [発行] オプションを使用できますが、Visual Web Developer では Web アプリケーション プロジェクトに対してのみ [発行] オプションが提供されます。

[発行] オプションを使用した書評アプリケーションの配置を見てみましょう。 まず、Visual Studio で BookReviewsWAP (Web アプリケーション プロジェクト) を開きます。 [発行] メニューから、[BookReviewsWAP プロジェクトのビルド] を選択します。 これにより、構成オプションのうち、ターゲットの場所を求めるダイアログ ボックスが表示されます (図 6 を参照)。 Web サイトのコピー ツールと同様に、ローカル フォルダー、IIS 上のローカル Web サイト、FrontPage Server Extensions をサポートするリモート Web サイト、または FTP サーバー アドレスを指す場所を入力できます。 リモート Web サーバー上のファイルを配置されたファイルに置き換えるか、発行する前にリモート サイト上のすべてのコンテンツを削除するかを選択できます。 コピーするかどうかを指定することもできます。

  • アプリケーションの実行に必要なプロジェクト内のファイルのみ。不要なソース コードとプロジェクト関連のファイルは省略されます。
  • すべてのプロジェクト ファイル。ソース コード ファイルと、ソリューション ファイルなどの Visual Studio プロジェクト ファイルが含まれます。
  • ソース プロジェクト フォルダー内のすべてのファイル。プロジェクトに含まれているかどうかに関係なく、ソース プロジェクト フォルダー内のすべてのファイルがコピーされます。

App_Data フォルダーの内容をアップロードするオプションもあります。

Screenshot of the Publish Web dialog, which shows the filled Delete all existing files prior to publish and Only files needed to run checkboxes.

図 6: 宛先 Web サイトを指定する (クリックするとフルサイズの画像が表示されます)

書評アプリケーションの場合、リモート サイトには、Web サイトのコピー ツールを使用して BookReviewsWSP プロジェクトをコピーするときに配置されたファイルが含まれます。 そのため、まず既存のすべてのコンテンツを削除して、[発行] オプションを開始しましょう。 また、不要なソース コードとプロジェクト ファイルで運用環境を乱雑にするのではなく、必要なファイルだけをコピーしましょう。 これらのオプションを指定したら、[発行] ボタンを選択します。 次の数秒の間に、Visual Studio によって必要なファイルが宛先サイトに配置され、その進行状況が [出力] ウィンドウに表示されます。

図 7 は、発行操作が完了した後の FTP サイト上のファイルを示しています。 マークアップ ページと必要なサーバー側およびクライアント側のサポート ファイルのみがアップロードされていることに注意してください。

Only the Needed Files Were Published to the Production Environment

図 7: 必要なファイルのみが運用環境に発行されている (クリックするとフルサイズの画像が表示されます)

[発行] オプションは、Web サイトのコピー ツールほどきめ細かいツールではありません。 Web サイトのコピー ツールを使用すると、ローカルおよびリモート サイト上のファイルを検査し、それらがどのように異なるかを確認できますが、[発行] オプションにはそのようなインターフェイスはありません。 さらに、Web サイトのコピー ツールを使用すると、1 回限りの変更や、個々のファイルのアップロードまたは削除を行うことができます。 [発行] オプションでは、このようなきめ細かな制御はできません。代わりに、アプリケーション "全体" を発行します。 この動作には長所と短所があります。 プラス面では、[発行] オプションを使用する場合、重要なファイルのアップロードを忘れることはありません。 ただし、非常に大規模な Web サイトに小さな変更を加えた場合はどうなるかを考えてみてください。[発行] オプションを使用すると、変更されたページを 1 つか 2 つ更新することはできず、代わりに Visual Studio がサイト全体を配置するまで待つ必要があります。

運用と開発の環境間で特定のファイルのコンテンツが異なることは珍しくありません。 主な例は、アプリケーションの構成ファイル Web.config です。 [発行] オプションは Web アプリケーション ファイルを無条件でコピーするため、運用環境のカスタマイズされた構成ファイルを開発環境のバージョンで上書きします。 以降のチュートリアルでは、このトピックをさらに詳しく説明し、このような違いが存在する場合に Web アプリケーションを配置するためのヒントを提供します。

まとめ

Web サイトを配置するには、必要なファイルを開発環境から運用環境にコピーする必要があります。 前のチュートリアルでは、FileZilla などの FTP クライアントを使用してファイルを転送する方法を示しました。 このチュートリアルでは、Visual Studio の 2 つの配置ツール (Web サイトのコピー ツールと [発行] オプション) について説明しました。 Web サイトのコピー ツールは、ローカル コンピューターと指定されたリモート コンピューター上のファイルを一覧表示する 2 ペイン インターフェイスを備えているため 2 台のコンピューター間でファイルを簡単にアップロードまたはダウンロードできるという点で、FTP クライアントに似ています。 [発行] オプションは、プロジェクトを明示的にコンパイルし、アプリケーション全体を指定された宛先に配置する、より大雑把なツールです。

プログラミングに満足!

もっと読む

この記事で説明したトピックの詳細については、次のリソースを参照してください。