ASP.NETでファイルのダウンロード機能を実装する方法

ASP.NET

.NET
ASP.NET
C#
プログラミング言語

公開日時: 2020-09-25 　更新日時: 2022-06-09

この記事でわかること

ASP.NETとは、C#やVB.NETで開発できるWebアプリケーションのフレームワークです。Webアプリを作成する際に、よく使う機能にファイルのダウンロードがあります。サーバサイドで実装して、ユーザーが使うクライアントに出力するので、少し難しく感じるかもしれませんが、サーバサイドで、HttpResponseを使うとこの機能は比較的簡単に実装できます。ここではこのダウンロードをする方法について解説していきます。

システム エンジニア: ASP.NETを利用して、Webアプリを開発中です。仕様書にファイルのダウンロードをするように明記されているのですが、どうやってコーディングを行えば良いのでしょうか？

プロジェクト マネージャー: ファイルのダウンロードを行う場合には、HttpResponseを使って実装します。簡単なサンプルプログラムを提供しますので、確認してみましょう。

実行環境
・Visual Studio Community 2017

ASP.NETを使ってファイルダウンロードを実装する

それでは早速ですが、ASP.NETを活用してのファイルのダウンロードを行う方法を、サンプルプログラムをもとに解説していきます。

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="WebApplication21.WebForm1" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
        <div>
            <asp:Button ID="btnDownload" runat="server" Text="ダウンロード" OnClick="btnDownload_Click"/>
        </div>
    </form>
</body>
</html>

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="WebApplication21.WebForm1" %>

<!DOCTYPE html>

</head>

<body>

<div>

<asp:Button ID="btnDownload" runat="server" Text="ダウンロード" OnClick="btnDownload_Click"/>

</div>

</form>

</body>

</html>

using System;

namespace WebApplication21
{
    public partial class WebForm1 : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            
        }


        public void btnDownload_Click(object sender, EventArgs e)
        {

            var filename = @"test.txt";
            Response.Clear();
            Response.ContentType = "text/plain";
            Response.HeaderEncoding = System.Text.Encoding.UTF8;
            Response.ContentEncoding = System.Text.Encoding.UTF8;
            Response.AddHeader("Content-Disposition", "attachment;filename=" + Server.UrlEncode(filename));
            Response.End();

        }
    }
}

using System;

namespace WebApplication21

