使用HttpHandle对象实现水印和验证码

HttpModule和HttpHandler共性问题

创建前端页面

先创建一个.net项目,创建一个Images保存几张照片,然后再建一个web窗体,页面代码如下:

          <div>
            <img src="Images/1.jpg" width="600px" height="400px"/>
        </div>

添加HttpModule、HttpHandler类、配置Web.config文件

创建MyModules类,并继承IHttpModule接口,代码如下:

public class MyModules : IHttpModule
    {
        public void Dispose()
        {         
        }
        public void Init(HttpApplication context)
        {
            context.BeginRequest += Context_BeginRequest;
            context.EndRequest += Context_EndRequest;
        }     
        private void Context_BeginRequest(object sender, EventArgs e)
        {
            HttpApplication application = sender as HttpApplication;
           application.Response.Write("HttpModule开始");
        }
        private void Context_EndRequest(object sender, EventArgs e)
        {
            HttpApplication application = sender as HttpApplication;
            application.Response.Write("HttpModule结束");
        }
    }

创建MyHandler类,并继承IHttpHandler接口,代码如下:

    public class MyHandler : IHttpHandler
    {
        public bool IsReusable => false;
        public void ProcessRequest(HttpContext context)
        {
            获取照片的物理路径  
            string url = context.Request.PhysicalPath;
            context.Response.WriteFile(url);
        }
    }

配置Web.config文件,代码如下:

<system.webServer>
      <modules>
        <add name="modules" type="WebApplication1.MyModules"/>
      </modules>
      <handlers>
        <add verb="*" path="Images/*.jpg" name="handler" type="WebApplication1.MyHandler"/>
      </handlers>
  </system.webServer>

问题所在

显示的效果如下:
效果图
我们再踩图片的路径,发现是二进乱码的情况。HttpModule、HttpHandler都有执行。那是因为HttpModule跟HttpHandler都是输出,首先执行的是HttpModule的Write输出,然后再执行HttpHandler的WriteFile输出,最后回来又执行HttpHandler的WriteFile输出。由此可以看出,打破了图片的格式,所有页面才会显示不出图片。
在这里插入图片描述

解决方案

解决方案很简单,因为两种的输出方式不一样,会打破原有文件的格式,所以我们只需要在HttpModule中,做一下操作即可。
不让文件输出即可,只执行HttpHandler就可以解决问题了。

public class MyModules : IHttpModule
    {
        public void Dispose()
        {         
        }
        public void Init(HttpApplication context)
        {
            context.BeginRequest += Context_BeginRequest;
            context.EndRequest += Context_EndRequest;
        }     
        private void Context_BeginRequest(object sender, EventArgs e)
        {
            HttpApplication application = sender as HttpApplication;
           //application.Response.Write("HttpModule开始");
        }
        private void Context_EndRequest(object sender, EventArgs e)
        {
            HttpApplication application = sender as HttpApplication;
            //application.Response.Write("HttpModule结束");
        }
    }

在这里插入图片描述

水印

图片加水印可以防止别人盗图,对自身图片有保护作用。

创建前端页面

先创建一个.net项目,创建一个Images保存几张照片,然后再建一个web窗体,页面代码如下:

form id="form1" runat="server">
        <div>
            <img src="Images/1.jpg" width="600px" height="400px"/>
        </div>    
    </form>

添加HttpHandler类,继承IHttpHandler,编写水印功能代码

创建MyModules类,并继承IHttpModule接口,代码如下:

public class MyModules : IHttpModule
    {
        public void Dispose()
        {         
        }
        public void Init(HttpApplication context)
        {
            context.BeginRequest += Context_BeginRequest;
            context.EndRequest += Context_EndRequest;
        }     
        private void Context_BeginRequest(object sender, EventArgs e)
        {
            HttpApplication application = sender as HttpApplication;
           //application.Response.Write("HttpModule开始");
        }
        private void Context_EndRequest(object sender, EventArgs e)
        {
            HttpApplication application = sender as HttpApplication;
            //application.Response.Write("HttpModule结束");
        }
    }

创建MyHandler类,并继承IHttpHandler接口,代码如下:

public class MyHandler : IHttpHandler
    {
        public bool IsReusable => false;
        public void ProcessRequest(HttpContext context)
        {
            //获取照片的物理路径  
            string url = context.Request.PhysicalPath;
            //拿到图片
            Bitmap bitmap = new Bitmap(url);
            //获取画板(画笔)
            Graphics graphics = Graphics.FromImage(bitmap);
            //在画板上添加自己想要的东西
            graphics.DrawString("叮当", new Font("微雅软黑", 50, FontStyle.Bold), Brushes.Red, new Point(10, 10));
            //清理管道
            graphics.Flush();
            //保存图片
            bitmap.Save(context.Response.OutputStream, System.Drawing.Imaging.ImageFormat.Jpeg);
            context.Response.WriteFile(url);
        }
    }

