React Native使用客户端证书发起HTTP请求调用REST API的实现示例问询

React Native 内置的fetch、XMLHttpRequest默认不支持客户端证书绑定，可通过以下方案实现需求：

方案一：使用第三方库react-native-ssl-pinning实现（推荐） #

该库已封装好双端的客户端证书加载逻辑，适配大部分使用场景：

第一步：安装依赖 #

npm install react-native-ssl-pinning --save
# 或用yarn
yarn add react-native-ssl-pinning

React Native 0.60+版本会自动执行link操作，低于0.60版本需手动执行react-native link react-native-ssl-pinning。

第二步：证书放置 #

• iOS端：将p12格式客户端证书放入iOS项目的Resources目录，添加时勾选「Copy items if needed」和对应的APP target
• 安卓端：将p12格式客户端证书放入安卓项目的android/app/src/main/assets目录
• 如果证书存储在文件系统而非APP安装包内，可跳过此步，后续直接传入证书绝对路径即可

第三步：请求调用示例 #

import { fetch } from 'react-native-ssl-pinning';

fetch('https://你的服务端接口地址', {
  method: 'POST',
  // 证书相关配置
  sslPinning: {
    // 填证书文件名，不带后缀
    certs: ['client'],
    clientCert: {
      // 证书文件名带后缀，打包入包的证书iOS对应Resources下路径，安卓对应assets下路径；文件系统存储的证书直接传绝对路径
      path: 'client.p12',
      // 证书密码，建议从加密存储中动态读取，不要硬编码
      password: '你的证书密码',
    },
  },
  headers: {
    'Content-Type': 'application/json',
  },
  body: JSON.stringify({
    // 你的请求参数
  })
})
.then(res => res.json())
.then(resData => {
  // 处理返回结果
})
.catch(err => {
  // 处理请求异常
})

安卓端动态读取外部存储中的证书时，需要先申请存储读取权限。

方案二：自定义原生模块实现 #

如果需要更灵活的证书加载逻辑，可自行封装原生请求模块：

• iOS端：使用NSURLSession构建请求，配置NSURLSessionConfiguration时加载目标路径的p12证书生成URLCredential注入请求
• 安卓端：使用OkHttp构建请求客户端，从目标路径读取p12证书存入KeyStore，生成SSLSocketFactory配置到OkHttp客户端
• 双端封装好请求方法后通过React Native桥接暴露给JS层调用

注意事项 #

• 优先使用p12格式的客户端证书，需包含完整的证书链、公钥和私钥
• 证书密码禁止硬编码在代码中，建议配合加密存储库（如react-native-keychain）存储密码，运行时动态读取
• 服务端需提前配置客户端证书校验逻辑，确保证书链可被正常识别

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