Capacitor HTTP request cancellation and timeout configuration

Answer to the question

Capacitor HTTP does not expose a stable cancel API that accepts a request ID. The plugin’s request methods return a Promise; there is no cancel or requestId property that can be used to abort a pending native task from JavaScript.

Timeout configuration

The only timeout knobs available in the current Capacitor HTTP plugin are connectTimeout and readTimeout. connectTimeout limits the time spent establishing the TCP connection; readTimeout limits the time the socket can sit idle while data is being transferred. These values are applied per request and are the only way to bound the amount of native work that will be performed.

Why Promise.race is insufficient

Using Promise.race with a JavaScript timer only rejects the promise that you await. The underlying native HTTP call keeps running on the device and may finish after the user has navigated away, consuming bandwidth and battery. It does not free the native socket or cancel the network operation.

Practical approach for this case

1. Set connectTimeout and readTimeout values that match the expected network conditions. For large payloads increase readTimeout; for slow networks increase connectTimeout.
2. If a hard cancellation is required (e.g., when a component unmounts), switch that request to the WebView fetch API and use AbortController, or implement a small native plugin that keeps a reference to the native request and exposes a cancel(id) method.
3. Use a “mounted” flag inside the component to avoid updating state after unmount, but note that this does not stop the native request itself.

Missing diagnostic detail

Does the endpoint you are calling need the Capacitor HTTP plugin to bypass CORS, or can you use a standard fetch call with proper CORS headers? The answer to that question determines whether you must rely on native timeouts or can use AbortController for true cancellation.