nuits.jp blog

C#, Xamarin, WPFを中心に書いています。Microsoft MVP for Development Technologies。

リモートのIISへVisual StudioからWebアプリをWeb Deployする

本エントリーでは Visual Studio 上で ASP.NET などで実装した Web アプリケーションをリモートの IIS 上に公開する方法を記載します。

毎回忘れてしまうんですよね…

オンプレミス環境でTFSなどから自動ビルド・自動配置するときにも、この設定が適用できます。

1. 前提条件

  • Windows Server 2016 Standard Version 1607
  • Visual Studio 2017 Version 15.5.6
  • .NET Framework 4.7.1
  • IIS 10.0
  • 公開サーバーの名称は「WinServer2016Ap」とする

Windows Server はインストールし最新のパッチを当てたのみで、IIS のインストールも手順に含みます。

2. .NET Framework 4.7.1のインストール

本エントリーの本質とは関係ないのですが(異なる .NET Framework のバージョンでも操作方法は変わりません)、今から作成する ASP.NET アプリで古い .NET Framework を選定する理由も少ないため、念のため現時点(2018/02/15)で最新のバージョンをインストールします。

つぎのサイトからダウンロードしてインストールしてください。

https://www.microsoft.com/en-us/download/confirmation.aspx?id=56116

アドレスは変わっている可能性がありますので、ご注意ください。

3. IISをインストールする

サーバーマネージャーを開き、「役割と機能の追加」を選択します。

f:id:nuitsjp:20180217120739p:plain

「役割と機能の追加 ウィザード」が開かれるので、「次へ」を押下してください。

f:id:nuitsjp:20180217120837p:plain

つづいて「役割ベースまたは機能ベースのインストール」を選択し、「次へ」を押下します。

f:id:nuitsjp:20180217120946p:plain

公開先のサーバーが正しく選択されているのを確認し、「次へ」を押下。

f:id:nuitsjp:20180217121125p:plain

「サーバーの役割の選択」画面で、「Web サーバー (IIS)」を選択します。

f:id:nuitsjp:20180217121222p:plain

すると、つぎのようなダイアログが表示されるので、そのまま「機能の追加」を押下してください。

f:id:nuitsjp:20180217121303p:plain

ダイアログが閉じたら、そのまま「次へ」を押下します。

f:id:nuitsjp:20180217121342p:plain

つづいて開かれる「機能の選択」画面で「ASP.NET 4.6」を選択し、「次へ」を押下してください。

.NET Framework 4.7.1 を入れたため不安に思われるかもしれませんが、こちらはASP.NETのバージョンなので 4.6 で問題ありません。

f:id:nuitsjp:20180217121528p:plain

つづいて開かれた画面でそのまま「次へ」を押下。

f:id:nuitsjp:20180217121606p:plain

「役割とサービスの選択」画面が開かれるため、「アプリケーション開発」を開いて、「ASP.NET 4.6」を選択します。

f:id:nuitsjp:20180217121752p:plain

開かれたダイアログでそのまま「機能の追加」を押下します。

f:id:nuitsjp:20180217121833p:plain

ダイアログが閉じたら、さらに「管理ツール」の下の「管理サービス」を選択して、「次へ」を押下しましょう。

f:id:nuitsjp:20180217121945p:plain

オプションの確認画面が開かれますので、念のため必要に応じて再起動をチェックし、「インストール」を押下してください。

おそらく再起動は不要ですが、必要だった場合に再起動忘れでトラブルことがあるので、再起動して問題ない場合はチェックをつけるように私はしています。

f:id:nuitsjp:20180217122216p:plain

しばらく待って、つぎのように表示されたら正常に IIS のインストールは完了です。

f:id:nuitsjp:20180217122313p:plain

4. Microsoft Web Deployのインストール

IIS へWeb配置するためには、別途「Microsoft Web Deploy」をダウンロードしてインストールする必要があります。

執筆時点(2018/02/17)では最新版の 3.6 が以下のアドレスに公開されていました。

https://www.microsoft.com/ja-jp/download/details.aspx?id=43717

ダウンロードし実行した画面で、「次へ」を押下します。

f:id:nuitsjp:20180217122706p:plain

使用許諾を確認し問題なければ、同意にチェックして「次へ」を押下してください。

f:id:nuitsjp:20180217170911p:plain

つづいて「セットアップ種類の選択」画面が開かれます。ここでは必ず「完全」を選択してください。標準だと必要な機能がインストールされません(よく私はここでハマります)。

f:id:nuitsjp:20180217123028p:plain

そして「インストール」を押下するとインストールが始まります。

f:id:nuitsjp:20180217123119p:plain

しばらく待って、次の画面が表示されたら「Microsoft Web Deploy」のインストールは完了です。

f:id:nuitsjp:20180217123152p:plain

5. IIS マネージャー ユーザーの追加

それではここから IIS の設定をしていきます。

まずは Web Deploy するためのユーザー(とパスワード)を作成します。OSのユーザーを利用することもできますが、セキュリティ的に配置のみで、Windowsにはログインできないユーザーを利用した方が好ましいと思います。

「サーバー マネージャー」から「ツール」 > 「インターネット インフォメーション サービス(IIS) マネージャー」を選択します。

f:id:nuitsjp:20180217123554p:plain

「IIS マネージャー」が開かれたら、対象のサーバーを選択し、「IIS マネージャー ユーザー」を開きます。

f:id:nuitsjp:20180217123844p:plain

「ユーザーの追加」を選択。

