Razor Page プロジェクトを作成する

Microsoft 公式のチュートリアルプロジェクトを作成する

Docker 内にマウントするディレクトリ構成を変更するで次のチュートリアルの準備ができたので、今回からチュートリアルを進めていく。

参考:

チュートリアル: ASP.NET Core の Razor Pages の概要 | Microsoft Docs

プロジェクトを作成する

統合ターミナルを開きます。

プロジェクトを格納するディレクトリ (cd) に変更します。
次のコマンドを実行します。
  dotnet new webapp -o RazorPagesMovie
  code -r RazorPagesMovie
dotnet new コマンド : RazorPagesMovie フォルダーに新しい Razor Pages プロジェクトが作成されます。

code コマンドを実行すると、Visual Studio Code の現在のインスタンス内で RazorPagesMovie フォルダーが開きます。
チュートリアル: ASP.NET Core の Razor Pages の概要 | Microsoft Docs

Docker 内にマウントするディレクトリ構成を変更するで作成した Projects ディレクトリでやってみる。

まずは dotnet SDK コンテナを立ち上げる。

$ ./run_SDK_container.sh 
# ls
Projects  etc       media     proc      sbin      tmp
bin       home      mnt       root      srv       usr
dev       lib       opt       run       sys       var
# cd Projects/
# ls
WebApp

ホストの Projects ディレクトリがマウントされていて、その中間で移動した。ここで RazorPagesMovie を作成する。

# dotnet new webapp -o RazorPagesMovie
Getting ready...
The template "ASP.NET Core Web App" was created successfully.
This template contains technologies from parties other than Microsoft, see https://aka.ms/aspnetcore/3.1-third-party-notices for details.

Processing post-creation actions...
Running 'dotnet restore' on RazorPagesMovie/RazorPagesMovie.csproj...
  Determining projects to restore...
  Restored /Projects/RazorPagesMovie/RazorPagesMovie.csproj (in 131 ms).

Restore succeeded.

# ls
RazorPagesMovie  WebApp

作成できた。とりあえず実行してみる。

# cd RazorPagesMovie/
# dotnet run
warn: Microsoft.AspNetCore.DataProtection.Repositories.FileSystemXmlRepository[60]
      Storing keys in a directory '/root/.aspnet/DataProtection-Keys' that may not be persisted outside of the container. Protected data will be unavailable when container is destroyed.
warn: Microsoft.AspNetCore.DataProtection.KeyManagement.XmlKeyManager[35]
      No XML encryptor configured. Key {4d734ed9-6c6d-45be-850c-6827b7f10d84} may be persisted to storage in unencrypted form.
warn: Microsoft.AspNetCore.Server.Kestrel[0]
      Unable to bind to https://localhost:5001 on the IPv6 loopback interface: 'Address not available'.
warn: Microsoft.AspNetCore.Server.Kestrel[0]
      Unable to bind to http://localhost:5000 on the IPv6 loopback interface: 'Address not available'.
info: Microsoft.Hosting.Lifetime[0]
      Now listening on: https://localhost:5001
info: Microsoft.Hosting.Lifetime[0]
      Now listening on: http://localhost:5000
info: Microsoft.Hosting.Lifetime[0]
      Application started. Press Ctrl+C to shut down.
info: Microsoft.Hosting.Lifetime[0]
      Hosting environment: Development
info: Microsoft.Hosting.Lifetime[0]
      Content root path: /Projects/RazorPagesMovie

動いたが、 URL を変更しないとホスト側からアクセスできない。中止して変更する。

ホスト側から Projects/RazorPagesMovie にアクセスする。

$ cd Projects
$ ls
RazorPagesMovie	WebApp
$ cd RazorPagesMovie

Program.cs を編集する。

$ vimr Program.cs

using System;
using System.Collections.Generic;
using System.Linq;
using System.Threading.Tasks;
using Microsoft.AspNetCore.Hosting;
using Microsoft.Extensions.Configuration;
using Microsoft.Extensions.Hosting;
using Microsoft.Extensions.Logging;

namespace RazorPagesMovie
{
    public class Program
    {
        public static void Main(string[] args)
        {
            CreateHostBuilder(args).Build().Run();
        }

        public static IHostBuilder CreateHostBuilder(string[] args) =>
            Host.CreateDefaultBuilder(args)
                .ConfigureWebHostDefaults(webBuilder =>
                {
                    webBuilder.UseStartup<Startup>()
                    .UseUrls("http://0.0.0.0:5000"); // 追加
                });
    }
}

実行してホスト側から接続して確認してみる。コンテナ側で動作させる。

# dotnet run
warn: Microsoft.AspNetCore.DataProtection.Repositories.FileSystemXmlRepository[60]
      Storing keys in a directory '/root/.aspnet/DataProtection-Keys' that may not be persisted outside of the container. Protected data will be unavailable when container is destroyed.
info: Microsoft.Hosting.Lifetime[0]
      Now listening on: http://0.0.0.0:5000
