文件上传下载 Content-type 设置整理

一、Content-type基本概念

        HTTP协议提供了Content-Type实体首部字段来描述报文实体的媒体格式，说明请求或返回的消息是用什么格式进行编码的，在request header和response header里都有存在。 用来向服务器或者浏览器说明传输的文件格式，以便服务器和浏览器按照正确的格式进行解析。在最初的的http post请求只支持application/x-www-form-urlencoded,参数是通过浏览器的url进行传递，但此种方法不支持文件上传，所以后来Content-type 扩充了multipart/form-data类型以支持向服务器发送二进制数据，以及随着后面web应用的日益发展增加了application/json的类型

二、MIME类型说明：

• 语法结构

Content-Type: [type]/[subtype];parameter

1、type 有下面的形式：

• Text：用于标准化地表示的文本信息，文本消息可以是多种字符集和或者多种格式的；
• Multipart：用于连接消息体的多个部分构成一个消息，这些部分可以是不同类型的数据；
• Application：用于传输应用程序数据或者二进制数据；
• Message：用于包装一个E-mail消息；
• Image：用于传输静态图片数据；
• Audio：用于传输音频或者音声数据；
• Video：用于传输动态影像数据，可以是与音频编辑在一起的视频数据格式。

2、subtype 用于指定 type的详细形式。“type/subtype”配对的集合和与此相关的参数。下面是最经常用到的一些 MIME 类型：

• text/html（HTML 文档）；
• text/plain（纯文本）；
• text/css（CSS 样式表）；
• image/gif（GIF 图像）；
• image/jpeg（JPG 图像）；
• application/x-javascript（JavaScript 脚本）；
• application/x-shockwave-flash（Flash）；
• application/x- www-form-urlencoded（使用 HTTP 的 POST方法提交的表单）；
• multipart/form-data（同上，但主要用于表单提交时伴随文件上传的场合）。

3、常用类型

三、常见使用场景

1、提交表单

<form action="/FileUploadServlet"  method="POST">
	<input type="text" name="username"/>
	<input type="password" name="password"/>
	<input type="submit" value="Send"/>
</form>

当我们没有对其指定enctype值或者显示指定enctype="application/x-www-form-urlencoded"值时，Request报文的Content-Type字段值和请求实体如下:

#Content-Type首部字段.
Content-Type:application/x-www-form-urlencoded

#请求实体内容.
username=CYanLong&password=123456

2、文件上传

multipart/form-data

multipart/form-data 可用于HTML表单从浏览器发送信息给服务器。作为多部分文档格式，它由边界线（一个由'--'开始的字符串）划分出的不同部分组成。每一部分有自己的实体，以及自己的 HTTP 请求头，Content-Disposition和 Content-Type 用于文件上传领域，最常用的 (Content-Length 因为边界线作为分隔符而被忽略）。

Content-Type: multipart/form-data; boundary=aBoundaryString
(other headers associated with the multipart document as a whole)

--aBoundaryString
Content-Disposition: form-data; name="myFile"; filename="img.jpg"
Content-Type: image/jpeg

(data)
--aBoundaryString
Content-Disposition: form-data; name="myField"

(data)
--aBoundaryString
(more subparts)
--aBoundaryString--

如下所示的表单:

<form action="http://localhost:8000/" method="post" enctype="multipart/form-data">
  <input type="text" name="myTextField">
  <input type="checkbox" name="myCheckBox">Check</input>
  <input type="file" name="myFile">
  <button>Send the file</button>
</form>

会发送这样的请求:

POST / HTTP/1.1
Host: localhost:8000
User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.9; rv:50.0) Gecko/20100101 Firefox/50.0
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
Accept-Language: en-US,en;q=0.5
Accept-Encoding: gzip, deflate
Connection: keep-alive
Upgrade-Insecure-Requests: 1
Content-Type: multipart/form-data; boundary=---------------------------8721656041911415653955004498
Content-Length: 465

-----------------------------8721656041911415653955004498
Content-Disposition: form-data; name="myTextField"

Test
-----------------------------8721656041911415653955004498
Content-Disposition: form-data; name="myCheckBox"

on
-----------------------------8721656041911415653955004498
Content-Disposition: form-data; name="myFile"; filename="test.txt"
Content-Type: text/plain

Simple file.
-----------------------------8721656041911415653955004498--

3、JSON数据格式传输 application/json

