您现在的位置：程式碼之家 >> 編程語言 > >> .NET 網頁程式設計 >> ASP.NET 基礎 >> ASP.NET 基礎

ASP.NET 動態圖片浮水印：HttpHandler 即時合成不異檔原圖

編輯：ASP.NET 基礎

兩種浮水印策略比較

策略	時機	優點	缺點
上傳時合成	SaveAs 後立即 GDI+ 繪製	請求時直接輸出靜態檔，CPU 壓力低	原圖永久改變、無法移除/更換浮水印
請求時合成 (本文方案)	HttpHandler ProcessRequest	原圖完整保留、浮水印可隨時調整/關閉	每次請求消耗 CPU/記憶體、需快取緩解

HttpHandler 完整實作

using System;
using System.Drawing;
using System.Drawing.Imaging;
using System.IO;
using System.Web;

namespace BookShop.Web
{
    public class WaterMark : IHttpHandler
    {
        private const string WatermarkPath = "~/Images/watermark.png"; // 建議 PNG 透明背景
        private const string DefaultImagePath = "~/Images/default.jpg";

        public bool IsReusable => false;

        public void ProcessRequest(HttpContext context)
        {
            string physicalPath = context.Request.PhysicalPath;
            Image sourceImage;

            // 1. 取得來源圖片
            if (File.Exists(physicalPath))
            {
                sourceImage = Image.FromFile(physicalPath);
            }
            else
            {
                // 找不到檔案 → 輸出預設圖
                sourceImage = Image.FromFile(context.Server.MapPath(DefaultImagePath));
            }

            try
            {
                // 2. 載入浮水印
                using (Image watermark = Image.FromFile(context.Server.MapPath(WatermarkPath)))
                using (Graphics g = Graphics.FromImage(sourceImage))
                {
                    // 高品質繪圖設定
                    g.CompositingQuality = System.Drawing.Drawing2D.CompositingQuality.HighQuality;
                    g.SmoothingMode = System.Drawing.Drawing2D.SmoothingMode.AntiAlias;
                    g.InterpolationMode = System.Drawing.Drawing2D.InterpolationMode.HighQualityBicubic;

                    // 3. 計算位置：右下角對齊，留 10px 邊距
                    int x = sourceImage.Width - watermark.Width - 10;
                    int y = sourceImage.Height - watermark.Height - 10;
                    if (x < 0) x = 0;
                    if (y < 0) y = 0;

                    // 4. 繪製浮水印
                    g.DrawImage(watermark, x, y, watermark.Width, watermark.Height);
                }

                // 5. 輸出 JPEG (可依原圖格式動態決定)
                context.Response.Clear();
                context.Response.ContentType = "image/jpeg";
                context.Response.Cache.SetCacheability(HttpCacheability.Public);
                context.Response.Cache.SetMaxAge(TimeSpan.FromDays(30)); // 瀏覽器快取 30 天
                context.Response.Cache.SetLastModified(File.GetLastWriteTimeUtc(physicalPath));

                sourceImage.Save(context.Response.OutputStream, ImageFormat.Jpeg);
            }
            finally
            {
                sourceImage?.Dispose(); // 確保釋放非託管資源
            }
        }
    }
}

Web.config 註冊 (IIS 7+ 整合模式)

<system.webServer>
  <handlers>
    <add name="WaterMarkHandler" 
         path="*.jpg" verb="GET" 
         type="BookShop.Web.WaterMark, BookShop.Web" 
         preCondition="integratedMode" />
    <!-- 若需支援 png/gif，複製並修改 path -->
  </handlers>
</system.webServer>

效能優化關鍵 (生產環境必做)

輸出快取：在 `ProcessRequest` 開頭檢查 `context.Request.Headers["If-Modified-Since"]`，若未修改回傳 `304 Not Modified`。
記憶體快取合成圖：使用 `MemoryCache` 以 `physicalPath + watermark.LastWriteTime` 為 Key 快取合成後的 byte[]，避免重複 GDI+ 運算。
非同步處理：改實作 `IHttpAsyncHandler`，將 GDI+ 工作排入 ThreadPool，釋放 IIS 執行緒處理其他請求。
CDN/反向代理：前置 Nginx/Cloudflare 快取合成圖，應用層幾乎不受請求壓力。