LoginSignup
1
0

More than 3 years have passed since last update.

ASP .NET Core Tips - 部分ビューが文字化けする

Last updated at Posted at 2019-10-14

概要

ASP .Net CoreでWebサービスを作る手順や作ってる際にハマったこととその解決策を
備忘録として書いています。
今回は、タイトルの通り、部分ビューに日本語を入れたら文字化けした話。

環境

Windows 10
Visual Studio 2019
ASP .Net Core 2.2

内容

まず、プロジェクトテンプレート「ASP .NET Core Webアプリケーション」の
Webアプリケーション(モデル ビュー コントローラー)で作成します。
今回作成するWebアプリはログインできるようにしたかったので、
認証を「個別のユーザーアカウント」に設定しました。

image.png

で、プロジェクトの生成が終わってそのまま実行してみると、
Webブラウザで以下のような画面が表示されます。
image.png

日本人しか使わないアプリなので、まず右上の「Register」や「Login」を日本語に変えようと、
/Views/Sharedフォルダ内の「_LoginPartial.cshtml」を書き換えてみました。
※Register → 登録、Login → ログイン

image.png

再度実行してみると・・・

image.png

文字が化けました・・・。
調べてみると、どうやら_LoginPartial.cshtmlの文字コードが
Shift-JISになっていることが原因のようです。
参考)
http://surferonwww.info/BlogEngine/post/2017/06/16/decoding-problem-caused-by-view-created-by-scaffolding-in-aspnet-core-project.aspx

このファイルをファイルメニューの「名前を付けて保存」で、
エンコード付き(UTF-8 シグネチャ付き)で上書き保存すると、
現象が発生しなくなりました。
image.png

文字コードが確認できるエディタで開いてみると、
/Views/Sharedフォルダ内の5つのファイルのうち、
・_LoginPartial.cshtml
・_ValidationScriptsPartial.cshtml
の2つのファイルの文字コードがShift-JISとなっていました。
※他はUTF-8 BOM付き

このファイル内で、Web画面に表示する文字列に日本語を使った場合は、
エンコード付き上書き保存(UTF-8 のシグネチャ付きで)する必要がありそうです。

なお、エンコード付き上書き保存した後は、
設定した文字コードで上書きされていくので、
この作業はファイル毎に一回でよさそうです。

1
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
0