【Android/iOS/Backend】スマホアプリから開発中のAPIにSSLでアクセスする

はじめに

スマートフォンアプリからAPIにアクセスする場合、デフォルトではSSL（HTTPS）通信が必要です。
開発中のAPIがSSLに対応していない場合でも、アプリ側の設定で回避できることがありますが、本番環境に近い形で動作確認を行うには、SSLでのアクセスが望ましいこともあります。

開発中のAPI自体をSSL対応させるのが理想ですが、何らかの理由でそれが難しい場合には、リバースプロキシを活用してSSL対応のインターフェースを用意する方法があります。
ここでは、その方法についてまとめます。

動作環境

• macOS
• Rancher Desktop（Docker 環境）

手順

1. 証明書の作成

mkcertを使用して自己署名証明書を作成します。
mkcert はローカル開発用に簡単に信頼された証明書を発行できるツールです。

例）証明書作成コマンド

mkcert -install
mkcert localhost 127.0.0.1 ::1

2. フォルダ構成（例）

project-root/
├── docker-compose.yaml
└── nginx/
    ├── default.conf
    ├── certs/
    │   ├── localhost+2.pem
    │   └── localhost+2-key.pem
    └── root-certs/
        └── ...（必要に応じて）

3. Docker コンテナ構成

docker-compose.yaml

services:
  nginx:
    image: nginx:alpine
    ports:
      - "8090:8090"
    volumes:
      - ./nginx/default.conf:/etc/nginx/conf.d/default.conf:ro
      - ./nginx/certs:/etc/nginx/certs:ro
      - ./nginx/root-certs:/etc/nginx/root-certs:ro

nginx/default.conf

server {
    listen 8090 ssl;
    server_name localhost hostname.local;

    ssl_certificate     /etc/nginx/certs/localhost+2.pem;
    ssl_certificate_key /etc/nginx/certs/localhost+2-key.pem;

    location / {
        proxy_pass http://host.docker.internal:8080/;
    }
}

補足

• 上記構成では、Nginx が HTTPS（SSL）で受けたリクエストを、ローカルホスト上のHTTP（非SSL）APIサーバーにプロキシ転送します
• スマホアプリからは https://localhost:8090/ でアクセス可能になります
• macOS 環境で mkcert による証明書が信頼されていない場合、アプリやブラウザから接続エラーになることがあります。その場合は、作成されたルート証明書をキーチェーンアクセスから信頼する設定を行ってください

おわりに

開発中でも本番環境に近い形でAPIとの通信を検証できるようになると、本番環境でSSL起因の予期しない不具合の回避にも繋がります。
この方法はローカル開発環境での一時的な回避策ですが、スマートフォンアプリ開発では役に立つことも割とあると思います。