{

public partial class WebForm1 : System.Web.UI.Page

{

protected void Page_Load(object sender, EventArgs e)

{

}

public void btnDownload_Click(object sender, EventArgs e)

{

var filename = @"test.txt";

Response.Clear();

Response.ContentType = "text/plain";

Response.HeaderEncoding = System.Text.Encoding.UTF8;

Response.ContentEncoding = System.Text.Encoding.UTF8;

Response.AddHeader("Content-Disposition", "attachment;filename=" + Server.UrlEncode(filename));

Response.End();

}

実行結果
◆ダウンロードボタンを押下する

◆ダウンロード成功

上記のプログラミングで大事なポイントは、Content-Typeに何を指定するかです。今回はテキストファイルを出力するためのContent-Typeとしてtext/plainを指定しました。他のファイルを出力するためのContent-Typeも多数そろえられていますので、ここでは代表的なContent-Typeの種類を確認しておきましょう。

■Content-Typeの種類

Content-Type	出力ファイル様式
text/plain	テキストファイル
text/csv	CSVファイル
text/html	HTMLファイル
application/octet-stream	EXEファイルなどの実行ファイル
application/pdf	PDFファイル
application/vnd.ms-excel	EXCELファイル拡張子が.xlsのもの
application/vnd.openxmlformats-officedocument.spreadsheetml.sheet	EXCELファイル拡張子が.xlsxのもの
image/jpeg	JPEGファイル
image/bmp	Bitmapファイル
application/zip	Zipファイル

ファイル名が文字化けする際の対策

ダウンロードする際に、ファイル名に日本語を使用すると、文字化けや意図しないファイル名が表示されることがあります。
Webアプリケーションからクライアントサイドへの応答返信時、Content-Disposition ヘッダに、”attachment; filename=xxx” というコーディングを行うと、クライアントサイドへのファイルのダウンロード処理が行われます。

ダウンロードを行うファイル名は、このヘッダの filename=xxx に設定しますが、xxxの箇所に日本語のようなマルチバイトの文字列を指定すると、文字化けが発生する恐れがあります。

これを回避させるためには、ヘッダを常に UTF-8 で送信するようにしましょう。ファイル名を Server.UrlEncode()で囲むことで解決できます。しかし、使用しているブラウザによっては、解決できない場合もありますので、注意が必要です。

システム エンジニア: ファイル名を指定する際には、UTF-8で送信することを心がけます。ファイルのダウンロード処理が実装できれば、作業の幅も広がりそうです。自分でもコーディングしてみます！

プロジェクト マネージャー: Webアプリケーションを開発するならば、ファイルのアップロードとダウンロードは行えるようにしておきたいところです。早く自分でも実装できるように、積極的にコーディング方法は覚えていきましょう！

ファイルのダウンロード機能の実装は共通モジュールで

ASP.NETでファイルのダウンロードを行う方法は、今回解説したやり方をマスターできれば、他でも応用できます。サーバサイドで、このファイルダウンロード処理を共通モジュール化しておけば、どこからでも呼び出すことができ、1箇所の実装で済むはずです。

ダウンロード機能などは、プロジェクトではじめに共通化する箇所でありますので、早めに実装方法は理解し、プロジェクトメンバー全員が使えるダウンロード機能を実装していきましょう。

>>>ASP.NETの案件を探すならFEnet .NET Navi

FEnet.NETナビ・.NETコラムは株式会社オープンアップシステムが運営しています。

株式会社オープンアップシステムはこんな会社です

秋葉原オフィスには株式会社オープンアップシステムをはじめグループのIT企業が集結！
数多くのエンジニアが集まります。

スマホアプリから業務系システムまで

スマホアプリから業務系システムまで開発案件多数。システムエンジニア・プログラマーとしての多彩なキャリアパスがあります。
充実した研修制度

毎年、IT技術のトレンドや社員の要望に合わせて、カリキュラムを刷新し展開しています。社内講師の丁寧なサポートを受けながら、自分のペースで学ぶことができます。
資格取得を応援

スキルアップしたい社員を応援するために資格取得一時金制度を設けています。受験料(実費)と合わせて資格レベルに合わせた最大10万円の一時金も支給しています。
東証プライム上場企業グループ

オープンアップシステムは東証プライム上場「株式会社夢真ビーネックスグループ」のグループ企業です。

安定した経営基盤とグループ間のスムーズな連携でコロナ禍でも安定した雇用を実現させています。

株式会社オープンアップシステムに興味を持った方へ

株式会社オープンアップシステムでは、開発系エンジニア・プログラマを募集しています。

年収をアップしたい！スキルアップしたい！大手の上流案件にチャレンジしたい！
まずは話だけでも聞いてみたい場合もOK。お気軽にご登録ください。

株式会社オープンアップシステムへ応募する
会員登録不要! カンタン45秒!

ASP.NETでファイルのダウンロード機能を実装する方法

ASP.NETを使ってファイルダウンロードを実装する

ファイル名が文字化けする際の対策

ファイルのダウンロード機能の実装は共通モジュールで

株式会社オープンアップシステムはこんな会社です

スマホアプリから業務系システムまで

充実した研修制度

資格取得を応援

東証プライム上場企業グループ

株式会社オープンアップシステムに興味を持った方へ

新着案件New Job

開発エンジニア/東京都品川区/【WEB面談可】/在宅ワーク

遠隔テストサービス機能改修/JavaScript/東京都港区/【WEB面談可】/テレワーク

病院内システムの不具合対応、保守/東京都豊島区/【WEB面談可】/テレワーク

開発/JavaScript/東京都豊島区/【WEB面談可】/テレワーク

債権債務システム追加開発/東京都文京区/【WEB面談可】/在宅勤務

PMO/東京都豊島区/【WEB面談可】/在宅勤務

ASP.NETでファイルのダウンロード機能を実装する方法

ASP.NETを使ってファイルダウンロードを実装する

ファイル名が文字化けする際の対策

ファイルのダウンロード機能の実装は共通モジュールで

株式会社オープンアップシステムはこんな会社です

スマホアプリから業務系システムまで

充実した研修制度

資格取得を応援

東証プライム上場企業グループ

株式会社オープンアップシステムに興味を持った方へ

新着案件New Job

開発エンジニア/東京都品川区/【WEB面談可】/在宅ワーク

遠隔テストサービス機能改修/JavaScript/東京都港区/【WEB面談可】/テレワーク

病院内システムの不具合対応、保守/東京都豊島区/【WEB面談可】/テレワーク

開発/JavaScript/東京都豊島区/【WEB面談可】/テレワーク

債権債務システム追加開発/東京都文京区/【WEB面談可】/在宅勤務

PMO/東京都豊島区/【WEB面談可】/在宅勤務

関連記事Related Posts

【ASP.NET入門】ASP.NETとC#で文字列を出力するアプリを作る

【ASP.NET MVC入門その1】ASP.NET MVCで”Hello world”を表示する

【ASP.NET Core入門】ASP.NETとの違いやWebアプリの作成手順

【ASP.NETでポストバックを実装】Button.PostBackUrlでポスト先のURLを取得する

ASP.NETとC#でメッセージボックスを表示する方法