ASP.NET 新聞發布系統：資料新增與檔案上傳實作（第 10 節）

前言

本節以新聞管理系統為例，實作新聞新增功能，包含標題、內容、圖片與附件上傳，展示 Web Forms 中檔案上傳與資料庫寫入的完整流程。

頁面設計

1. 新增 newsadd.aspx
2. 6×2 表格：標題、內容、圖片上傳、附件上傳、發布時間、提交按鈕

實體類別

public class newsclass {
    public string Title { get; set; }
    public string Contents { get; set; }
    public string Img { get; set; }      // 圖片檔名
    public string Annex { get; set; }    // 附件檔名
    public string Time { get; set; }     // 發布時間
}

資料存取方法

public static void addnews(newsclass news) {
    using (SqlConnection cn = dbconn.GetConnection()) {
        cn.Open();
        string sql = "INSERT INTO news (title, contents, img, annex, time) VALUES (@title, @contents, @img, @annex, @time)";
        using (SqlCommand cmd = new SqlCommand(sql, cn)) {
            cmd.Parameters.AddWithValue("@title", news.Title);
            cmd.Parameters.AddWithValue("@contents", news.Contents);
            cmd.Parameters.AddWithValue("@img", news.Img);
            cmd.Parameters.AddWithValue("@annex", news.Annex);
            cmd.Parameters.AddWithValue("@time", news.Time);
            cmd.ExecuteNonQuery();
        }
    }
}

檔案上傳與資料寫入整合

protected void Button1_Click(object sender, EventArgs e) {
    var news = new newsclass {
        Title = TextBox1.Text.Trim(),
        Contents = TextBox2.Text.Trim(),
        Time = DateTime.Now.ToString("yyyy-MM-dd HH:mm:ss")
    };

    // 處理圖片上傳
    if (FileUpload1.HasFile) {
        string fileName = DateTime.Now.ToString("yyyyMMddHHmmss") + FileUpload1.FileName;
        string savePath = Server.MapPath("../upfile/" + fileName);
        FileUpload1.SaveAs(savePath);
        news.Img = fileName;  // 僅儲存檔名，路徑由系統統一管理
    }

    // 處理附件上傳
    if (FileUpload2.HasFile) {
        string fileName = DateTime.Now.ToString("yyyyMMddHHmmss") + FileUpload2.FileName;
        string savePath = Server.MapPath("../upfile/" + fileName);
        FileUpload2.SaveAs(savePath);
        news.Annex = fileName;
    }

    newschuli.addnews(news);
    Response.Redirect("NewsCategoriesManager.aspx");
}

執行結果

檔案上傳最佳實務補充

進階：大檔案分片上傳

若需支援超大檔案（>100MB），建議採用：

1. 前端：HTML5 File API 切片（如 5MB/片），Plupload/Resumable.js
2. 後端：Web API 接收分片，暫存至臨時目錄
3. 合併：所有分片上傳完成後，後端合併並驗證完整性
4. 斷點續傳：記錄已上傳分片索引，支援中斷後續傳

結語

本節實作新聞新增與雙檔案（圖片/附件）上傳功能，展示 FileUpload 控制項搭配參數化查詢的標準用法。生產環境請務必加強檔案驗證、儲存安全與錯誤處理，必要時引入雲端儲存（Azure Blob/AWS S3）分擔伺服器負載。