Search code examples
ssllocalhostdevicemamp-procharles-proxy

Access local dev environment on a device and Charles Proxy and SSL?

I need to access my local dev environment (MAMP Pro) on a device. I've got this working fine for my non-SSL site but I cant get it working for my site that requires SSL.

Both my local dev machine and my device are on the same wifi network. In the wifi settings on the device I've set the HTTP proxy to manual, the server is my dev environment IP and the port is the default 8888 (although it still works if I change this to 8080).

I've already set up a virtual host entry for local.site1.com in MAMP Pro. That url now works on both my local dev environment and the device.

If I try to go to my SSL site at https://local.site2.com this works on the dev environment but device gives this message:

Safari cannot open the page.

The error was: "There was a problem communicating with the secure web proxy server (HTTPS).".

Charles Proxy seems to be the standard way to access a local development environment on a device using the domain name specified in the hosts file, however I'm happy to use any solution that works.

Solution

  • Surely OSX/iOS doesn't like the cert you inject because it doesn't come from a "trusted" source and it just straight up kills the connection.

    You can define your cert as coming from a trusted source with Apple Configurator.

    source

    edit

    1. Open the Apple Configurator app and create a new config file (prepare).
    2. On the installation tab disable the "Update iOS" since we don't want to go all that. We just want to inject the cert.
    3. You then go into the "Installation" tab and under "Settings" you select the certificate. (Since we can't include a .pem file in this mobileconf we have to convert our root cert into a .cert file and since it already is in the keychain app just go and export it as an .cert file somewhere where you can easily find it.
    4. Back in the Apple Configurator app you select the just exported .cert root certificate and push the mobileconfig onto your phone/device via USB cable. (You will be prompted to accept that this is being installed since it is an "untrusted" root cert and afterwards you go through the steps explained by the creator here in order to install the .pem certificate onto the device.
    5. Once there you can setup the proxy just like you would do for a http proxy in the networking settings and see all the TLS encrypted traffic flow in on iOS 8