質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
87.20%
.NET Core

.NET Coreは、マネージソフトウェアフレームワークでオープンソースで実装されています。クロスプラットフォームを前提に考えられており、Windows/Mac/Linuxで動くアプリケーションを作成することが可能です。

HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

ASP.NET

ASP.NETは動的なWebサイトやWebアプリケーション、そしてWebサービスを構築出来るようにする為、Microsoftによって開発されたウェブアプリケーション開発フレームワークです。

解決済

Rezor PagesでDBの画像を表示したい

daue111
daue111

総合スコア1

.NET Core

.NET Coreは、マネージソフトウェアフレームワークでオープンソースで実装されています。クロスプラットフォームを前提に考えられており、Windows/Mac/Linuxで動くアプリケーションを作成することが可能です。

HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

ASP.NET

ASP.NETは動的なWebサイトやWebアプリケーション、そしてWebサービスを構築出来るようにする為、Microsoftによって開発されたウェブアプリケーション開発フレームワークです。

1回答

0評価

0クリップ

439閲覧

投稿2022/04/04 03:02

編集2022/04/07 13:14

Rezor PagesでWebサービスを作ろうとしています。
Postgresqlにbytea型で入っている画像データを表示しようとしています。
チュートリアルを見ながらなんとか作ってみて、デバッグ実行してブラウザに表示してみると、画像データが「25521625521906・・・」という長い数値で表示されました。
モデルでは

c#

public byte[] item_image { get; set; }

というプロパティになっているので、byte配列に入った画像データをそのまま表示したからこういう表示になったんだろうと思いました。

これを画像にしたいので、base64にすればよいだろうと思い、cshtmlを書き換えてみました。
元のcshtmlがこれです。

cshtml

@page @model myService.Pages.Items.DetailsModel @{ ViewData["Title"] = "detail"; } <h1>Detail</h1> <div> <hr /> <dl class="row"> <dt class="col-sm-2"> 画像連番 </dt> <dd class="col-sm-10"> @Html.DisplayFor(model => model.image_tbl.item_image_id) </dd> <dt class="col-sm-2"> 画像 </dt> <dd class="col-sm-10"> <!-- ここを書き換え --> @Html.DisplayFor(model => model.v_master.item_image) <!-- ここを書き換え ここまで--> </dd> </dl> </div> <div> <a asp-page="./Index">一覧に戻る</a> </div>

  

  • 試行錯誤1

「ここを書き換え」の箇所を、以下のように書き換えてみました。

cshtml

<img id="getimage" src="data: image;base64, @System.Convert.ToBase64String(model.v_master.item_image)" />

modelが存在しないというコンパイルエラーになりました。

  • 試行錯誤2

そこでこのように書き換えてみました。

cshtml

@Html.DisplayFor(model => System.Convert.ToBase64String(model.v_master.item_image))

コンパイルエラーは出ませんでしたが、デバッグ実行してみると、以下のようなエラーになりました。
An unhandled exception occurred while processing the request.
InvalidOperationException: Templates can be used only with field access, property access, single-dimension array index, or single-parameter custom indexer expressions.
@Html.DisplayForに続けて関数を書くことはできないらしいと分かりました。

  • 試行錯誤3

ではモデルの方で書き換えてしまえばよいのではとこのように書き換えてみました。

c#

public byte[] _item_image; public byte[] item_image { get { string image64 = "data:image/jpeg;base64," + Convert.ToBase64String(_item_image); return image64; } set { _item_image = value; } }

byte[]とstringの型違いでコンパイルエラーになりました。

  • 試行錯誤4

ではメソッドを追加してしまえばいいのではと、モデルの方に関数を追加してみました。

c#

public byte[] _item_image; public byte[] item_image { get { return _item_image; } set { _item_image = value; } } public string GetItemImage() { return "data:image/jpeg;base64," + Convert.ToBase64String(_item_image); }

cshtmlでは関数の方を書いてみました。

cshtml

@Html.DisplayFor(model => model.v_master.GetItemImage())

