React Native에서 SSL 인증서 검증 우회하기 (Expo 포함)

2025. 1. 31. 18:00·MOBILE APP

React Native 또는 Expo를 사용하여 HTTPS 요청을 보낼 때, 자체 서명된 인증서나 만료된 인증서로 인해 요청이 실패할 수 있습니다. 대표적으로 아래와 같은 오류 메시지가 발생할 수 있습니다.

Error: The certificate for this server is invalid. You might be connecting to a server that is pretending to be "[서버 주소]" which could put your confidential information at risk.

또한, axios를 사용할 경우 Network Error가 발생할 수도 있습니다.

이 글에서는 SSL 인증서 검증을 우회해서 HTTPS 요청을 보내는 방법을 설명하겠습니다.

주의: 이 방법은 보안상 위험하므로 개발 환경에서만 사용할 것을 권장합니다. 프로덕션 환경에서 사용하면 앱 스토어 심사에서 거부될 가능성이 큽니다.


1. Expo 프로젝트인 경우 (React Native 프로젝트는 2번부터)

Expo 프로젝트에서는 먼저 Android 및 iOS 프로젝트 폴더를 생성해야 합니다.

npx expo prebuild

2. Android에서 SSL 인증서 검증 우회하기

Android에서 SSL 인증서 검증을 우회하려면 MainApplication.java 파일과 동일한 경로에 IgnoreSSLFactory.java 파일을 생성해야 합니다.

2.1. IgnoreSSLFactory.java 파일 생성

아래 코드를 복사하고, 첫 줄의 패키지명을 앱의 패키지명으로 변경해주세요.

package com.yourapp; // 패키지명을 수정하세요

import com.facebook.react.modules.network.OkHttpClientFactory;
import com.facebook.react.modules.network.OkHttpClientProvider;
import com.facebook.react.modules.network.ReactCookieJarContainer;
import java.security.cert.CertificateException;
import java.util.concurrent.TimeUnit;
import javax.net.ssl.HostnameVerifier;
import javax.net.ssl.SSLContext;
import javax.net.ssl.SSLSession;
import javax.net.ssl.SSLSocketFactory;
import javax.net.ssl.TrustManager;
import javax.net.ssl.X509TrustManager;
import okhttp3.OkHttpClient;

public class IgnoreSSLFactory implements OkHttpClientFactory {
    @Override
    public OkHttpClient createNewNetworkModuleClient() {
        try {
            final TrustManager[] trustAllCerts = new TrustManager[]{
                new X509TrustManager() {
                    @Override
                    public void checkClientTrusted(java.security.cert.X509Certificate[] chain, String authType) throws CertificateException {}
                    @Override
                    public void checkServerTrusted(java.security.cert.X509Certificate[] chain, String authType) throws CertificateException {}
                    @Override
                    public java.security.cert.X509Certificate[] getAcceptedIssuers() {
                        return new java.security.cert.X509Certificate[]{};
                    }
                }
            };

            SSLContext sslContext = SSLContext.getInstance("SSL");
            sslContext.init(null, trustAllCerts, new java.security.SecureRandom());
            SSLSocketFactory sslSocketFactory = sslContext.getSocketFactory();

            OkHttpClient.Builder builder = new OkHttpClient.Builder()
                .connectTimeout(0, TimeUnit.MILLISECONDS)
                .readTimeout(0, TimeUnit.MILLISECONDS)
                .writeTimeout(0, TimeUnit.MILLISECONDS)
                .cookieJar(new ReactCookieJarContainer());

            builder.sslSocketFactory(sslSocketFactory, (X509TrustManager) trustAllCerts[0]);
            builder.hostnameVerifier((hostname, session) -> true);

            return builder.build();
        } catch (Exception e) {
            throw new RuntimeException(e);
        }
    }
}

2.2. MainApplication.java 파일 수정

import문을 추가하고, onCreate 메서드 내에 OkHttpClientProvider.setOkHttpClientFactory(new IgnoreSSLFactory());를 추가합니다.

import com.facebook.react.modules.network.OkHttpClientProvider; // 추가

