站群搭建,代码做网站,2d动画制作软件,那些网站分享pr做的视频软件【Django restframework】django跨域问题#xff0c;解决PUT/PATCH/DELETE用ajax请求无法提交数据的问题 1 问题描述#xff1a;
我用restframework(ModelSerializerGenericApiView)开发了一组符合RestFul接口标准的接口#xff0c;这意味着它将支持客户端发来的GET、POST、…【Django restframework】django跨域问题解决PUT/PATCH/DELETE用ajax请求无法提交数据的问题 1 问题描述
我用restframework(ModelSerializerGenericApiView)开发了一组符合RestFul接口标准的接口这意味着它将支持客户端发来的GET、POST、PATCH、PUT、DELETE请求分别对某一资源进行获取、创建、部分修改、全部修改、删除操作。 在进行前后端联调的时候我遇到了跨域问题ccess to XMLHttpRequest at ‘http://127.0.0.1:8000/book/’ from origin ‘http://localhost:63342’ has been blocked by CORS policy: No ‘Access-Control-Allow-Origin’ header is present on the requested resource。 于是我使了用第三方库django-cors-headers并在settings中做了一些配置。此时GET、POST请求(简单请求)可以正常的提交与请求数据但是PUT请求提示net::ERR_CONNECTION_ABORTED浏览器返回NetworkError: Failed to execute ‘send’ on ‘XMLHttpRequest’: Failed to load 我很困惑并不清楚为什么跨域请求资源只允许提交GET/POST请求因为之前我已在后端做好了一系列配置。这个问题困扰了我两天期间我尝试了各种方法包括自定义CORS中间件、重写ajax提交PUT请求的方式等都没有解决PUT无法提交的问题。终于我找到了一个办法并且成功了。
我的服务器是Windows Server2016 2 解决办法
2.1 解决方法综述
① 前端用POST请求替代PUT/DELETE并且在header中定义X-HTTP-Method-OverridePUT
② 后端引入python第三方库django-method-override它用于识别前端http请求header中的X-HTTP-Method-Override参数值并将它与相应的视图对应起来。2.2 解决方法实行
2.2.1 前端
前端我用的是jQuery ajax来发起PUT请求我做了以下配置:
$.ajax({url: yourUrl,type: POST, // 此处必须是POSTheaders: {X-HTTP-Method-Override: PUT, // 此处是实际的请求方式 对应后端视图可接受的请求方式accept: application/json, // 这也是必须的},data: JSON.stringify({name: name,mobile: mobile,province: province,}),dataType: json,contentType: application/json,async: false,crossDomain: true,success: function (res) {// 成功的操作},error: function (res) {// 失败的操作}
})2.2 后端的配置
第一步安装django-method-override
pip install django-method-override第二步重写项目配置文件settings.py
INSTALLED_APPS [corsheaders,method_override, # 新增的# ...
]MIDDLEWARE [corsheaders.middleware.CorsMiddleware,# ...django.middleware.csrf.CsrfViewMiddleware,method_override.middleware.MethodOverrideMiddleware, # 新增method_override中间件注意在CSRF之下# ...
]第三步重启项目 成功提交并且成功的更新了数据库。 目前我只尝试了PUT请求PATCH和DELETE还未用此法进行测试。如果有问题我将回来更新这篇文章希望能对大家解决此问题提供一些思路。 PATCH也已经用这种方法试过了没有问题可以正常提交。