これもコンパイルエラーにはなりませんでしたが、デバッグ実行すると、さっきも見たエラーになりました。
An unhandled exception occurred while processing the request.
InvalidOperationException: Templates can be used only with field access, property access, single-dimension array index, or single-parameter custom indexer expressions.

ここでお手上げになってしまいました。画像で表示するにはどうすればいいのでしょうか。


開発環境は以下の通りです :
・OS Windows10-64bit
・Visual Studio のバージョン 2019
・.NET Framework なのか Core のどっちかなのかとそのバージョン
プロジェクトのプロパティの「対象のフレームワーク」に「.NET core3.1」とあるのでこれだと思います。
・Visual Studio でプロジェクトを作る時に使ったテンプレートは何か
ロジェクトを作るときのウィザードの「新しいプロジェクトの作成」で、「ASP.NET Core Webアプリ サンプルのASP.NET Razor PagesコンテンツでASP.NET Coreアプリケーションを作成するためのプロジェクト テンプレートです」というのを選択しました。テンプレートとはこれのことでしょうか?

良い質問の評価を上げる

以下のような質問は評価を上げましょう

  • 質問内容が明確
  • 自分も答えを知りたい
  • 質問者以外のユーザにも役立つ

評価が高い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。

気になる質問をクリップする

クリップした質問は、後からいつでもマイページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

teratailでは下記のような質問を「具体的に困っていることがない質問」、「サイトポリシーに違反する質問」と定義し、推奨していません。

  • プログラミングに関係のない質問
  • やってほしいことだけを記載した丸投げの質問
  • 問題・課題が含まれていない質問
  • 意図的に内容が抹消された質問
  • 過去に投稿した質問と同じ内容の質問
  • 広告と受け取られるような投稿

評価を下げると、トップページの「アクティブ」「注目」タブのフィードに表示されにくくなります。

SurferOnWww

2022/04/04 04:22 編集

ASP.NETの話なら ASP.NET のタグをつけてください。 そして、開発環境(OS は何か, Visual Studio のバージョン、.NET Framework なのか Core のどっちかなのかとそのバージョン、Visual Studio でプロジェクトを作る時に使ったテンプレートは何かなど)を書いてください。
daue111

2022/04/04 06:29

ASP.NETとは何のことか調べました。それのことです。タグ付けました。有難う御座います。 開発環境について何を書けばいいか教えていただいて有難う御座います。 以下の通りです。 ・OS Windows10-64bit ・Visual Studio のバージョン 2019 ・.NET Framework なのか Core のどっちかなのかとそのバージョン   プロジェクトのプロパティの「対象のフレームワーク」に「.NET core3.1」とあるのでこれだと思います。 ・Visual Studio でプロジェクトを作る時に使ったテンプレートは何か   ロジェクトを作るときのウィザードの「新しいプロジェクトの作成」で、「ASP.NET Core Webアプリ サンプルのASP.NET Razor PagesコンテンツでASP.NET Coreアプリケーションを作成するためのプロジェクト テンプレートです」というのを選択しました。テンプレートとはこれのことでしょうか?
SurferOnWww

2022/04/04 07:27

追加情報は上の質問欄を編集してそちらに追記してください。ここコメント欄は「質問への追記・修正の依頼」を行う場所ですので。
SurferOnWww

2022/04/04 13:54

質問者さん、その後無言ですが、解決したならクローズする、不明な点があれば質問するなどのフォローをお願いします。

まだ回答がついていません

会員登録して回答してみよう

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
87.20%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問

同じタグがついた質問を見る

.NET Core

.NET Coreは、マネージソフトウェアフレームワークでオープンソースで実装されています。クロスプラットフォームを前提に考えられており、Windows/Mac/Linuxで動くアプリケーションを作成することが可能です。

HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

ASP.NET

ASP.NETは動的なWebサイトやWebアプリケーション、そしてWebサービスを構築出来るようにする為、Microsoftによって開発されたウェブアプリケーション開発フレームワークです。