html ajax上传图片到服务器 后端采用asp.net webapi

前端有各种现实上传图片的控件,样式可以做的很美观。我这里只用基本的样式做图片上传。

前端代码

   <input name="Userfile" id="Userfile" type="file"></span>

js代码

 var formDate = new FormData();
var files = $("#Userfile").get(0).files; formDate.append("Userfile", files[0]);
//如果有其他参需要一起提交到后台
formDate.append("location", location); $.ajax({
type: "POST",
url: url,
contentType: false,
cache: false,
processData: false,
data: formDate,
error: function (request) { },
success: function (data) { }
});

C# webapi代码

        [HttpPost]
public object Save()
{
//图片存储路径
string path = AppDomain.CurrentDomain.SetupInformation.ApplicationBase + "img/";
//用户提交的数据
var Data = System.Web.HttpContext.Current.Request.Form;
string filesrc = string.Empty;
string src = string.Empty;
//获取上传的文件
var httpPostedFile = HttpContext.Current.Request.Files;
if (httpPostedFile != null && httpPostedFile.Count > )
{
var file = httpPostedFile[];
string imgType = Path.GetExtension(file.FileName);
//限制文件上传类型
if (imgType.Contains(".jpg")|| imgType.Contains(".png")|| imgType.Contains(".bmp"))
{
string FileName = Guid.NewGuid().ToString() + imgType;
filesrc = path + FileName;
src = "/images/" + FileName;
// 如果目录不存在则要先创建
if (!Directory.Exists(uploadPath))
{
Directory.CreateDirectory(uploadPath);
}
file.SaveAs(filesrc); }
} if (!string.IsNullOrEmpty(src))
{
//存储图片路径到数据库
} }

ajax C# webapi上传图片的更多相关文章

  1. Asp.Net WebApi上传图片

    webapi using System; using System.Collections; using System.Collections.Generic; using System.Diagno ...

  2. 基于jQuery的ajax对WebApi和OData的封装

    基于jQuery的ajax对WebApi和OData的封装 WebApi 的使用带来了一个显著的特点,对type有一定的要求.一般ajax的type无非就是两种,GET和POST.如果用JSONP来跨 ...

  3. WebApi上传图片 await关键字

    await关键字对于方法执行的影响 将上一篇WebApi上传图片中代码修改(使用了await关键字)如下: [HttpPost] public async Task<string> Pos ...

  4. jQuery的ajax对WebApi和OData的封装

    基于jQuery的ajax对WebApi和OData的封装 WebApi 的使用带来了一个显著的特点,对type有一定的要求.一般ajax的type无非就是两种,GET和POST.如果用JSONP来跨 ...

  5. kindeditor修改图片上传路径-使用webapi上传图片到图片服务器

    kindeditor是一个非常好用的富文本编辑器,它的简单使用我就不再介绍了. 在这里我着重介绍一些使用kindeditor修改图片上传路径并通过webapi上传图片到图片服务器的方案. 因为我使用的 ...

  6. kindeditor扩展粘贴图片功能&修改图片上传路径并通过webapi上传图片到图片服务器

    前言 kindeditor是一个非常好用的富文本编辑器,它的简单使用我就不再介绍了. 而kindeditor却对图片的处理不够理想. 本篇博文需要解决的问题有两个: kindeditor扩展粘贴图片功 ...

  7. kindeditor扩展粘贴截图功能&修改图片上传路径并通过webapi上传图片到图片服务器

    前言 kindeditor是一个非常好用的富文本编辑器,它的简单使用我就不再介绍了. 而kindeditor却对图片的处理不够理想. 本篇博文需要解决的问题有两个: kindeditor扩展粘贴图片功 ...

  8. TP3.2:实现Ajax无刷新上传图片

    1.基于TP3.2+ajaxfileupload进行无刷新上传图片,本次只上传一张,多张以后搞出来再发 2.效果:   3.html代码: <html> <head> < ...

  9. ajax+webapi上传图片问题

    自己想写一个原生的JS的图片上传,不想一直只是使用上传文件的框架 网上有很多jquery上传图片上传文件的插件,但是要不是用特定的后台框架接收,要不就是只能上传图片,不是文件,还有一些其他的问题,所以 ...

随机推荐

  1. C & C++ 宏与const

    1.宏定义函数: 例:#define do{exp} while(0)与#define exp有什么不同,好处在哪里? 定义复杂代码,防止分号,或是括号不匹配等错误.比如: 定义: #define s ...

  2. C# 发送电子邮件(含附件)用到的类 system.web.mail

    主要是用到了System.Web.Mail命名空间,用到了此空间的三个类,分别是: ●MailMessage类,用于构造电子邮件●MailAttachment类,用于构造电子邮件附件●SmtpMail ...

  3. 27-x的y次方的后三位数

    题目内容: 输入描述 数据分n组,对于每组数据有两个正整数x和y(x的y次方必须大于100) 输出描述 对于每组输出,输出一个值,即x的y次方结果的最后三位数 提示:13的13次方为:30287510 ...

  4. cmake 总结

    cmake中一些预定义变量 PROJECT_SOURCE_DIR 工程的根目录 PROJECT_BINARY_DIR 运行cmake命令的目录,通常是${PROJECT_SOURCE_DIR}/bui ...

  5. spring框架中工厂方法的创建和销毁

    1.编写接口UserSerivce: public interface UserService { public void sayHello(); } 2.编写实实现接口的方法,在该方法中除了要实现接 ...

  6. C#调用默认浏览器打开网页的几种方法

    private void button1_Click(object sender, EventArgs e) { //从注册表中读取默认浏览器可执行文件路径 RegistryKey key = Reg ...

  7. 版本号比较函数-js

    面试前,让做的一个版本号比较函数. <script type="text/javascript"> var v1=prompt("请输入第一个版本号" ...

  8. code4906 删数问题

    题目: 键盘输入一个高精度的正整数n(<=240位), 去掉任意s个数字后剩下的数字按原左右次序将组成一个新的正整数. 编程对给定的n和s,寻找一种方案,使得剩下的数最小. Simple Inp ...

  9. <Linux多线程服务端编程>学习记录

    使用智能指针解决多线程下 类的解析冲突问题 有这样一个场景 使用StockFactory记录Stock的信息  容器是map<string,smart_ptr>; 代码如下: #inclu ...

  10. RESTful Web API 实践

    REST 概念来源 网络应用程序,分为前端和后端两个部分.当前的发展趋势,就是前端设备层出不穷(手机.平板.桌面电脑.其他专用设备...). 因此,必须有一种统一的机制,方便不同的前端设备与后端进行通 ...