Angular中发起HTTP请求的最优方式是什么？如何规避内存泄漏？

避免直接使用subscribe的原因 #

用subscribe发起HTTP请求存在明显隐患：尽管请求成功时会自动取消订阅，但当请求失败时，观察者会保持订阅状态，可能导致内存泄漏，无法优雅处理错误场景。

以下是subscribe的使用示例：

subscribe({
    next: (v) => console.log(v),
    error: (e) => console.error(e),
    complete: () => console.info('complete') // 仅在API请求成功时触发
})

推荐使用firstValueFrom和lastValueFrom #

RxJS的firstValueFrom和lastValueFrom方法能将Observable转换为Promise，为成功、错误等所有场景提供可靠的处理机制。

下面是lastValueFrom的内部工作逻辑示例，能看到它在错误发生时会正确拒绝Promise，确保错误被妥善处理：

source.subscribe({
    next: (value) => {
        _value = value;
        _hasValue = true;
    },
    error: reject,
    complete: () => {
        if (_hasValue) {
            resolve(_value);
        } else if (hasConfig) {
            resolve(config!.defaultValue);
        } else {
            reject(new EmptyError());
        }
    },
});

综上，使用RxJS处理HTTP请求时，建议优先选用firstValueFrom和lastValueFrom，它们能更精准地控制并处理请求的成功与错误场景。

内容的提问来源于stack exchange，提问作者saurabh tiwari