为什么在较新的 Android 设备上预检失败，但在较旧的设备和台式机上却没有？答案

【问题标题】：Why does preflight fail on newer Android devices but not older devices and desktop?为什么在较新的 Android 设备上预检失败，但在较旧的设备和台式机上却没有？
【发布时间】：2022-01-02 02:23:27
【问题描述】：

我正在使用 axios 包将 API 请求从我的应用程序发送到我的后端
后端使用 Laravel 构建，是一个简单的 REST API
如果我使用 ionic serve 在桌面上运行 Ionic 应用程序，它可以正常工作
如果我构建 APK 并安装应用程序：
- 在版本 8 或更低版本的 Android 设备上运行良好
- 在具有版本 9 或更高版本的 Android 设备上，预检检查始终失败

（这是使用 Chrome 的远程设备功能来检查来自应用程序的请求）

最初，请求甚至不会发送，并且在那之前它会出错，所以我为 Android 设置了我的网络安全配置，并删除了初始错误，但现在它在预检时一直失败
我怀疑这可能与应用程序上的请求是从http://localhost 发送的事实有关，但我不确定如何解决这个问题。你能强制它使用 SSL 吗？如果有，怎么做？
我的 Laravel CORS 设置比 Laravel 附带的默认 CORS 配置更宽松：

return [
    'paths' => ['*'],
    'allowed_methods' => ['*'],
    'allowed_origins' => ['*'],
    'allowed_origins_patterns' => [],
    'allowed_headers' => ['*'],
    'exposed_headers' => [],
    'max_age' => 0,
    'supports_credentials' => false,
];

【问题讨论】：

标签： android laravel ionic-framework axios capacitor

【解决方案1】：

该问题与 axios 未按照 this comment 处理的 SSL/TLS 固定有关。

The Ionic Native HTTP plugin 本地处理固定，这很有效，但它当然使用了 Cordova，而这在您的非移动设备上不可用。

有两种可能的解决方案：

本地实现 SSL/TLS 固定
创建一个服务/工厂来确定我们是要使用 axios 还是使用原生插件

我选择了#2 - 如果您想了解有关#1、see this answer 的信息。

以下方法对我来说决定使用哪个 HTTP 包装器：

static makeRequest() {
    return isPlatform('cordova') ? cordovaHttpService : axiosHttpService;
}

当然，可以根据具体情况进行修改。

【讨论】：