禁止Chrome的页面缓存

Chrome总是缓存页面, Internet Explorer, FireFox, Opera都提供了自己方式可以关掉缓存,实在不行在 HTTP头中加上 " Cache-Control"为" no-cache",可是顽固的 Chrome无效,依旧自动缓存。现在新版的 ChromeDeveloper ToolsF12调出来)的 Network标签中有了个 Disable cache选项,可以解决这类问题。

如下图:

参考链接


HTML5文件实现拖拽上传

通过HTML的文件API ,Firefox、Chrome等浏览器已经支持从操作系统直接拖拽文件,并上传到服务器。

相对于使用了十多年的HTML表单,这是一个革命性的进步。虽然IE的落后让很多开发者还在观望中,但是Gmail邮箱的附件拖拽功能已经给部分用户带来了极大的方便,而需要大量上传文件的CMS(内容管理系统)也将会从中受益。

让我们看一下Firefox 是如何使用拖拽上传功能的:

首先提供一个区域来放置文件

Html代码

然后监听拖拽过程中的dragenter,dragleave,drop等事件

Js代码

其中最主要的是drop事件中用handleFiles()依次处理所有文件

对于图片类型的文件可以直接读取内容,显示预览图

接下来就是核心功能:ajax上传。首先新建一个XHR请求

监听上传进度和完成事件

最后把数据模拟成multipart/form-data的格式上传

参考链接


HTML5文件实现拖拽上传