使用Promise、await解决异步请求结果处理、请求跨域问题

最新推荐文章于 2022-08-31 14:49:34 发布

Gary GIS

最新推荐文章于 2022-08-31 14:49:34 发布

阅读量1.3k

点赞数

分类专栏：前端文章标签：前端 javascript es6

本文链接：https://blog.csdn.net/Tom_Jay/article/details/122925276

版权

本文介绍了如何使用Promise和await解决前端开发中的请求跨域和异步结果处理问题。从应用场景出发，阐述了跨域的常见解决方案及其缺点，然后详细讲解了Promise对象的作用和限制。核心实现部分包括将请求转换为jsonp格式，包装成Promise，使用async关键字定义异步方法。最后，作者提醒读者，内容可能存在不准确之处，欢迎大家讨论，但请勿恶意杠精。

摘要由CSDN通过智能技术生成

前言

相信很多前端的小伙伴都经常被请求跨域、异步请求结果处理这俩玩意搞得头昏脑涨吧，今天看到这篇文章，彻底治好你的“偏头疼”！

应用场景

1、请求后端接口时，因为域名、请求头参数不一致等原因，跨域了，啊……（崩溃中），一般都需要找后端工程师添加IP、域名、允许所有请求头，这样一来，虽然能解决问题，但是麻烦，同时也降低了后端接口的安全性。Access to XMLHttpRequest at 'https://*.*.*.*/api' from origin 'http://localhost:8900' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
2、针对以上问题，有小伙伴可能要说了，直接把数据类型改成“jsonp”，通过回调函数处理不就好了，对，没有错，可以这样处理，但是过多的使用callback会使代码结构看起来混乱，层级太深，不便于后期维护。
3、方法中使用了Pormise对象后，Promise对象中的处理结果不能返回。