iview的Upload使用，C#后台

1.前台代码：

<template>
<Upload
multiple
type="drag"

action="//localhost:10059/api/UploadImage"
>
<div style="padding: 20px 0">
<Icon type="ios-cloud-upload" size="52" style="color: #3399ff"></Icon>
<p>Click or drag files here to upload</p>
</div>
</Upload>
</template>
<script>
export default {

}
</script>

2.后台代码

[HttpPost]
public string UploadImage()
{
try
{

HttpRequest request = HttpContext.Current.Request;//获取请求对象
HttpFileCollection fileCollection = request.Files;//获取对象集
Stream fs = fileCollection[0].InputStream;//获取单一对象
Byte[] imagebytes = new byte[fs.Length];//读取字符流的长度
BinaryReader br = new BinaryReader(fs); //文件
imagebytes = br.ReadBytes(Convert.ToInt32(fs.Length));//赋值字符流

MemoryStream ms = new MemoryStream(imagebytes);
Image imageBlob = Image.FromStream(ms, true);//用流创建Image
string name = Guid.NewGuid().ToString();//保存用的名字
string tyle = null;//设置文件格式
if (imageBlob.RawFormat.Equals(System.Drawing.Imaging.ImageFormat.Jpeg))
{
tyle = ".jpg";
}
if (imageBlob.RawFormat.Equals(System.Drawing.Imaging.ImageFormat.Png))
{
tyle = ".png";
}
if (imageBlob.RawFormat.Equals(System.Drawing.Imaging.ImageFormat.Gif))
{
tyle = ".Gif";
}
if (tyle == null)
{
return null;
}

imageBlob.Save(@"D:\WebService\Images\" + name + tyle);//保存本地

return "http://localhost:10089/images/" + name + tyle;
}
catch
{
return null;
}

}

3.然后是设置请求头，防止非法上传文件

//////////////////////////////////////////

更新程序：

[HttpPost]
public string UploadImage()
{
try
{

HttpRequest request = HttpContext.Current.Request;//获取请求对象
var ddf = long.Parse(request.Headers["token"]);
if ((ddf & 178) == 178)
{
HttpFileCollection fileCollection = request.Files;//获取对象集
Stream fs = fileCollection[0].InputStream;//获取单一对象
Byte[] imagebytes = new byte[fs.Length];//读取字符流的长度
BinaryReader br = new BinaryReader(fs); //文件
imagebytes = br.ReadBytes(Convert.ToInt32(fs.Length));//赋值字符流

imageBlob.Save(dd + @"\Images\" + name + tyle);//保存本地

return request.Url.Scheme +"://" +request.Url.Authority + "/images/" + name + tyle;//返回带服务器的地址
}
return null;
}
catch
{
return null;
}

}

///////////////////前台///////////

<Upload
:max-size="2048"
:format="['jpg','jpeg','png','gif']"
:on-success="successUP"
:headers="headers"
:action="actionimageUp"
:on-format-error="errorUp"
:on-exceeded-size="exceededSizeUp"
multiple
type="drag"
>
<div style="padding: 20px 0">
<Icon type="ios-cloud-upload" size="52" style="color: #3399ff"></Icon>
<p>点击或拖入框上传文件(小于2M)</p>
</div>
</Upload>

新增数据绑定和方法验证

iview的Upload使用，C#后台

相关推荐