上传带水印的图片、图片验证码

一、图片加水印

前台代码:

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default1.aspx.cs" Inherits="Default1" %>

<!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:FileUpload ID="FileUpload1" runat="server" /><asp:Button ID="Button1" runat="server" Text="上传" /><br />
        <asp:Image ID="Image1" runat="server" />
    </div>
    </form>
</body>
</html>

后台代码:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Drawing;

public partial class Default1 : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        Button1.Click += Button1_Click;
    }

    void Button1_Click(object sender, EventArgs e)
    {
        //1、先把图片获取出来
        //咱们要画画的画布
        System.Drawing.Image img = System.Drawing.Image.FromStream(FileUpload1.FileContent);

        //2、往上面画上水印
        Graphics g = Graphics.FromImage(img);//这个是绘制方法,等号右边是往那张图片上绘制
        string s = "http://www.itnba.com"; //绘制的字符串
        Font f = new Font("微软雅黑",18);//绘制使用的字体
        SolidBrush b = new SolidBrush(Color.Red);//绘制使用的刷子,设置颜色

        g.DrawString(s, f, b, 0, 0); //绘制完毕

        //3、保存到服务器指定路径,并且在Image控件中显示
        string path = Server.MapPath("Uploads/" + FileUpload1.FileName);

        img.Save(path);//将绘制完的图片保存,注意:千万不要把选择的图片保存

        Image1.ImageUrl = "Uploads/" + FileUpload1.FileName;

    }
}

二、图片验证码

1、首先引用命名空间:system.Drawing;

2、将aspx页面当做图片路径,在load事件中进行绘制并保存在内存流中

前台代码:

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default2.aspx.cs" Inherits="Default2" %>

<!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:TextBox ID="TextBox1" runat="server"></asp:TextBox><asp:Image ID="Image1" runat="server" ImageUrl="~/YZM.aspx" /><br />
        <asp:Button ID="Button1" runat="server" Text="验证" /><asp:Label ID="Label1" runat="server" Text="Label"></asp:Label>
    </div>
    </form>
</body>
</html>
<script type="text/javascript">
    var aaa = 0;
    document.getElementById(‘Image1‘).onclick = function () {
        this.setAttribute("src", "yzm.aspx?id="+aaa);
        aaa++;

    };

</script>

后台代码:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

public partial class Default2 : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        Button1.Click += Button1_Click;
    }

    void Button1_Click(object sender, EventArgs e)
    {
        if (TextBox1.Text == Session["YZM"].ToString())
        {
            Label1.Text = "正确!";
        }
        else
        {
            Label1.Text = "错误!";
        }
    }
}

生成图片验证码的后台代码:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Drawing;

public partial class YZM : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        //1、准备画布
        Bitmap img = new Bitmap(60, 30);

        //2、往画布上绘制验证码

        string all = "abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ1234567890";
        string aaa = "";
        Random r = new Random();
        for (int i = 0; i < 4; i++)
        {
            aaa += all.Substring(r.Next(all.Length), 1);
        }

        Session["YZM"] = aaa;
        Graphics g = Graphics.FromImage(img);
        Font f = new Font("微软雅黑",16);
        SolidBrush b  = new SolidBrush(Color.Green);

        g.DrawString(aaa, f, b, 0, 0);

        img.Save(Response.OutputStream, System.Drawing.Imaging.ImageFormat.Png);
    }
}
时间: 2024-12-06 00:05:14

上传带水印的图片、图片验证码的相关文章

模拟上传,可自行定义上传按钮的名称和图片。

<table>    <tr>    <td>上传</td>    <td style="width:300px;">                    <div style="position: absolute; z-index: 3; cursor:hand; float:left; width:227px;">              <input id="File

webform文件上传加水印

1.文件上传加水印 页面代码: 后台代码: using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.Web.UI; using System.Web.UI.WebControls; using System.Drawing; public partial class _Default : System.Web.UI.Page { protected void

atitit. 文件上传带进度条 atiUP 设计 java c# php

atitit. 文件上传带进度条 atiUP 设计 java c# php 1. 设计要求 1 2. 原理and 架构 1 3. ui 2 4. spring mvc 2 5. springMVC.xml 3 6. struts extand url 3 7. behide code 3 8. 简化设计 3 1. 设计要求 带进度条 完成提示动画效果.. 2. 原理and 架构 如果需要显示进度条,实时显示文件上传进度 需要使用Ajaxj技术..up到个在的iframe黑头.. 工作原理 其实际

atitit.文件上传带进度条的实现原理and组件选型and最佳实践总结O7

1. 实现原理 1 2. 大的文件上传原理::使用applet 1 3. 新的bp 2 1. 性能提升---分割小文件上传,避免一次使用内存使用过大的 2 2. Uuid还是原来文件名称:: 2 3. 监听器频繁地被调用 2 4. 结合wz easyui 2 4. 选型 2 5. Uploadify::yash js+flash 3 6. commons-fileupload:: 3 7. COS这个工具O'Reilly公司 3 8. 大的文件上传组件总结 3 5. 林吧实现ui Ajax+jq

Struts2文件上传带进度条,虽然不是很完美

好久没有写东西,最近在做个项目,要用到文件h 传的,以前虽然也做上传,但是总觉得不好用 ,现在和队友合作做了一个带进度条的上传,觉得还行~~和大家分享一下. 首先说一下大概是这样实现的,在我们平时的上传表单里面,除了文件上传之外,也许还有其他的信息需要填写的,这样问题就来了:点击上传按钮之后,这个表单都封装并提交上去了,在上传完成后整个页面就跳转了.而且也不利于我们验证用户输入.很多人这样做的,把这2个操作分开,当然这样也行... 我们这样做:一个普通页面(可以用于填写所有信息的),一个文件上传

数往知来 JQuery 图片上传_水印 &lt;二十二&gt;

一.图片上传  :enctype='multipart/form-date 首先在进行文件上传时,添加form表单中的enctype属性指定enctype='multipart/form-date', 文件数据发送给服务端,并不是把文件路径发送给服务端了,它会随机生成一个分割字符串, 把每一个表单元素分割开 <form method='post' action='' enctype='multipart/form-date'> //这里的enctype是提交请求报文的报文体的一种编码格式, 默

【2017-6-9】WebForm 图片上传加水印

前台代码 <body> <form id="form1" runat="server"> <div> <%--上传的控件--%> <asp:FileUpload ID="FileUpload1" runat="server" /> <%--上传按钮--%> <asp:Button ID="Button1" runat="

HTML5多图片拖拽上传带进度条

前言 昨天利用css2的clip属性实现了网页进度条觉得还不错,但是很多情况下,我们在那些时候用进度条呢,一般网页加载的时候如果有需要可以用,那么问题就来了,怎么才算整个加载完毕呢,是页面主要模块加载完毕,还是window.onload之后算呢,对这些方面,我真不敢随意回答,因业务需求而定,本文想要说的是在图片上传的时候用到的进度条. 效果展示 详细参考请移步至html5demo HTML5 新增的拖拽相关事件说明 1.ondragover 效果图演示是所看见的可以将文件不仅仅是图片拖拽到该di

上传自定义水印图片到图片空间及保存数据库的方法

(1).添加我的水印,按钮展示: <div class="form-actions"> <button data-toggle="modal" class="sui-btn btn-primary btn-large" onclick="addmywatermark();" >添加我的水印</button> </div> /** * 添加我的水印 **/ function add