从两个HTTP端点获取并合并数据的最佳实践与高效方案

嘿，这个场景我之前做移动端列表展示的时候刚好碰到过，来给你唠唠怎么处理～

其实不是必须，但新建一个组合模型会让你的代码逻辑更清晰，具体分两种情况：

• 如果只需要userImage这一个用户相关字段：可以直接扩展现有的Post模型，新增一个userImage属性，这样不需要额外创建新类，代码更轻量。
• 如果后续可能用到用户的其他信息（比如用户名、邮箱）：建议新建PostWithUser模型，让它包含Post实例和User实例（或者只包含需要的用户字段），这样后续扩展功能时不用频繁修改Post类，扩展性更好。

举个简单的Kotlin例子：

// 组合模型示例
data class PostWithUser(
    val post: Post,
    val userImage: String // 或者直接传入User实例：val user: User
)

因为posts和users两个接口没有依赖关系（posts里的userId对应users的id），并行发起两个请求是最高效的方式，比串行请求节省近一半的时间。具体步骤如下：

1. 同时发起获取posts和users的请求，等待两者都返回结果；
2. 将users列表转换成以id为key的Map（比如Map<Int, User>），这样可以O(1)时间根据userId找到对应的用户，避免嵌套循环遍历（嵌套循环是O(n*m)复杂度，用Map是O(n+m)）；
3. 遍历posts列表，结合Map中的用户数据，生成包含title、body、userImage的列表，最后传给ListView展示。

举个JavaScript的实现例子： #

// 并行发起两个请求
Promise.all([
  fetch('/posts').then(res => res.json()),
  fetch('/users').then(res => res.json())
]).then(([posts, users]) => {
  // 把users转成id映射的对象，快速查找
  const userMap = users.reduce((acc, user) => {
    acc[user.id] = user;
    return acc;
  }, {});

  // 合并生成需要的列表数据
  const postsWithUserInfo = posts.map(post => ({
    title: post.title,
    body: post.body,
    userImage: userMap[post.userId].userImage // 假设user对象里有userImage字段
  }));

  // 渲染到ListView
  renderListView(postsWithUserInfo);
});

再给个Android Kotlin+Retrofit的例子： #

// 先定义Retrofit接口
interface JsonPlaceholderApi {
    @GET("posts")
    suspend fun getPosts(): List<Post>

    @GET("users")
    suspend fun getUsers(): List<User>
}

// 在ViewModel里处理请求合并
class PostListViewModel(private val api: JsonPlaceholderApi) : ViewModel() {
    private val _postsWithUser = MutableLiveData<List<PostWithUser>>()
    val postsWithUser: LiveData<List<PostWithUser>> = _postsWithUser

    fun fetchPostsWithUser() {
        viewModelScope.launch {
            // 并行执行两个请求
            val postsDeferred = async { api.getPosts() }
            val usersDeferred = async { api.getUsers() }

            val posts = postsDeferred.await()
            val users = usersDeferred.await()

            // 转成Map加速查找
            val userMap = users.associateBy { it.id }

            // 合并数据
            val combinedList = posts.map { post ->
                PostWithUser(
                    post = post,
                    userImage = userMap[post.userId]?.userImage ?: ""
                )
            }

            // 更新UI数据
            _postsWithUser.postValue(combinedList)
        }
    }
}

这样处理下来，不仅请求效率高，代码逻辑也清晰，后续维护起来也方便～

内容的提问来源于stack exchange，提问作者Adnan Alshami