在用尽 Javascript 的当前可用选项范围后，我决定简单地在本机上实现证书固定，现在一切看起来都很简单，因为我已经完成了。
如果您不想通读获得解决方案的过程，请跳至标题为 Android 解决方案 和 IOS 解决方案 的标题。
安卓
在Kudo's recommendation 之后，我想到了使用 okhttp3 实现固定。
client = new OkHttpClient.Builder()
.certificatePinner(new CertificatePinner.Builder()
.add("publicobject.com", "sha1/DmxUShsZuNiqPQsX2Oi9uv2sCnw=")
.add("publicobject.com", "sha1/SXxoaOSEzPC6BgGmxAt/EAcsajw=")
.add("publicobject.com", "sha1/blhOM3W9V/bVQhsWAcLYwPU6n24=")
.add("publicobject.com", "sha1/T5x9IXmcrQ7YuQxXnxoCmeeQ84c=")
.build())
.build();
我首先学习了如何创建一个原生的android bridge with react native创建一个 toast 模块。然后我用一种发送简单请求的方法对其进行了扩展
@ReactMethod
public void showURL(String url, int duration) {
try {
Request request = new Request.Builder()
.url(url)
.build();
Response response = client.newCall(request).execute();
Toast.makeText(getReactApplicationContext(), response.body().string(), duration).show();
} catch (IOException e) {
Toast.makeText(getReactApplicationContext(), e.getMessage(), Toast.LENGTH_SHORT).show();
}
}
成功发送请求，然后我转向发送固定请求。
我在我的文件中使用了这些包
import com.facebook.react.bridge.NativeModule;
import com.facebook.react.bridge.ReactApplicationContext;
import com.facebook.react.bridge.ReactContext;
import com.facebook.react.bridge.ReactContextBaseJavaModule;
import com.facebook.react.bridge.ReactMethod;
import com.facebook.react.bridge.Callback;
import okhttp3.OkHttpClient;
import okhttp3.Request;
import okhttp3.Response;
import okhttp3.CertificatePinner;
import java.io.IOException;
import java.util.Map;
import java.util.HashMap;
Kudo 的方法并不清楚我将在哪里获得公钥或如何生成它们。幸运的是okhttp3 docs 除了提供如何使用 CertificatePinner 的清晰演示之外，还指出要获取公钥，我需要做的就是发送一个带有不正确 pin 的请求，并且正确的 pin 将出现在错误消息中。
在意识到 OkHttpClent.Builder() 可以被链接起来并且我可以在构建之前包含 CertificatePinner 之后，与 Kudo 提案中的误导性示例（可能是旧版本）不同，我想出了这个方法。
@ReactMethod
public void getKeyChainForHost(String hostname, Callback errorCallbackContainingCorrectKeys,
Callback successCallback) {
try {
CertificatePinner certificatePinner = new CertificatePinner.Builder()
.add(hostname, "sha256/AAAAAAAAAAAAAAAAAAAAAAAAAAA=")
.build();
OkHttpClient client = (new OkHttpClient.Builder()).certificatePinner(certificatePinner).build();
Request request = new Request.Builder()
.url("https://" + hostname)
.build();
Response response =client.newCall(request).execute();
successCallback.invoke(response.body().string());
} catch (Exception e) {
errorCallbackContainingCorrectKeys.invoke(e.getMessage());
}
}
然后替换我在错误中得到的公共钥匙串会返回页面的正文，表明我已经提出了成功的请求，我更改了密钥的一个字母以确保它可以正常工作并且我知道我在正轨上。
我的 ToastModule.java 文件中终于有了这个方法
@ReactMethod
public void getKeyChainForHost(String hostname, Callback errorCallbackContainingCorrectKeys,
Callback successCallback) {
try {
CertificatePinner certificatePinner = new CertificatePinner.Builder()
.add(hostname, "sha256/+Jg+cke8HLJNzDJB4qc1Aus14rNb6o+N3IrsZgZKXNQ=")
.add(hostname, "sha256/aR6DUqN8qK4HQGhBpcDLVnkRAvOHH1behpQUU1Xl7fE=")
.add(hostname, "sha256/HXXQgxueCIU5TTLHob/bPbwcKOKw6DkfsTWYHbxbqTY=")
.build();
OkHttpClient client = (new OkHttpClient.Builder()).certificatePinner(certificatePinner).build();
Request request = new Request.Builder()
.url("https://" + hostname)
.build();
Response response =client.newCall(request).execute();
successCallback.invoke(response.body().string());
} catch (Exception e) {
errorCallbackContainingCorrectKeys.invoke(e.getMessage());
}
}
Android 解决方案扩展 React Native 的 OkHttpClient
弄清楚如何发送固定的http请求很好，现在我可以使用我创建的方法，但理想情况下我认为最好扩展现有的客户端，以便立即获得实施的好处。
此解决方案自RN0.35 起有效，我不知道它将来会如何公平。
在研究为 RN 扩展 OkHttpClient 的方法时，我遇到了 this article，它解释了如何通过替换 SSLSocketFactory 添加 TLS 1.2 支持。
通过阅读，我了解到 react 使用 OkHttpClientProvider 来创建 XMLHttpRequest 对象使用的 OkHttpClient 实例，因此如果我们替换该实例，我们将对所有应用程序应用固定。
我在android/app/src/main/java/com/dreidev 文件夹中添加了一个名为OkHttpCertPin.java 的文件
package com.dreidev;
import android.util.Log;
import com.facebook.react.modules.network.OkHttpClientProvider;
import com.facebook.react.modules.network.ReactCookieJarContainer;
import java.util.concurrent.TimeUnit;
import okhttp3.OkHttpClient;
import okhttp3.Request;
import okhttp3.Response;
import okhttp3.CertificatePinner;
public class OkHttpCertPin {
private static String hostname = "*.efghermes.com";
private static final String TAG = "OkHttpCertPin";
public static OkHttpClient extend(OkHttpClient currentClient){
try {
CertificatePinner certificatePinner = new CertificatePinner.Builder()
.add(hostname, "sha256/+Jg+cke8HLJNzDJB4qc1Aus14rNb6o+N3IrsZgZKXNQ=")
.add(hostname, "sha256/aR6DUqN8qK4HQGhBpcDLVnkRAvOHH1behpQUU1Xl7fE=")
.add(hostname, "sha256/HXXQgxueCIU5TTLHob/bPbwcKOKw6DkfsTWYHbxbqTY=")
.build();
Log.d(TAG, "extending client");
return currentClient.newBuilder().certificatePinner(certificatePinner).build();
} catch (Exception e) {
Log.e(TAG, e.getMessage());
}
return currentClient;
}
}
这个包有一个方法extend，它接受一个现有的OkHttpClient并重新构建它，添加certificatePinner并返回新构建的实例。
然后我通过添加以下方法修改了 this answer's advice 之后的 MainActivity.java 文件
.
.
.
import com.facebook.react.ReactActivity;
import android.os.Bundle;
import com.dreidev.OkHttpCertPin;
import com.facebook.react.modules.network.OkHttpClientProvider;
import okhttp3.OkHttpClient;
public class MainActivity extends ReactActivity {
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
rebuildOkHtttp();
}
private void rebuildOkHtttp() {
OkHttpClient currentClient = OkHttpClientProvider.getOkHttpClient();
OkHttpClient replacementClient = OkHttpCertPin.extend(currentClient);
OkHttpClientProvider.replaceOkHttpClient(replacementClient);
}
.
.
.
执行此解决方案是为了完全重新实现 OkHttpClientProvider createClient 方法，在检查提供程序时我意识到 the master version 已经实现了 TLS 1.2 支持但还不是可供我使用的可用选项，因此找到了重建成为扩展客户的最佳方式。我想知道当我升级时这种方法如何公平，但现在它运作良好。
更新似乎从 0.43 开始这个技巧不再起作用了。由于时间限制，我现在将我的项目冻结在 0.42，直到重建停止工作的原因明确为止。
解决方案IOS
对于 IOS，我认为我需要遵循类似的方法，再次以 Kudo 的提议作为我的主导。
检查 RCTNetwork 模块后，我了解到使用了 NSURLConnection，因此我发现 TrustKit
按照我简单添加的入门指南
pod 'TrustKit'
到我的 podfile 并运行 pod install
GettingStartedGuide 解释了如何从我的 pList.file 配置这个 pod，但我更喜欢使用代码而不是配置文件，我在我的 AppDelegate.m 文件中添加了以下几行
.
.
.
#import <TrustKit/TrustKit.h>
.
.
.
@implementation AppDelegate
- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
{
// Initialize TrustKit
NSDictionary *trustKitConfig =
@{
// Auto-swizzle NSURLSession delegates to add pinning validation
kTSKSwizzleNetworkDelegates: @YES,
kTSKPinnedDomains: @{
// Pin invalid SPKI hashes to *.yahoo.com to demonstrate pinning failures
@"efghermes.com" : @{
kTSKEnforcePinning:@YES,
kTSKIncludeSubdomains:@YES,
kTSKPublicKeyAlgorithms : @[kTSKAlgorithmRsa2048],
// Wrong SPKI hashes to demonstrate pinning failure
kTSKPublicKeyHashes : @[
@"+Jg+cke8HLJNzDJB4qc1Aus14rNb6o+N3IrsZgZKXNQ=",
@"aR6DUqN8qK4HQGhBpcDLVnkRAvOHH1behpQUU1Xl7fE=",
@"HXXQgxueCIU5TTLHob/bPbwcKOKw6DkfsTWYHbxbqTY="
],
// Send reports for pinning failures
// Email info@datatheorem.com if you need a free dashboard to see your App's reports
kTSKReportUris: @[@"https://overmind.datatheorem.com/trustkit/report"]
},
}
};
[TrustKit initializeWithConfiguration:trustKitConfig];
.
.
.
我从我的 android 实现中获得了公钥哈希，并且它刚刚工作（我在我的 pod 中收到的 TrustKit 版本是 1.3.2）
我很高兴IOS变成了一口气
作为旁注，TrustKit 警告说，如果 NSURLSession 和 Connection 已经被 swizzled，它的 Auto-swizzle 将不起作用。也就是说，到目前为止它似乎运作良好。
结论
这个答案提供了适用于 Android 和 IOS 的解决方案，因为我能够在本机代码中实现它。
一个可能的改进可能是实现一个通用平台模块，其中设置公钥和配置 android 和 IOS 的网络提供程序都可以在 javascript 中进行管理。
Kudo's proposal 提到简单地将公钥添加到 js 包中可能会暴露一个漏洞，其中可以以某种方式替换包文件。
我不知道该攻击向量如何发挥作用，但可以肯定的是，按照提议对 bundle.js 进行签名的额外步骤可能会保护 js 包。
另一种方法可能是将 js 包简单地编码为 64 位字符串，并将其直接作为 mentioned in this issue's conversation 包含在本机代码中。这种方法的好处是混淆以及将 js 包硬连线到应用程序中，使攻击者无法访问它，或者我认为是这样。
如果您读到这里，我希望我对您修复错误的追求有所启发，并祝您享受阳光明媚的一天。