在angular 1.4版本的项目中,程序一直运行正常,突然有一天,在提交表单时,提示“HTTP 405”错误——“Method Not Allowed”。

从字面上的意思理解,很显然是提交方法的类型错误,要么是以GET方式向POST接口提交数据,要么是POST方式项GET接口提交数据,但反反复复检查了后端接口与提交方式,都是POST,完全没有问题。

仔细检查前端代码,发现编写方式如下:

$http({
    method : 'POST',
    url : '/test',
    params : {
        cycle : key,
        emp_id : user.id
    }
 }).success(function (resp) {
    //  处理逻辑
 });

这样的编程方式有两个问题:
1. 提交的参数暴露在外;
2. 默认提交的Header参数“content-type”为“application/json”;

但经过反复的实验,请参见《浏览器查询参数与表单数据的优先级》,第一个问题不会导致405错误,所以很容易确定问题所在,解决办法是明确指定“content-type”,如下:

$http({
    method : 'POST',
    url : '/test',
    params : {
        cycle : key,
        emp_id : user.id
    },
    //  新增content-type头部属性
    heads : {
        'content-type' : 'application/x-www-form-urlencoded'
    }
 }).success(function (resp) {
    //  处理逻辑
 });

如果要解决第一个问题,那么只需要引入$httpParamSerializer服务即可,如下:

$http({
    method : 'POST',
    url : '/test',
    //  以表单方式提交,将Object转换为form参数方式
    data : $httpParamSerializer({
        cycle : key,
        emp_id : user.id
    }),
    //  新增content-type头部属性
    heads : {
        'content-type' : 'application/x-www-form-urlencoded'
    }
 }).success(function (resp) {
    //  处理逻辑
 });

结论

在发生HTTP 405错误,不妨首先检查下请求头部的“content-type”信息。

Logo

为开发者提供学习成长、分享交流、生态实践、资源工具等服务,帮助开发者快速成长。

更多推荐