@Override
public void onCreate() {
  super.onCreate();
  SoLoader.init(this, /* native exopackage */ false);
  OkHttpClientProvider.setOkHttpClientFactory(new IgnoreSSLFactory()); // 추가
  initializeFlipper(this, getReactNativeHost().getReactInstanceManager());
}

2.3. 코틀린 프로젝트인 경우 MainApplication.kt 파일 수정

import com.facebook.react.modules.network.OkHttpClientProvider // 추가

override fun onCreate() {
  super.onCreate()
  SoLoader.init(this, false)
  OkHttpClientProvider.setOkHttpClientFactory(IgnoreSSLFactory()) // 추가
  ApplicationLifecycleDispatcher.onApplicationCreate(this)
}

3. iOS에서 SSL 인증서 검증 우회하기

iOS에서 SSL 인증서 검증을 우회하려면 Info.plist 파일에 아래 내용을 추가하세요.

<key>NSAppTransportSecurity</key>
<dict>
  <key>NSAllowsArbitraryLoads</key>
  <true/>
</dict>

그다음, Xcode에서 프로젝트를 열고 RCTHTTPRequestHandler.m 파일을 수정해야 합니다.

파일 위치: Pods/Development Pods/React-RCTNetwork

3.1. NSURLSession 델리게이트 함수 추가

아래 함수를 #pragma mark - NSURLSession delegate 주석 아래에 추가하세요.

#pragma mark - NSURLSession delegate

- (void)URLSession:(NSURLSession *)session didReceiveChallenge:(NSURLAuthenticationChallenge *)challenge completionHandler:(void (^)(NSURLSessionAuthChallengeDisposition disposition, NSURLCredential *credential))completionHandler
{
  completionHandler(NSURLSessionAuthChallengeUseCredential, [NSURLCredential credentialForTrust:challenge.protectionSpace.serverTrust]);
}

참고 자료

  • How to Ignore SSL for React Native (Android/iOS)
  • Stack Overflow 답변 (iOS 해결 방법 참고)

위 방법으로 해결되지 않거나 궁금한 점이 있다면 댓글로 남겨주세요!

반응형

'MOBILE APP' 카테고리의 다른 글

React Native WebView에서 네이티브와 데이터 주고받기  (1) 2025.03.18
React Native BLE에서 MTU 설정으로 데이터 전송량 늘리기 (Android)  (1) 2025.02.14
React Native에서 로컬 서버에 접속하기 (Expo 포함)  (0) 2025.01.24
Expo에서 pod install 오류: "cannot load such file -- ./scripts/autolinking" 해결 방법  (0) 2025.01.23
'MOBILE APP' 카테고리의 다른 글
  • React Native WebView에서 네이티브와 데이터 주고받기
  • React Native BLE에서 MTU 설정으로 데이터 전송량 늘리기 (Android)
  • React Native에서 로컬 서버에 접속하기 (Expo 포함)
  • Expo에서 pod install 오류: "cannot load such file -- ./scripts/autolinking" 해결 방법
shinejung
shinejung
저의 블로그에 오신것을 환영합니다. 프론트엔드 개발을 많이 다룹니다.
  • shinejung
    shine.log
    shinejung
  • 전체
    오늘
    어제
    • 전체 글 (7)
      • FRONTEND (0)
      • BACKEND (0)
      • MOBILE APP (5)
      • 프로젝트 (1)
      • 후기 (1)
      • 회고 (0)
      • 기타 (0)
  • 블로그 메뉴

    • 방명록
    • 태그
  • 링크

    • 홈페이지
    • 깃허브
    • 링크드인
  • 인기 글

  • 태그

    WWDC
    보드게임
    expo
    https
    프로젝트
    ios
    ble
    apple
    webview
    bluetooth
    오류 해결
    스위프트 스튜던트 챌린지
    React Native
    오목
    AR
    SWIFT
    Android
    swift student challenge
    양자역학
  • 최근 댓글

  • 최근 글

  • 반응형
  • hELLO· Designed By정상우.v4.10.3
shinejung
React Native에서 SSL 인증서 검증 우회하기 (Expo 포함)
상단으로

티스토리툴바