使用abp框架,使用了Zero模块。再使用Element ui进行上传图片。出现400 bad request错误请求。
用postman传数据到接口时正常工作的。
经过几经波折,终于找到问题是nati token的问题。 https://forum.aspnetboilerplate.com/viewtopic.php?f=5&t=10025&sid=5b3ace20a25195168c29846975df630d
因为element ui 不是abp的部分。他使用的ajax请求没有包含antiForgery token。所以被abp框架视为是跨站攻击的请求,所以返回了400错误。同理,用jquery的ajax方法去请求数据也是会出现这错误的。
用postman能够正确请求,因为postman没有使用apb view页面,没有设置antiForgery token。所以可以上传文件。
解决办法是在请求头加X-XSRF-TOKEN。
那么问题变成了,如何获取antiForgery token。
答案是,使用abp封装的方法: abp.security.antiForgery.getToken()。 https://aspnetboilerplate.com/Pages/Documents/XSRF-CSRF-Protection
我贴一下示例
<script src="~/js/jquery.min.js"></script> <script src="~/libs/abp-web-resources/Abp/Framework/scripts/abp.js"></script> <script src="~/libs/abp-web-resources/Abp/Framework/scripts/libs/abp.jquery.js"></script> <script> //模拟数据 var newPerson = { name: 'Dougles Adams', age: 42 }; // headers设置! var headers = { 'x-xsrf-token': abp.security.antiForgery.getToken() }; //abp ajax abp.ajax({ url: '/api/services/app/TestService/Test', data: JSON.stringify(newPerson), headers: headers, dataType: "json" }).done(function (data) { alert(data) }); //jquery ajax $.ajax({ type: 'POST', url: '/api/services/app/TestService/Test', headers: headers, data: JSON.stringify(newPerson), success: function (data) { console.log(data); } }); </script>
转载于:https://www.cnblogs.com/saving/p/8056964.html