前端:

通过Ajax方式上传文件,使用FormData进行Ajax请求。上传文件或图片时,要求的格式为enctype ="multipart/form-data"(以二进制格式上传),在使用ajax上传时需要注意。

html代码:

js代码:

当上传完成,我们可以拿到控制台的信息:

Content-Type:multipart/form-data

注意:我们在使用data:formData 传数据时,不能写为 data:{data:formData}这种键值对的格式,这样后台拿到的数据就不再是 multipart/form-data 。个人认为可能的原因是,如果也成键值对的格式,那么ajax会去解析这个数据,这样就把原来的multipart/form-data 格式解析为普通的json格式,因此不能写为键值对的方式传输。

后台那数据时,要通过input的name来拿。

后台:

ajax上传图片到服务器简单操作的更多相关文章

  1. 使用Ajax上传图片到服务器(不刷新页面)

    有时候我们需要上传图片时不刷新页面,那么Ajax就是很好的东西哦.之前在网上找了很多的资料都不对,不是这里就是那里错,这是本人亲自测试了的哈,是没有问题的,若有不足之处希望指正.我用的.net,对了这 ...

  2. ajax上传图片到服务器

    通过Ajax方式上传文件,使用FormData进行Ajax请求.上传文件或图片时,要求的格式为enctype ="multipart/form-data"(以二进制格式上传),在使 ...

  3. js ajax上传图片到服务器

    $("#up_goods_pic").on('change',function(){ var file = this.files[0]; var url = webkitURL.c ...

  4. Ajax上传图片以及上传之前先预览

    手头上有几个小项目用到了easyUI,一开始决定使用easyUI就注定了项目整体上前后端分离,基本上所有的请求都采用Ajax来完成.在文件上传的时候用到了Ajax上传文件,以及图片在上传之前的预览效果 ...

  5. 服务器文档下载zip格式 SQL Server SQL分页查询 C#过滤html标签 EF 延时加载与死锁 在JS方法中返回多个值的三种方法(转载) IEnumerable,ICollection,IList接口问题 不吹不擂,你想要的Python面试都在这里了【315+道题】 基于mvc三层架构和ajax技术实现最简单的文件上传 事件管理

    服务器文档下载zip格式   刚好这次项目中遇到了这个东西,就来弄一下,挺简单的,但是前台调用的时候弄错了,浪费了大半天的时间,本人也是菜鸟一枚.开始吧.(MVC的) @using Rattan.Co ...

  6. 使用ajax上传图片,支持图片即时浏览,支持js图片压缩后上传给服务器

    使用ajax上传图片,支持图片即时浏览,支持js图片压缩后上传给服务器 ajax上传主要使用了 var reader = new FileReader() 此方法 js图片压缩主要是利用canvas进 ...

  7. ftp服务器搭建及简单操作

    ftp服务器搭建及简单操作 1. 添加一个新用户,使用名useradd testftp,然后使用passwd testftp对新添加的用户设置密码(这里设置为“1234567”). 2. 安装ftp服 ...

  8. 通过android 客户端上传图片到服务器

    昨天,(在我的上一篇博客中)写了通过浏览器上传图片到服务器(php),今天将这个功能付诸实践.(还完善了服务端的代码) 不试不知道,原来通过android 向服务端发送图片还真是挺麻烦的一件事. 上传 ...

  9. 写一个ajax程序就是如此简单

    写一个ajax程序就是如此简单 ajax介绍: 1:AJAX全称为Asynchronous JavaScript and XML(异步JavaScript和XML),指一种创建交互式网页应用的网页开发 ...

随机推荐

  1. Delphi MD5

    unit uMD5; interface uses Windows, Messages, SysUtils, Variants, Classes, Graphics; type MD5Count = ...

  2. Node.js NPM 介绍

    章节 Node.js NPM 介绍 Node.js NPM 作用 Node.js NPM 包(Package) Node.js NPM 管理包 Node.js NPM Package.json NPM ...

  3. Android_03android拨号软件

    今日开发了一个简单的安卓拨号软件. 步骤如下: 1.先构建用户界面 2.写java代码获取控件 3.进行逻辑的控制 4.添加权限 1.构建用户界面 2.点进R.java文件会发现系统已经自动生成索引, ...

  4. oracle函数创建与调用

    函数的定义: CREATE OR REPLACE FUNCTION FUNCTION_TEST(PARAMER1 IN VARCHAR, -- 参数的类型不写长度 PARAMER2 OUT VARCH ...

  5. oracle11g数据库的安装

     先在 Oracle官网上下载11g  oracle Database 11g 第 2 版 (11.2.0.1.0) 标准版.标准版 1 以及企业版,适用于 Microsoft Windows (x6 ...

  6. JAVA字节码文件之第四篇(方法分析)

    一.Methods 方法字节码结构 Methods 字节码结构: Methods num:占两byte,Methods 的具体内存占n个byte 方法中每个属性都是Attribute_info,Att ...

  7. Swift之分割视图控制器-UISplitViewController

    Swift之分割视图控制器-UISplitViewController UISplitViewController这种控制器只能用于iPad,它可以在iPad屏幕中显示两个不同的场景:在横向模式下,左 ...

  8. windows FTP上传

    TCHAR tcFileName[MAX_PATH * 4] = {L"visio2010永久安装密钥.txt"}; TCHAR tcName[MAX_PATH * 4] = {0 ...

  9. ..\OBJ\LED.axf: Error: L6218E: Undefined symbol EXTI_Init (referred from exti.o). 错误修改

    今天在移植野火的程序到元子的开发平台上时候,发现自己在中断初话中断函数的时候出现了:..\OBJ\LED.axf: Error: L6218E: Undefined symbol EXTI_Init ...

  10. HTML5新标签使用及CSS选择器(伪类)

    这些标签能够让搜索引擎更直接的解析页面内容. <header></header>语义:文档或者页面的头部 <nav></nav>语义:导航这两者不是组合 ...