HTTPSに対応したAlibaba CloudのAPI GatewayがAndroidでNetwork request failedする問題
API GatewayをHTTPS化したらreact-nativeのAndroidアプリからfetchできなくなってしまいました。
HTTPへのリクエストは成功するのですがHTTPSへのリクエストを送ると以下のエラーが出てしまいます。
TypeError: Network request failed at XMLHttpRequest.xhr.onerror (blob:http://localhost:8081/2cf03b53-c0b2-404c-8dda-906f61a7d7ee:27276:18) at XMLHttpRequest.dispatchEvent (blob:http://localhost:8081/2cf03b53-c0b2-404c-8dda-906f61a7d7ee:29368:27) at XMLHttpRequest.setReadyState (blob:http://localhost:8081/2cf03b53-c0b2-404c-8dda-906f61a7d7ee:29121:20) at XMLHttpRequest.__didCompleteResponse (blob:http://localhost:8081/2cf03b53-c0b2-404c-8dda-906f61a7d7ee:28948:16) at blob:http://localhost:8081/2cf03b53-c0b2-404c-8dda-906f61a7d7ee:29058:47 at RCTDeviceEventEmitter.emit (blob:http://localhost:8081/2cf03b53-c0b2-404c-8dda-906f61a7d7ee:3707:37) at MessageQueue.__callFunction (blob:http://localhost:8081/2cf03b53-c0b2-404c-8dda-906f61a7d7ee:2593:44) at blob:http://localhost:8081/2cf03b53-c0b2-404c-8dda-906f61a7d7ee:2370:17 at MessageQueue.__guard (blob:http://localhost:8081/2cf03b53-c0b2-404c-8dda-906f61a7d7ee:2546:13) at MessageQueue.callFunctionReturnFlushedQueue (blob:http://localhost:8081/2cf03b53-c0b2-404c-8dda-906f61a7d7ee:2369:14)
ドキュメントやissueやらを読み漁って悩んでいると、以下のコメントを見つけました。どうやら証明書が間違っている時にもこのエラーが出るそうです。
解決法
中間CA証明書とクロスルート証明書を追加したら解決しました。
さくらのRapidSSLだとこの2つの証明書はここにあって、それぞれコピペします。
そしてAPI GatewayのSSL証明書を追加するテキストエリアに以下のように証明書を3つまとめて入力します。
-----BEGIN CERTIFICATE----- SSL証明書 -----END CERTIFICATE----- -----BEGIN CERTIFICATE----- 中間CA証明証 -----END CERTIFICATE----- -----BEGIN CERTIFICATE----- クロスルート証明書 -----END CERTIFICATE-----
これで私は通信できるようになりました。