ASP.NET Core で外部(スマホ)からデバッグする

最近 ASP.NET Core を触っているのですが、最後に触ってから1年半くらい経ってしまって色々忘れてしまっているので、そのメモです。今回は localhost ではなく、ローカル IP アドレスを使ってサーバを立てて、外部の端末から接続する方法です。

やりたいこと

ASP.NET Core で作成した Web ページを、localhost ではなく同一ネットワーク上にある端末(スマホ)からアクセスして表示する。

やり方

適当にプロジェクト(例えば ASP.NET Core MVC)を作成すると、ソリューションエクスプローラー内に launchSettings.json というファイルが生成されています。

f:id:takunology:20210616111053p:plain

中を見てみると、このように記述されています。

{
  "iisSettings": {
    "windowsAuthentication": false,
    "anonymousAuthentication": true,
    "iisExpress": {
      "applicationUrl": "http://localhost:27346",
      "sslPort": 44340
    }
  },
  "profiles": {
    "IIS Express": {
      "commandName": "IISExpress",
      "launchBrowser": true,
      "environmentVariables": {
        "ASPNETCORE_ENVIRONMENT": "Development"
      }
    },
    "MCProjectWebSite": {
      "commandName": "Project",
      "dotnetRunMessages": "true",
      "launchBrowser": true,
      "applicationUrl": "https://localhost:5001;http://localhost:5000;",
      "environmentVariables": {
        "ASPNETCORE_ENVIRONMENT": "Development"
      }
    }
  }
}

この中の、applicationUrl という項目で、ホストになる端末のアドレスを追記します。 例えば、ホストアドレスが 192.168.0.2 でポート 8080 を開放したいときは、https://192.168.0.2:8080; を書きます。

 "applicationUrl": "https://localhost:5001;http://localhost:5000;https://192.168.0.2:8080;"

書けたら保存し、Visual Studio のコンソール または PowerShell でプロジェクトのディレクトリに移動して、dotnet run を実行します。

実行すると、

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]
      Now listening on: https://192.168.0.2:8080
info: Microsoft.Hosting.Lifetime[0]
      Application started. Press Ctrl+C to shut down.

というログが表示されます。あとはホストの https://192.168.0.2:8080 を、スマホなりタブレットなりの端末からアクセスすれば作成した Web ページが表示されるはずです。

うまくいかない場合

オレオレSSLを発行している方は、必ずプロトコルhttps とする必要があります。自分は http で記述していたみたいで、このようなログが表示されました。

C:\Program Files\dotnet\sdk\6.0.100-preview.4.21255.9\Microsoft.Common.CurrentVersion.targets(4501,5): warning MSB3026: "obj\Debug\net5.0\MCProjectWebSite.dll" を "bin\Debug\net5.0\MCProjectWebSite.dll" にコピ ーできませんでした。1000 ミリ秒以内に 1 回目の再試行を開始します。The process cannot access the file 'D:\GitHub\MCProject-WebSite\MCProjectWebSite\bin\Debug\net5.0\MCProjectWebSite.dll' because it is being used by another process.  [D:\GitHub\MCProject-WebSite\MCProjectWebSite\MCProjectWebSite.csproj]

C:\Program Files\dotnet\sdk\6.0.100-preview.4.21255.9\Microsoft.Common.CurrentVersion.targets(4501,5): error MSB4181: "Copy" タスクから false が返されましたが、エラーがログに記録されませんでした。 [D:\GitHub\MCProject-WebSite\MCProjectWebSite\MCProjectWebSite.csproj]

ビルドに失敗しました。

ビルドにも失敗したので、s のつけ忘れに気をつけましょう。

イベントのお知らせ

2021年6月24日(木)20:00 より、MS Tech Camp #8 を開催します!
今回は Microsoft Imagine Cup 2021 に出場した学生チームをお招きして、応募した作品や使用した技術などについての話を伺います。これから開発しようとしている方、学生がどのような技術を用いて何を開発しているのか興味がある方、ぜひご参加ください!社会人の方も大歓迎です!

mspjp.connpass.com