CapacitorHttp
Capacitor Http API 通过修补 fetch 和 XMLHttpRequest 以使用原生库来提供原生 http 支持。它还提供了在不使用 fetch 和 XMLHttpRequest 的情况下进行原生 http 请求的辅助方法。此插件随 @capacitor/core 一起提供。
配置
默认情况下,对 window.fetch 和 XMLHttpRequest 的修补以使用原生库是禁用的。
如果你希望启用此功能,请在 capacitor.config 文件中修改以下配置。
| 属性 | 类型 | 描述 | 默认值 |
|---|---|---|---|
enabled | boolean | 启用对 fetch 和 XMLHttpRequest 的修补以使用原生库。 | false |
配置示例
在 capacitor.config.json 中:
{
"plugins": {
"CapacitorHttp": {
"enabled": true
}
}
}
在 capacitor.config.ts 中:
import { CapacitorConfig } from '@capacitor/cli';
const config: CapacitorConfig = {
plugins: {
CapacitorHttp: {
enabled: true,
},
},
};
export default config;
示例
import { CapacitorHttp } from '@capacitor/core';
// GET 请求示例
const doGet = () => {
const options = {
url: 'https://example.com/my/api',
headers: { 'X-Fake-Header': 'Fake-Value' },
params: { size: 'XL' },
};
const response: HttpResponse = await CapacitorHttp.get(options);
// 或者...
// const response = await CapacitorHttp.request({ ...options, method: 'GET' })
};
// POST 请求示例。注意:data
// 可以作为原始 JS 对象传递(必须是 JSON 可序列化的)
const doPost = () => {
const options = {
url: 'https://example.com/my/api',
headers: { 'X-Fake-Header': 'Fake-Value' },
data: { foo: 'bar' },
};
const response: HttpResponse = await CapacitorHttp.post(options);
// 或者...
// const response = await CapacitorHttp.request({ ...options, method: 'POST' })
};
大文件支持
由于桥接机制的特性,从原生端解析和传输大量数据到 Web 可能会导致问题。已向 @capacitor/file-transfer 插件添加了文件下载和上传的支持。在许多情况下,你可能还需要 @capacitor/filesystem 来生成有效的 文件 URI。
API
****** HTTP 插件 *******
request(...)
request(options: HttpOptions) => Promise<HttpResponse>
使用原生库向服务器发起 Http 请求。
| 参数 | 类型 |
|---|---|
options | |
返回:
Promise<HttpResponse>
get(...)
get(options: HttpOptions) => Promise<HttpResponse>
使用原生库向服务器发起 Http GET 请求。
| 参数 | 类型 |
|---|---|
options | |
返回:
Promise<HttpResponse>
post(...)
post(options: HttpOptions) => Promise<HttpResponse>
使用原生库向服务器发起 Http POST 请求。
| 参数 | 类型 |
|---|---|
options | |
返回:
Promise<HttpResponse>
put(...)
put(options: HttpOptions) => Promise<HttpResponse>
使用原生库向服务器发起 Http PUT 请求。
| 参数 | 类型 |
|---|---|
options | |
返回:
Promise<HttpResponse>
patch(...)
patch(options: HttpOptions) => Promise<HttpResponse>
使用原生库向服务器发起 Http PATCH 请求。
| 参数 | 类型 |
|---|---|
options | |
返回:
Promise<HttpResponse>