f:id:nuitsjp:20180217123915p:plain

ユーザー名とパスワードを入力し、「OK」を押下します。ここではユーザー名は「HelloWebDeploy」としました。

f:id:nuitsjp:20180217124019p:plain

6. 公開サイトの追加

つづけて公開対象のサイトを作成します。

まずは ASP.NET アプリを配置するフォルダを作成します。ここでは「C:\inetpub\HelloWebDeploy」にする事としました。

f:id:nuitsjp:20180217124407p:plain

公開対象のサイトはポートに今回は80番を利用したいため、「Default Web Site」を削除します。

f:id:nuitsjp:20180217124216p:plain

つづいて公開対象のサイトを作ります。「サイト」を右クリックし「Web サイトの追加」を選択してください。

f:id:nuitsjp:20180217124535p:plain

追加するサイト情報を入力します。

サイト名は「HelloWebDeploy」にし、物理パスには先ほど作成した「C:\inetpub\HelloWebDeploy」を設定、ホスト名を入力し、「OK」を押下してください。

f:id:nuitsjp:20180217161352p:plain

これでサイトが作成されました。

7. Web 配置による発行の有効化

つづいて作成したサイトのWeb 配置を有効化します。

新しく作成したサイトを右クリックし、「展開」 > 「Web 配置による発行の有効化...」を選択します。

f:id:nuitsjp:20180217163320p:plain

「発行アクセス許可を付与するユーザーを選択します」の右下の「...」を押下してください。

f:id:nuitsjp:20180217163453p:plain

「IIS マネージャー(M)」を選び、「選択(E)…」を押下します。

f:id:nuitsjp:20180217163621p:plain

開かれたダイアログで、さきほど「IIS ユーザー マネージャー」で作成した「HelloWebDeploy」を選択し、「OK」を押下。

f:id:nuitsjp:20180217163737p:plain

つづけて「OK」を押下し

f:id:nuitsjp:20180217163813p:plain

「設定」を押下することで、設定は完了です。

f:id:nuitsjp:20180217163855p:plain

設定完了後、ダイアログは閉じられないため、「閉じる(C)」を押下してください。

f:id:nuitsjp:20180217163953p:plain

8. Web Deployポートの解放

Web配置は有効化しましたが、デフォルトではファイアウォールのポートが開かれていないません。

そこでファイアウォールを開く手続きをしましょう。

「サーバー マネージャー」で「ツール」 > 「セキュリティが強化された Windows ファイアウォール」を選択します。

f:id:nuitsjp:20180217164223p:plain

つづいて「受信の規制」 > 「新しい規則...」を選択してください。

f:id:nuitsjp:20180217164339p:plain

「ポート」を選択し「次へ」を押下。

f:id:nuitsjp:20180217164441p:plain

Web配置のデフォルトポート「8172」を入力し、「次へ」を押下します。

f:id:nuitsjp:20180217164549p:plain

つづけて「次へ」を押下し

f:id:nuitsjp:20180217164626p:plain

ここでも「次へ」を押下。

f:id:nuitsjp:20180217164658p:plain

最後に「名前」を入力し(私は「Microsoft Web Deploy」としました)、「完了」を押下して設定完了です。

f:id:nuitsjp:20180217164815p:plain

以上でサーバー上での作業は終了です。クライアントでの作業に移りましょう。

9. ASP.NETアプリを作成し発行する

Visual Studio を起動し、新しくプロジェクトを作成しましょう。

「Web」 > 「ASP.NET Web アプリケーション(.NET Framework)」を選択し、名前を「HelloWebDeploy」として「OK」を押下してください。

f:id:nuitsjp:20180217165120p:plain

開かれたダイアログで「MVC」を選択し、「OK」を押下します。

f:id:nuitsjp:20180217165222p:plain

作成されたデフォルトの状態で発行の設定をします。

ソリューションエクスプローラーでプロジェクトを右クリックし、「発行(B)...」を選択。

f:id:nuitsjp:20180217165338p:plain

「IIS、FTP、その他」を選択し、「発行」を押下します。

f:id:nuitsjp:20180217165504p:plain

各項目に、つぎのように入力します。

  1. サーバー:https://{ホスト名}:8172/msdeploy.axd
  2. サイト名:IIS 上に作成したサイト名(ASP.NETのプロジェクト名とは非依存) 。ここでは「HelloWebDeploy」
  3. ユーザー名:IIS ユーザー マネージャーで作成したアカウント。ここでは「HelloWebDeploy」
  4. パスワード:同アカウントのパスワード

入力したら「接続の検証(V)」を押下し、緑のチェックマークがでれば設定はOKです。「次へ」を押下しましょう。

f:id:nuitsjp:20180217170027p:plain

するとサーバーのセキュリティ証明書が信頼されていないと警告がでますが、そのまま「承諾」を押下。

f:id:nuitsjp:20180217170119p:plain

つぎの設定は運用に合わせれば良いのですが、個人的には削除してはいけないファイルを削除してしまったが、テスト環境では残っていてユーザー環境でエラーになるのが嫌なので、「発行先の追加ファイルを削除する(V)」にはチェックすることが多いです。

設定したら「保存」を押下します。

f:id:nuitsjp:20180217170403p:plain

すると初回時はそのままビルドが実行、リモートの IIS へ Web配置され、ブラウザが開かれ該当サイトが表示されます。

f:id:nuitsjp:20180217170454p:plain

以上で設定完了です。 結構手続きが多いですよね。