ASP.NET Core MVCとデータベースを使ったWebアプリをつくって公開しようとしたところ、ページがうまく表示されないなどいくつかハマった点があったので、今回はそのことについて書きます。

ASP.NET Core MVC は、モデル ビュー コントローラー デザイン パターンを使用して、WebアプリとAPIをビルドするためのフレームワークです。ここではアプリケーションをモデル、ビュー、コントローラーという3つの主要なコンポーネントのグループに分けます。そうすることでコーディング、デバッグ、テストをしやすくします。

基本的にASP.NET Core MVC の概要を参考に進めます。ただSQL Server Express LocalDBではサーバー上に公開できなさそうなので、SQLiteに変更します。

アプリを作成する

文章だけだと説明しにくいので動画もつくりました。動画だと文字が小さくて読みにくいのでこのページとあわせてみていただければわかりやすくなるかもしれません。

最初にデータモデルクラスを追加します。Modelsフォルダーを右クリックし、新しいクラス(Movieクラス)を作成します。

そのあと[パッケージ マネージャー コンソール]でMicrosoft.EntityFrameworkCore.SQLiteをインストールします。

次にスキャフォールディングを実行します。

Scaffolding(スキャフォールディング)とは、データモデルとなる型を元に、いわゆる追加、読込、変更、削除を行う画面とそのコードを自動で生成する機能です。

コントロールの上で右クリックして新規スキャフォールディングアイテムを選択して、ダイアログで、[Entity Framework を使用したビューがある MVC コントローラー]を選択します。

[モデル クラス] ドロップ ダウンで、 [Movie] を選択します。
[データ コンテキスト クラス] 行で、[+] (プラス) 記号を選択し、生成されたものを選択します。
他はそのままでOKです。

コードが自動生成されます。

その一部を書き換えます。

Program.cs

appsettings.json

となっている部分を

と書き換えます。

次にデータベース作成と更新をおこないます。

パッケージマネージャコンソールのウィンドウから以下を一行ずつ実行していきます。

あとはビルドしてビルドが通れば実際にローカルで動作させてみます。localhost:5000/Moviesにアクセスしてデータの追加、編集、削除ができるか確認します。

サーバーで公開したい

完成したので他の人にも見てもらうために公開したいのですが、ここからハマりどころがたくさんあります。

NET 6.0をエックスサーバーにインストールするにあるようにappsettings.jsonを修正してアップロードするだけではうごきません。

e_sqlite3.dllがない

<えらー>

エラーの内容はProgram.csを編集すれば表示されるようになります。

Program.cs

すると以下のようなエラーメッセージが表示されます。

DllNotFoundException: Unable to load DLL ‘e_sqlite3’ or one of its dependencies: 指定されたモジュールが見つかりません。 (0x8007007E)

e_sqlite3.dllがないと言っているのですが、一体どこにあるのでしょうか?

bin\Release\net6.0\runtimes\win-x64\nativeのなかにあります。これをサーバーにアップロードするファイルが出力されているフォルダであるbin\Release\net6.0\publishにコピーします。

次にsample.dbというSQLiteのファイルがあるのですが、サイズが0であることに気がつきます。これはソリューションエクスプローラに表示されているsample.dbのプロパティ「出力ディレクトリにコピー:常にコピーする」を選択すれば解決します。

.htaccessを編集する

これであとはサーバー上にアップロードすればいいのかというとそうではありません。

まず新しくサブドメインをつくってそこに公開する場合ですが、トップページにアクセスしたときになにも表示されません。

https://example.lets-csharp.com/ なにも表示されない
https://example.lets-csharp.com/Home/ Welcomeのページが表示される
https://example.lets-csharp.com/Home/Index Welcomeのページが表示される
https://test3.lets-csharp.com/Movies/ 今回作成したアプリケーションが表示される
https://test3.lets-csharp.com/Movies/Index 今回作成したアプリケーションが表示される

これはルーティングのさいに

としているため、トップページにアクセスするときはhttps://example.lets-csharp.com/Home/を表示できるようにしておかないといけません。

そのためには.htaccessを以下のように変更します。これで表示されるようになります。

次にサブディレクトリで公開するときですが、リンクや他のタグヘルパーが正常に機能するようにASP.NET Core のタグヘルパーを再定義します。

https://lets-csharp.com/samples/2207/first-mvc/Movies で公開しているので動作確認をしてみてください。

それからもうひとつ修正する箇所があります。MoviesControllerクラスのなかでRedirectToActionメソッドを呼び出していますが、これだと https://lets-csharp.com/samples/2207/first-mvc/Movies/Create で作成の処理が終わったら https://lets-csharp.com/samples/2207/first-mvc/Movies へ戻らないといけないのに https://lets-csharp.com/Movies にリダイレクトされてしまいます。そこでRedirectメソッドを呼び出して https://lets-csharp.com/samples/2207/first-mvc/Movies にリダイレクトさせています。

EditメソッドととDeleteConfirmedメソッドにも似たような箇所があるので修正しておきます。これでサブディレクトリでも公開できるはずです。