JSON 与 JSONP 的 MIME 类型详解

技术背景

在数据交互中，JSON（JavaScript Object Notation）是一种轻量级的数据交换格式，广泛应用于前后端数据传输。而 JSONP（JSON with Padding）是一种跨域数据交互技术。MIME（Multipurpose Internet Mail Extensions）类型用于标识数据的格式，在 HTTP 通信中，正确设置 MIME 类型能确保客户端正确解析数据。

实现步骤

JSON 的 MIME 类型设置

JSON 的标准 MIME 类型是 application/json，默认编码为 UTF-8。以下是不同场景下的设置方法：

• Apache 服务器：在 Ubuntu 或 Debian 系统中，若使用 Apache 服务器提供 .json 文件，需编辑 /etc/mime.types 文件，添加 application/json json 行，然后重启 Apache：

sudo service apache2 restart

• Spring MVC 框架：在服务器端代码中，可通过以下方式设置响应的 MIME 类型为 application/json：

return new AbstractUrlBasedView() 
{
    @SuppressWarnings("unchecked")
    @Override
    protected void renderMergedOutputModel(Map model, HttpServletRequest request,
                                           HttpServletResponse response) throws Exception 
    {
        response.setContentType("application/json");
        response.getWriter().write(json);
    }
};

• JSP 页面：在 JSP 页面的页面指令中设置：

<%@ page language="java" contentType="application/json; charset=UTF-8"
    pageEncoding="UTF-8"%>

JSONP 的 MIME 类型设置

JSONP 本质是可运行的 JavaScript 代码，其 MIME 类型应为 application/javascript。示例如下：

functionCall({"Name": "Foo", "Id": 1234, "Rank": 7});

核心代码

客户端 Ext GWT 表单监听代码

uploadForm.getForm().addListener(new FormListenerAdapter()
{
    @Override
    public void onActionFailed(Form form, int httpStatus, String responseText) 
    {
        MessageBox.alert("Error");
    }

    @Override
    public void onActionComplete(Form form, int httpStatus, String responseText) 
    {
        MessageBox.alert("Success");
    }
});

服务器端 Spring MVC 响应代码

return new AbstractUrlBasedView() 
{
    @SuppressWarnings("unchecked")
    @Override
    protected void renderMergedOutputModel(Map model, HttpServletRequest request,
                                           HttpServletResponse response) throws Exception 
    {
        response.setContentType("text/html");
        response.getWriter().write(json);
    }
};

最佳实践

• 尽量使用标准的 MIME 类型 application/json 传输 JSON 数据，这样能避免浏览器警告，且在开发工具中能更好地显示和调试数据。
• 若需使用 JSONP 进行跨域请求，设置 MIME 类型为 application/javascript。
• 在处理文件上传时，若使用 Ext JS 表单提交，服务器端返回 JSON 数据时，Content-Type 应设置为 text/html，以确保浏览器正确解析。

常见问题

浏览器提示保存文件

当使用 application/json 作为响应类型时，浏览器可能会提示保存文件。这可能是因为浏览器无法正确处理该 MIME 类型。可以尝试将 Content-Type 设置为 text/html，但这不是标准做法，仅适用于特定场景。

压缩问题

在共享主机环境中，可能无法更改服务器配置，导致 JSON 响应无法压缩。此时可尝试使用 application/x-javascript 作为 MIME 类型，并在 web.config 文件中进行相应配置：

<httpCompression>
    <scheme name="gzip" dll="%Windir%\system32\inetsrv\gzip.dll"/>
    <dynamicTypes>
        <add mimeType="text/*" enabled="true"/>
        <add mimeType="message/*" enabled="true"/>
        <add mimeType="application/javascript" enabled="true"/>
        <add mimeType="application/x-javascript" enabled="true"/>
        <add mimeType="*/*" enabled="false"/>
    </dynamicTypes>
    <staticTypes>
        <add mimeType="text/*" enabled="true"/>
        <add mimeType="message/*" enabled="true"/>
        <add mimeType="application/javascript" enabled="true"/>
        <add mimeType="application/x-javascript" enabled="true"/>
        <add mimeType="*/*" enabled="false"/>
    </staticTypes>
</httpCompression>
<urlCompression doStaticCompression="true" doDynamicCompression="true"/>

不同客户端支持问题

部分客户端对 application/json 的支持不佳，jQuery 建议默认使用 text/html。在开发时，需考虑不同客户端的兼容性。