C# AJAXform上传图片
前台：
@{
Layout = null;
}
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>Index</title>
<link href="~/Scripts/jquery.imgareaselect-0.9.10/css/imgareaselect-animated.css" rel="stylesheet" /> --引用
<script src="~/Scripts/jquery.imgareaselect-0.9.10/scripts/jquery.imgareaselect.pack.js"></script> --引用
<script src="~/Scripts/jquery.imgareaselect-0.9.10/scripts/jquery.min.js"></script> --引用
<script src="~/Scripts/jquery.imgareaselect-0.9.10/jquery-form.js"></script> --引用
</head>
<body>
<div>
<form enctype="multipart/form-data" method="post" action="/show/markwater" id="submitForm">
<input type="file" name="Exc" id="pic" />
<input type="button" value="提交" onclick="submitForm();" />
</form>
<!--原始图片展示 move:此光标指示某对象可被移动-->
<img id="photo" style="cursor:move" src=""/>
<!--效果图片展示-->
<img id="photoNew" />
</div>
</body>
</html>
<script>
$(document).ready(function () {
debugger;
//选择图片事件
$('#photo').imgAreaSelect({
fadeSpeed: 500,//设置为大于零的数字，则用优美的淡入/淡出动画来显示图片，默认值为 false
autoHide: false,//设置为true，当选择区域选择结束时消失，默认值为：false
handles: true,//设置为true，调整手柄则会显示在选择区域内，如果设置为"corners"，则只有角处理会显示调整手柄，默认值为false
persistent: false,//设置为true，选择区以外的点击将不会启动一个新的选区（即用户将只能移动/调整现有的选择范围），默认值为false
onSelectEnd: function (img, selection)//结束选区时的回调函数
{
debugger;
var x1, y1, xwidth, yheight, spath;
x1 = selection.x1;//选择区域的左上角坐标
y1 = selection.y1;//选择区域的左上角坐标
xwidth = selection.width;
yheight = selection.height;
picurl = $("#photo").attr("src");
$.post("/show/crop", { x1: x1, y1: y1, width: xwidth, height: yheight, picurl: picurl }, function (url) {
$("#photoNew").attr("src", url + "?" + Math.random());//随机数的作用:避免游览器缓存图片
})
}
});
});
//form窗体异步提交事件
function submitForm()
{
debugger;
$("#submitForm").ajaxSubmit({
success:function(responseText)
{
debugger;
alert(responseText);
$("#photo").attr("src",responseText);//给照片赋值
}
})
}
</script>
后台：
using FileUploadDemo.Common;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using System.Drawing;
using System.Drawing.Imaging;
using System.Drawing.Drawing2D;
using System.IO;
namespace 图片水印.Controllers
{
public class showController : Controller
{
// GET: show
public ActionResult Index()
{
return View();
}
/// <summary>
/// 上传
/// </summary>
/// <param name="pic"></param>
/// <returns></returns>
[HttpPost]
public ActionResult uppicture(HttpPostedFileBase pic)
{
var path = Server.MapPath("/images/");
string fname = Guid.NewGuid().ToString()+pic.FileName;
pic.SaveAs(path+fname);
string names = "/images/"+fname;
string waring = "";
//使用流方式，上产并保存文件
string url = ImageHelper.uploadbystream(pic.InputStream,"/images/",out waring);
//添加水印
string WarkUrl = ImageHelper.makewatermark(url, names,
ImageHelper.WaterType.Center,"/images/",
ImageHelper.ImageType.JPEG,
ImageHelper.FileCache.Delete,
out waring);
return Content(WarkUrl);
}
/// <summary>
/// 裁剪
/// </summary>
/// <param name="collection"></param>
/// <returns></returns>
[HttpPost]
public ActionResult Crop(FormCollection collection)
{
//选择区域的左上角坐标
int x1 = int.Parse(collection["x1"]);
int y1 = int.Parse(collection["y1"]);
int width = int.Parse(collection["width"]);
int height = int.Parse(collection["height"]);
string picurl = collection["picurl"];
string warning = ""; //返回图片剪辑过程的警告信息
string Url = ImageHelper.imgcrop(picurl, "/images/", x1, y1, width, height, ImageHelper.FileCache.Save, out warning);
return Content(Url);
}
[HttpPost] //上传功能2
public ActionResult markwater(HttpPostedFileBase Exc)
{
var path = Server.MapPath("/images/");
if (!Directory.Exists(path))
{
Directory.CreateDirectory(path);
}
string fname = Guid.NewGuid().ToString() + Exc.FileName;
Exc.SaveAs(path + fname);
string names =path + fname;//原图片和水印图片路径
string newnames = path + Guid.NewGuid().ToString() + ".png"; ///保存的路径
//调用方法
BuildWatermark(names, path+ "w.png", "123123",newnames);
int i = newnames.LastIndexOf("\\images");//把要保存的图片的物理路径的index最后出现的位置
string srcs = newnames.Substring(i); //截取index至所有长度。
return Content(srcs); //返回路径
}
/// <summary>
/// 添加文字水印
/// </summary>
public void ss()
{
string ImagePath = @"C:\Users\1\Pictures\斗图\v2-93729ef5335e8f6d8633213c88cb14a8_r.jpg";
try
{
Image image = Image.FromFile(ImagePath);
Graphics g = Graphics.FromImage(image);
//水印内容
string waterText = "wangyblzu";
Font font = new Font("宋体", 18);
//用于确定水印的大小
SizeF zisizeF = new SizeF();
zisizeF = g.MeasureString(waterText, font);
//亮度，红色，绿色，蓝色
SolidBrush solidBrush = new SolidBrush(Color.FromArgb(255, 255, 0, 0));
//水印
g.DrawString(waterText, font, solidBrush, new PointF(image.Width / 2+(image.Width/4), (image.Height- image.Height /4 )));
//图片另存
image.Save(@"C:\Users\1\Pictures\斗图\4ec5b03"+Guid.NewGuid().ToString()+"69c5b59e3d22_r.jpg", System.Drawing.Imaging.ImageFormat.Jpeg);
}
catch (Exception ex)
{
throw ex;
}
}
//图片方法2
/// <summary>
/// Creating a Watermarked Photograph with GDI+ for .NET
/// </summary>
/// <param name="rSrcImgPath">原始图片的物理路径</param>
/// <param name="rMarkImgPath">水印图片的物理路径</param>
/// <param name="rMarkText">水印文字（不显示水印文字设为空串）</param>
/// <param name="rDstImgPath">输出合成后的图片的物理路径</param>
public void BuildWatermark(string rSrcImgPath, string rMarkImgPath, string rMarkText, string rDstImgPath)
{
//以下（代码）从一个指定文件创建了一个Image 对象，然后为它的 Width 和 Height定义变量。
//这些长度待会被用来建立一个以24 bits 每像素的格式作为颜色数据的Bitmap对象。
Image imgPhoto = Image.FromFile(rSrcImgPath);
int phWidth = imgPhoto.Width;
int phHeight = imgPhoto.Height;
Bitmap bmPhoto = new Bitmap(phWidth, phHeight, PixelFormat.Format24bppRgb);
bmPhoto.SetResolution(72, 72);
Graphics grPhoto = Graphics.FromImage(bmPhoto);
//这个代码载入水印图片，水印图片已经被保存为一个BMP文件，以绿色(A=0,R=0,G=255,B=0)作为背景颜色。
//再一次，会为它的Width 和Height定义一个变量。
Image imgWatermark = new Bitmap(rMarkImgPath);
int wmWidth = imgWatermark.Width;
int wmHeight = imgWatermark.Height;
//这个代码以100%它的原始大小绘制imgPhoto 到Graphics 对象的（x=0,y=0）位置。
//以后所有的绘图都将发生在原来照片的顶部。
grPhoto.SmoothingMode = SmoothingMode.AntiAlias;
grPhoto.DrawImage(
imgPhoto,
new Rectangle(0, 0, phWidth, phHeight),
0,
0,
phWidth,
phHeight,
GraphicsUnit.Pixel);
//为了最大化版权信息的大小，我们将测试7种不同的字体大小来决定我们能为我们的照片宽度使用的可能的最大大小。
//为了有效地完成这个，我们将定义一个整型数组，接着遍历这些整型值测量不同大小的版权字符串。
//一旦我们决定了可能的最大大小，我们就退出循环，绘制文本
int[] sizes = new int[] { 16, 14, 12, 10, 8, 6, 4 };
Font crFont = null;
SizeF crSize = new SizeF();
for (int i = 0; i < 7; i++)
{
crFont = new Font("arial", sizes[i],
FontStyle.Bold);
crSize = grPhoto.MeasureString(rMarkText,
crFont);
if ((ushort)crSize.Width < (ushort)phWidth)
break;
}
//因为所有的照片都有各种各样的高度，所以就决定了从图象底部开始的5%的位置开始。
//使用rMarkText字符串的高度来决定绘制字符串合适的Y坐标轴。
//通过计算图像的中心来决定X轴，然后定义一个StringFormat 对象，设置StringAlignment 为Center。
int yPixlesFromBottom = (int)(phHeight * .05);
float yPosFromBottom = ((phHeight -
yPixlesFromBottom) - (crSize.Height / 2));
float xCenterOfImg = (phWidth / 2);
StringFormat StrFormat = new StringFormat();
StrFormat.Alignment = StringAlignment.Center;
//现在我们已经有了所有所需的位置坐标来使用60%黑色的一个Color(alpha值153)创建一个SolidBrush 。
//在偏离右边1像素，底部1像素的合适位置绘制版权字符串。
//这段偏离将用来创建阴影效果。使用Brush重复这样一个过程，在前一个绘制的文本顶部绘制同样的文本。
SolidBrush semiTransBrush2 =
new SolidBrush(Color.FromArgb(153, 0, 0, 0));
grPhoto.DrawString(rMarkText,
crFont,
semiTransBrush2,
new PointF(xCenterOfImg + 1, yPosFromBottom + 1),
StrFormat);
SolidBrush semiTransBrush = new SolidBrush(
Color.FromArgb(153, 255, 255, 255));
grPhoto.DrawString(rMarkText,
crFont,
semiTransBrush,
new PointF(xCenterOfImg, yPosFromBottom),
StrFormat);
//根据前面修改后的照片创建一个Bitmap。把这个Bitmap载入到一个新的Graphic对象。
Bitmap bmWatermark = new Bitmap(bmPhoto);
bmWatermark.SetResolution(
imgPhoto.HorizontalResolution,
imgPhoto.VerticalResolution);
Graphics grWatermark =
Graphics.FromImage(bmWatermark);
//通过定义一个ImageAttributes 对象并设置它的两个属性，我们就是实现了两个颜色的处理，以达到半透明的水印效果。
//处理水印图象的第一步是把背景图案变为透明的(Alpha=0, R=0, G=0, B=0)。我们使用一个Colormap 和定义一个RemapTable来做这个。
//就像前面展示的，我的水印被定义为100%绿色背景，我们将搜到这个颜色，然后取代为透明。
ImageAttributes imageAttributes =
new ImageAttributes();
ColorMap colorMap = new ColorMap();
colorMap.OldColor = Color.FromArgb(255, 0, 255, 0);
colorMap.NewColor = Color.FromArgb(0, 0, 0, 0);
ColorMap[] remapTable = { colorMap };
//第二个颜色处理用来改变水印的不透明性。
//通过应用包含提供了坐标的RGBA空间的5x5矩阵来做这个。
//通过设定第三行、第三列为0.3f我们就达到了一个不透明的水平。结果是水印会轻微地显示在图象底下一些。
imageAttributes.SetRemapTable(remapTable,
ColorAdjustType.Bitmap);
float[][] colorMatrixElements = {
new float[] {1.0f, 0.0f, 0.0f, 0.0f, 0.0f},
new float[] {0.0f, 1.0f, 0.0f, 0.0f, 0.0f},
new float[] {0.0f, 0.0f, 0.3f, 0.0f, 0.0f},
new float[] {0.0f, 0.0f, 0.0f, 0.3f, 0.0f},
new float[] {0.0f, 0.0f, 0.0f, 0.0f, 1.0f}
};
ColorMatrix wmColorMatrix = new
ColorMatrix(colorMatrixElements);
imageAttributes.SetColorMatrix(wmColorMatrix,
ColorMatrixFlag.Default,
ColorAdjustType.Bitmap);
//随着两个颜色处理加入到imageAttributes 对象，我们现在就能在照片右手边上绘制水印了。
//我们会偏离10像素到底部，10像素到左边。
int markWidth;
int markHeight;
//mark比原来的图宽
if (phWidth <= wmWidth)
{
markWidth = phWidth - 10;
markHeight = (markWidth * wmHeight) / wmWidth;
}
else if (phHeight <= wmHeight)
{
markHeight = phHeight - 10;
markWidth = (markHeight * wmWidth) / wmHeight;
}
else
{
markWidth = wmWidth;
markHeight = wmHeight;
}
int xPosOfWm = ((phWidth - markWidth) - 10);
int yPosOfWm = 10;
grWatermark.DrawImage(imgWatermark,
new Rectangle(xPosOfWm, yPosOfWm, markWidth,
markHeight),
0,
0,
wmWidth,
wmHeight,
GraphicsUnit.Pixel,
imageAttributes);
//最后的步骤将是使用新的Bitmap取代原来的Image。 销毁两个Graphic对象，然后把Image 保存到文件系统。
imgPhoto = bmWatermark;
grPhoto.Dispose();
grWatermark.Dispose();
imgPhoto.Save(rDstImgPath, ImageFormat.Jpeg);
imgPhoto.Dispose();
imgWatermark.Dispose();
}
}
}
C# AJAXform上传图片的更多相关文章
- C#使用ajaxForm进行上传图片
<div class='imgOuter addImgBtn l_canshu' id='ImagePath1' value=''> <img src="../Images ...
- ajax上传图片 jquery插件 jquery.form.js 的方法 ajaxSubmit; AjaxForm与AjaxSubmit的差异
先引入脚本 这里最好是把jquery的脚本升级到1.7 <script src="js/jquery-1.7.js" type="text/javascript& ...
- 手机端上传图片及java后台接收和ajaxForm提交
有很多微信开发的项目在手机端需要传图片,但是又不想调用微信的上传图片接口,于是采取了如下做法: 使用ajaxForm提交文件所需js:jquery.form.js 页面代码: <%@ page ...
- 异步上传图片，光用jquery不行，得用jquery.form.js插件
异步上传图片,光用jquery不行,得用jquery.form.js插件,百度一下下载这个插件,加jquery,引入就可以了 <form id="postbackground" ...
- 基于ASP.Net +easyUI框架上传图片，实现图片上传，提交表单
<body> <link href="../../Easyui/themes/easyui.css" rel="stylesheet" typ ...
- 博客使用BOS上传图片
1.博客平台的选定 从大学开始做个人主页算起,最开始是使用html,CSSS写简单的页面,后面大学毕业之后接触到了WordPress,就开始用WordPress搭建网站.现在还维护着一个农村网站.ht ...
- nodejs利用ajax实现网页无刷新上传图片
nodejs利用ajax实现网页无刷新上传图片 标签(空格分隔): nodejs 通常情况下上传图片是要通过提交form表单来实现的,但是这又不可避免的产生了网页转. 利用ajax技术和FormDat ...
- -Android -线程池 批量上传图片 -附php接收代码
(出处:http://www.cnblogs.com/linguanh/) 目录: 1,前序 2,类特点 3,用法 4,java代码 5,php代码 1,前序 还是源于重构,看着之前为赶时间写着的碎片 ...
- iOS 原生HTTP POST请求上传图片
今天项目里做一个上传图片等个人信息的时候,使用了第三方AFNetworking - (AFHTTPRequestOperation *)POST:(NSString *)URLString param ...
随机推荐
- Java并发之ReentrantLock详解
一.入题 ReentrantLock是Java并发包中互斥锁,它有公平锁和非公平锁两种实现方式,以lock()为例,其使用方式为: ReentrantLock takeLock = new Reent ...
- [翻译]pytest测试框架（一）
此文已由作者吴琪惠授权网易云社区发布. 欢迎访问网易云社区,了解更多网易技术产品运营经验. 纯官网译文而已... pytest是一个成熟的.全功能的python测试工具. pytest框架编写测试用例 ...
- Android ImageView，ImageButton 与 Button
1. ImageButton 继承自 ImageView.两者具备甚小,因为 ImageView 同样可以点击相应,同样有点击的阴影效果.实际上他们的区别在于默认 style.比如同样放一个背景和一个 ...
- tcp udp socket编程
http://blog.csdn.net/ns_code/article/details/14128987
- gitlab中修改项目名称客户端修改方法
如果gitlab项目名称已经修改,对于本地已经克隆下来的仓库,可以使用如下命令进行修改: git remote set-url origin 新的项目路径
- 【OCP-12c】CUUG 071题库考试原题及答案解析（14）
14.(6-13) choose the best answer:View the Exhibit and examine the structure of the ORDERS table.Whic ...
- css如何去掉select原始样式
css代码: select { /*将默认的select选择框样式清除*/ appearance: none; -moz-appearance: none; -webkit-appearance: n ...
- java简单正则验证手机号
import java.util.regex.Matcher; import java.util.regex.Pattern; /** * @Title:Tadesfza * @Description ...
- Sublime关于tab转空格的设置技巧
在编写大的工程的代码的时候,会要求一些多余的字符不应该存在,比如说末尾不应该有空格或者Tab这样的字符,比如说所有的Tab应该变成空格,这样工程不管在什么样的编辑器下看,格式都会比较统一,等等,可是如 ...
- VMware Workstation 14 pro License Keys
AC5XK-0ZD4H-088HP-9NQZV-ZG2R4 CG54H-D8D0H-H8DHY-C6X7X-N2KG6 ZC3WK-AFXEK-488JP-A7MQX-XL8YF ZC5XK-A6E0 ...