让接口有序请求，UI一次刷新！多接口请求设计指南

2023-09-10 21:17:46

序言

在现代Web开发中，通常需要发起多个网络请求来获取数据并更新UI。例如，在一个电商网站上，用户可能会同时请求商品列表、购物车的商品数量和用户的个人资料。为了确保UI的一致性和响应性，至关重要的是要以特定的顺序执行这些请求，并仅在所有请求都成功后才更新UI。

传统方法的局限性

传统上，多接口请求可以通过使用GCD的栅栏函数 dispatch_barrier_async 来实现。然而，当使用第三方网络请求库（例如 AFN）时，这种方法不再有效，因为这些库本身就是异步的。因此，需要探索其他方法来实现接口的顺序请求。

顺序请求的实现

要实现顺序请求，可以采用以下步骤：

创建请求队列： 创建一个串行队列，该队列将用于执行请求。
将请求添加到队列： 将需要执行的请求添加到队列中。
监听请求完成： 在每个请求中添加一个完成处理程序，并在请求完成后执行以下操作：
- 检查所有请求是否都已完成。
- 如果所有请求都已完成，则更新UI。

代码示例

以下代码示例演示了如何使用顺序请求来更新UI：

let queue = DispatchQueue(label: "requestQueue", qos: .userInitiated, attributes: .concurrent)

let request1 = URLRequest(url: URL(string: "https://example.com/api/v1/products")!)
let request2 = URLRequest(url: URL(string: "https://example.com/api/v1/cart")!)
let request3 = URLRequest(url: URL(string: "https://example.com/api/v1/user")!)

var allRequestsCompleted = false

queue.async {
    let group = DispatchGroup()
    
    group.enter()
    URLSession.shared.dataTask(with: request1) { data, response, error in
        // Handle request 1 completion
        group.leave()
    }.resume()
    
    group.enter()
    URLSession.shared.dataTask(with: request2) { data, response, error in
        // Handle request 2 completion
        group.leave()
    }.resume()
    
    group.enter()
    URLSession.shared.dataTask(with: request3) { data, response, error in
        // Handle request 3 completion
        group.leave()
    }.resume()
    
    group.notify(queue: queue) {
        allRequestsCompleted = true
    }
}

if allRequestsCompleted {
    // Update UI
}