info: Microsoft.Hosting.Lifetime[0]
      Application started. Press Ctrl+C to shut down.
info: Microsoft.Hosting.Lifetime[0]
      Hosting environment: Development
info: Microsoft.Hosting.Lifetime[0]
      Content root path: /Projects/RazorPagesMovie
warn: Microsoft.AspNetCore.HttpsPolicy.HttpsRedirectionMiddleware[3]
      Failed to determine the https port for redirect.

ホスト側から http://localhost:5000 にアクセスする。

接続確認できた。

https でアクセスできるようにする。

URLを https://localhost:5001 でアクセスできるようにしてみる。ホスト側でもう一度 Program.cs を変更する。

$ vimr Program.cs

using System;
using System.Collections.Generic;
using System.Linq;
using System.Threading.Tasks;
using Microsoft.AspNetCore.Hosting;
using Microsoft.Extensions.Configuration;
using Microsoft.Extensions.Hosting;
using Microsoft.Extensions.Logging;

namespace RazorPagesMovie
{
    public class Program
    {
        public static void Main(string[] args)
        {
            CreateHostBuilder(args).Build().Run();
        }

        public static IHostBuilder CreateHostBuilder(string[] args) =>
            Host.CreateDefaultBuilder(args)
                .ConfigureWebHostDefaults(webBuilder =>
                {
                    webBuilder.UseStartup<Startup>()
                    .UseUrls(new [] {                 //変更
                          "http://0.0.0.0:5000"
                        , "https://0.0.0.0:5001" 
                     });
                });
    }
}

実行してみる。

# dotnet run
warn: Microsoft.AspNetCore.DataProtection.Repositories.FileSystemXmlRepository[60]
      Storing keys in a directory '/root/.aspnet/DataProtection-Keys' that may not be persisted outside of the container. Protected data will be unavailable when container is destroyed.
info: Microsoft.Hosting.Lifetime[0]
      Now listening on: http://0.0.0.0:5000
info: Microsoft.Hosting.Lifetime[0]
      Now listening on: https://0.0.0.0:5001
info: Microsoft.Hosting.Lifetime[0]
      Application started. Press Ctrl+C to shut down.
info: Microsoft.Hosting.Lifetime[0]
      Hosting environment: Development
info: Microsoft.Hosting.Lifetime[0]
      Content root path: /Projects/RazorPagesMovie

URLが追加されている。アクセスしてみる。

証明書の警告が出た。

Firefox だと http://0.0.0.0:5000 へアクセスしてもリダイレクトされ、上の警告画面が表示される。

特に危険な場所に向かっているわけではないので、 危険性を承知で続行 ボタンを押す。

とりあえず表示できた。

以下、このプロジェクトで生成されたファイルの情報が書かれていたので引用する。

プロジェクトファイルを確認する

以降のチュートリアルで使用するメインプロジェクトフォルダーとファイルの概要を次に示します。

Pages フォルダー

Razor ページとサポートファイルが含まれます。各 Razor ページは、次のファイルのペアとなります。

.cshtml ファイル: HTML マークアップと、Razor 構文を使用した C# コードが含まれます。

.cshtml.cs ファイル: ページイベントを処理する C# コードが保存されます。

サポートファイルには、アンダースコアで始まる名前が付けられます。たとえば、 _Layout.cshtml ファイルでは、すべてのページに共通の UI 要素が構成されます。このファイルでは、ページの上部に表示されるナビゲーションメニューと、ページの下部に表示される著作権の通知が設定されます。詳細については、「 ASP.NET Core でのレイアウト」を参照してください。

wwwroot フォルダー

HTML ファイル、JavaScript ファイル、CSS ファイルなどの静的ファイルが格納されます。詳細については、「 ASP.NET Core の静的ファイル」を参照してください。

appSettings.json

接続文字列などの構成データが保存されます。詳細については、「 ASP.NET Core の構成」を参照してください。

Program.cs

プログラムのエントリポイントが保存されます。詳細については、「 .NET での汎用ホスト」を参照してください。

Startup.cs

アプリの動作を構成するコードが含まれています。詳細については、「 ASP.NET Core でのアプリケーションのスタートアップ」を参照してください。

チュートリアル: ASP.NET Core の Razor Pages の概要 | Microsoft Docs

Razor Page プロジェクトを作成する

Microsoft 公式のチュートリアルプロジェクトを作成する

プロジェクトを作成する

https でアクセスできるようにする。

プロジェクトファイルを確認する

Pages フォルダー

wwwroot フォルダー

appSettings.json

Program.cs

Startup.cs

Technical Note

ASP.NET Core Top

Razor page

Microsoft 公式のチュートリアルプロジェクトを作成する

プロジェクトを作成する

https でアクセスできるようにする。

プロジェクト ファイルを確認する

Pages フォルダー

wwwroot フォルダー

appSettings.json

Program.cs

Startup.cs

Technical Note

ASP.NET Core Top

Razor page

プロジェクトファイルを確認する