Changing ATS settings causes my app to hang - Metro builds but app doesn't start

Question

I'm building a react-native app for iOS and my backend API doesn't currently have SSL configured so I need to add an exception to ATS.

Before I change anything in info.plist, the app loads but any API calls don't work because they are blocked. When I do edit the info.plist to add my domain as an exception, like below, the app builds but then it doesn't run on the simulator. All i get is a white screen: I have screen shots below of what happens before and after i change my settings. Not sure what the problem is. Any ideas?

.

<key>NSAppTransportSecurity</key>
    <dict>
        <key>NSExceptionDomains</key>
        <dict>
            <key>mysite.com</key>
            <dict>
          <!--Include to allow subdomains-->
          <key>NSIncludesSubdomains</key>
          <true/>
          <!--Include to allow HTTP requests-->
          <key>NSTemporaryExceptionAllowsInsecureHTTPLoads</key>
          <true/>
          <!--Include to specify minimum TLS version-->
          <key>NSTemporaryExceptionMinimumTLSVersion</key>
          <string>TLSv1.1</string>
        </dict>
        </dict>
    </dict>

Answer 1

Try this format:

key>NSAppTransportSecurity</key>
    <dict>
        <key>NSExceptionDomains</key>
        <dict>
            <key>yourdomain.com</key>
            <dict>
                <key>NSExceptionAllowsInsecureHTTPLoads</key>
                <true/>
                <key>NSIncludesSubdomains</key>
                <true/>
            </dict>
        </dict>
    </dict>