配置Web.config文件

配置文件代码如下:

<system.webServer>
      <modules>
        <add name="modules" type="WebApplication1.MyModules"/>
      </modules>
      <handlers>
        <add verb="*" path="Images/*.jpg" name="handler" type="WebApplication1.MyHandler"/>
      </handlers>
  </system.webServer>

效果如下:
在这里插入图片描述

验证码

验证码的简介与作用

验证码是加强网站安全的必备技术,是更重要的验证方法之一。

验证码可以防止恶意破解密码、刷票、论坛灌水、刷页等恶意的网络行为;有效防止某个黑客对某一个特定注册用户用特定程序暴力破解方式进行不断的登录尝试。

原理:跟以上水印的是一样的,要用到画板。

创建前端页面

先创建一个.net项目,创建一个Images保存几张照片,然后再建一个web窗体,页面代码如下:

<body>
    <form id="form1" runat="server">
        <div>
            <img src="Images/1.jpg" width="600px" height="400px"/>
        </div>    
    </form>
</body>

添加HttpHandler类,继承IHttpHandler,生成验证码功能代码

创建MyModules类,并继承IHttpModule接口,代码如下:

 public class MyModules : IHttpModule
    {
        public void Dispose()
        {         
        }
        public void Init(HttpApplication context)
        {
            context.BeginRequest += Context_BeginRequest;
            context.EndRequest += Context_EndRequest;
        }     
        private void Context_BeginRequest(object sender, EventArgs e)
        {
            HttpApplication application = sender as HttpApplication;
           //application.Response.Write("HttpModule开始");
        }
        private void Context_EndRequest(object sender, EventArgs e)
        {
            HttpApplication application = sender as HttpApplication;
            //application.Response.Write("HttpModule结束");
        }
    }

创建MyHandler类,并继承IHttpHandler接口,以下每行代码都有注释,就算你是小白都能看懂,接下来请欣赏代码:

 public class MyHandler : IHttpHandler
    {
        public bool IsReusable => false;
        public void ProcessRequest(HttpContext context)
        {
            //获取照片的物理路径  
            string url = context.Request.PhysicalPath;
            // 空
            Bitmap bitmap = new Bitmap(200, 100);
            // 获取画板(画笔)
            Graphics graphics = Graphics.FromImage(bitmap);
            //背景默认黑色,通过该方式可变成自己想要的颜色
            graphics.Clear(Color.White);
            //创建随机验证码使用的字符
            string[] str = { "1","2", "3", "4", "5", "6", "7", "8", "9", "0", "q", "w", "e", "r", "t", "y", "u", "i", "o", "p", "a", "s", "d", "f",
                 "g", "h", "j", "k" , "l", "z" , "x", "c" , "v", "b" , "n", "m" , "Q", "W" , "E", "R" , "T", "Y" , "U", "I" , "O", "P" , "A", "S" ,
                 "D", "F" , "G", "H", "J" , "K", "L", "Z" , "X", "C", "V" , "B", "N", "M" };
            //创建随机字体的样式
            string[] font = { "微软雅黑", "宋体", "等线", "楷体" };
            //创建随机字体的大小
            int[] size = { 18, 20, 16, 22 };
            //定义空间为5的数据,实现五位数的验证码
            string[] str1 = new string[5];
            //创建随机的字体颜色
            Brush[] color = { Brushes.Red, Brushes.Green, Brushes.Pink, Brushes.Purple, Brushes.SkyBlue, Brushes.Tomato,
                 Brushes.YellowGreen, Brushes.Orange, Brushes.PaleVioletRed};
            Random random = new Random();
            //定义字的x轴(水平方向),默认值为0
            int x = 0;
            //定义随机的y轴的距离
            int[] y = { 2, 4, 6, 8 };
            //实现五位数的验证码
            for (int i = 0; i < 5; i++)
            {
                //随机获取验证码
                str1[i] = str[random.Next(0, 62)];
                //在画板上添加自己想要的东西
                graphics.DrawString(str1[i], new Font(font[random.Next(4)], size[random.Next(4)], FontStyle.Bold), color[random.Next(9)],
                    new Point(x, y[random.Next(4)]));
                //字体间隔22
                x += 22;
            }
            // 清理管道
            graphics.Flush();
            //保存图片
            bitmap.Save(context.Response.OutputStream, System.Drawing.Imaging.ImageFormat.Jpeg);
            //输出显示
            context.Response.WriteFile(url);
        }
    }

配置Web.config文件

配置文件代码如下:

<system.webServer>
      <modules>
        <add name="modules" type="WebApplication1.MyModules"/>
      </modules>
      <handlers>
        <add verb="*" path="Images/*.jpg" name="handler" type="WebApplication1.MyHandler"/>
      </handlers>
  </system.webServer>

效果如下:
在这里插入图片描述

今天就跟大家讲到这了,我们下次再见

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值