此类型告诉服务端数据是序列化的json字符串，由于json规范的流行和越来越多的浏览器支持原生JSON.stringfy，此类型也越来越多的被使用。
（最后发送到服务端的数据格式eg:"{'name':'黄晓明','age':'40'}"）

四、例子

1、application/json例子

前段提交

$.ajax({
    url:"../../Notice/LoadForm.do",
    type:"post",
    contentType:"application/json;charset=UTF-8",
    data:JSON.stringify({"id":"1","title":"标题"})
});

后端接收（java-spring）

@RequestMapping(value="Notice/LoadForm")
@ResponseBody
public ResultJO loadForm(@RequestBody Notice notice){

}

2、下载例子（java-spring）

@RequestMapping("/download")
    public void download(HttpServletRequest request, HttpServletResponse response){
 
        File file=new File("filenamepath.xls");
        String fileName=file.getName();
        String ext=fileName.substring(fileName.lastIndexOf(".")+1);
        //判断浏览器类型
        String agent=(String)request.getHeader("USER-AGENT"); 
        try {
            if(agent!=null && agent.indexOf("Fireforx")!=-1) {
            		//UTF-8编码，防止输出文件名乱码
                fileName = new String(fileName.getBytes("UTF-8"), "iso-8859-1");   
            }
            else {
                fileName= URLEncoder.encode(fileName,"UTF-8");
            }
        } catch (UnsupportedEncodingException e) {
            e.printStackTrace();
        }
 
        BufferedInputStream bis=null;
        OutputStream os=null;
        response.reset();
        response.setCharacterEncoding("utf-8");
        if("doc".equals(ext)) {
            response.setContentType("application/msword"); 
        }else if("pdf".equals(ext)) {
            response.setContentType("application/pdf"); 
        }else if("xls".equals(ext)){
            response.setContentType("application/octet-stream;charset=ISO8859-1");
        }else if("filetype".equals(ext)){
            ..............自行扩展
        }
        response.setHeader("Content-Disposition", "attachment; filename=" + fileName);
 
        try {
            bis=new BufferedInputStream(new FileInputStream(file));
            byte[] b=new byte[bis.available()+1000];
            int i=0;
            os = response.getOutputStream();  
            while((i=bis.read(b))!=-1) {
                os.write(b, 0, i);
            }
            os.flush();
            os.close();
        } catch (IOException e) {
            e.printStackTrace();
        }finally {
            if(os!=null) {
                try {
                    os.close();
                } catch (IOException e) {
                    e.printStackTrace();
                }
            }
        }
 
    }

五、问题收集

1、 在 IE6 IE7 IE8 中，若一个页面被打开时接收到的响应头的content-type 为text/plain，浏览器会尝试嗅探页面文件内实际内容来判断是否可能为一个 HTML 文档，若是则会以 text/html的方式将页面作为 HTML 文档解释，而不是将其作为纯文本内容处理。

解决办法：使用attachment

2、 jpg、tmp、png等格式图片没有办法用 windows 图片和传真查看器直接打开

解决办法：使用attachment

3、docx、pptx等Office2007格式文件可能会被浏览器错误识别为zip格式文件下载或打开

4、SpringMVC在使用JSON时报错信息为：Content type 'application/json;charset=UTF-8' not supported

直接原因是：我的(maven)项目parent父工程pom.xml缺少必要的三个jar包依赖坐标。

解决方法是：在web子模块的pom.xml里面添加springMVC使用JSON实现AJAX请求。

<!--spring mvc-json依赖-->
        <dependency>
            <groupId>com.fasterxml.jackson.core</groupId>
            <artifactId>jackson-databind</artifactId>
            <version>2.9.9</version>
        </dependency>
        <dependency>
            <groupId>com.fasterxml.jackson.core</groupId>
            <artifactId>jackson-core</artifactId>
            <version>2.9.9</version>
        </dependency>
        <dependency>
            <groupId>com.fasterxml.jackson.core</groupId>
            <artifactId>jackson-annotations</artifactId>
            <version>2.9.9</version>
        </dependency>

六、Mime 类型列表

文章内容来源：
https://www.w3school.com.cn/media/media_mimeref.asp 
https://www.cnblogs.com/cyanlong/p/5726793.html
https://www.jianshu.com/p/4b09c260f9b2
https://blog.csdn.net/u013749540/article/details/78195266
https://developer.mozilla.org/zh-CN/docs/Web/HTTP/Basics_of_HTTP/MIME_types
http://www.mamicode.com/info-detail-2785469.html