Resource interpreted as Document but transferred with MIME type text/json:

cause

后端代码：response.setContentType("text/html; charset=UTF-8");
前端代码：把success(Object data, String textStatus, jqXHR jqXHR)的data参数当做对象使用，访问其成员属性data.success。

错误：
报错Resource interpreted as Document but transferred with MIME type application/json:，
意为资源解释为文档，但是(我们)使用了MIME类型 text/json 去传输。
且：前端提示增加用户失败(即使后端数据库增加是成功的)。

resolve

• 解决分两步：

  • 后端：修改contentType为text/html，这样不会报错(如题目)。
    但success(data)方法内根据data.success执行的程序流程依旧不对。

  • 前端：将string类型的data解析为JS object(使用JSON.parse(text)方法)。
    然后对解析后的对象进行使用。

• 修改前：

  • 后端：response.setContentType("text/json; charset=UTF-8");
    报错(如题目)。

  • 前端：

$("#fm).form("submit", {
    url: "/InsertUser",
    success: function(data, textStatus, jqXHR) {
        console.log("data: ", data);                // {"success":true, "msg":"新增用户成功"}
        console.log("textStatus: ", textStatus);    // undefined
        console.log("jqXHR: ", jqXHR);              // undefined
        console.log(Object.prototype.toString.call(data));  // [object String]  响应的是字符串
        // 所以data.success为undefined，所以一直会执行else代码块(即使后台增加用户的操作成功)。
        if (data.success) {
            $("#dlg").dialog("close);   // 关闭对话框
            $("#dg).datagrid("reload);  // 重载数据网格
        } else {
            alert("增加用户出错");
        }
    }
});

数据库操作(增加用户)完成，但执行else代码块。。。WHY

• 修改后：
  • 后端：修改contentType为text/html，这样不会报错。
    response.setContentType("text/html; charset=UTF-8");
    虽然不报错Resource interpreted as Document but transferred with MIME type application/json:，
    但是，就算后台增加用户成功，前端JS依旧执行else代码块(因为data.success未定义)。

那么如何访问到字符串中的success属性？
我觉得有至少两种方法：

对字符串进行正则解析。获取success后面的值
调用JSON.parse(text)将字符串解析为JS对象，然后访问对象的属性。
以下为第二种：

• 前端：增加步骤，对字符串data解析，得到JS对象。这样可以访问其成员属性。

$("#fm).form("submit", {
    url: "/InsertUser",
    success: function(data, textStatus, jqXHR) {
        console.log(Object.prototype.toString.call(data));  // [object String]
        var obj = JSON.parse(data);     // 把字符串格式的JSON数据解析为JS对象。
        // 这样，obj.success才是读取到了对象的success属性值。
        if (obj.success) {
            $("#dlg").dialog("close);   // 关闭对话框
            $("#dg).datagrid("reload);  // 重载数据网格
        } else {
            alert("增加用户出错");
        }
    }
});

另

我觉得可能还有一种方法，
后端：response.setContentType("text/html; charset=UTF-8")
其中同时设置了contentType和CharacterEncoding两个响应头。

当contentType为text/json时，报错(见标题)。
为其他多个值(经测试)，也报相似的错。
只有修改为text/html后，不报如题目中的错误。

那么，可能存在一种我还未测试到的内容类型，既可以不报错，又可以直接返回data为对象类型。
这样，只需要修改一点点后端代码。前端代码不变。

后续…