How to Add Network_Security_Config.Xml to Manifest in Expo App Without Ejecting

How to add security layers to Expo EAS build?

Take a look at how Expo prebuild works.

tldr: Generally, when you call expo prebuild, Expo would create native folders for you, and that is what they do on EAS infra transparently for managed projects.

Auto-linking:

Additionally, they would also run auto-linking of RN packages that have proper specs for that. Therefore when you see a RN package that has installation instructions like the following, then it would just work out of the box on EAS without the need to link anything, just install an NPM package, and Expo would link it for you.

npm i jail-monkey --save
react-native link # Not required as of React Native 0.60.0

Additional configuration:

The majority of the configuration comes from the Expo Config, but when you bump into smth that is not yet supported (let's say SSL pinning), then Expo provides config-plugins to let you modify the artifacts of native folders or projects. That enables you to just follow the standard docs (let's say network security configuration) and just apply any changes to things like AndroidManifest through with withAndroidManifest plugins. You can basically do whatever you want to do at this point and integrate anything from the native world. The same applies to some extra build settings like proguard for obfuscation and so on, they are currently available through some standard plugins like BuildProperties.

You can see an example of a custom plugin for network security configuration here.

React-native fetch() from https server with self-signed certificate

Disclaimer: This solution should be temporary and documented so that it won't stay in the production phase of the software, this is for development only.

For iOS, all you have to do is, open your xcodeproject (inside your iOS folder in RN) once you have that open, go to RCTNetwork.xcodeproj and in that project, navigate to RCTHTTPRequestHandler.m

In that file you will see a line like this:

#pragma mark - NSURLSession delegate

right after that line, add this function

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

And voila, you can now make insecure calls to your API without a valid certificate.

That should be enough, but if you are still having problems, you might need to go to your project's info.plist, left click on it and choose open as... source code.

and at the end just add

<key>NSAppTransportSecurity</key>
  <dict>
    <key>NSAllowsArbitraryLoads</key>
    <true/>
  </dict>
  <key>NSExceptionDomains</key>
    <dict>
        <key>localhost</key>
        <dict>
            <key>NSExceptionAllowsInsecureHTTPLoads</key>
            <true/>
        </dict>
        <key>subdomain.example.com</key>
        <dict>
            <key>NSIncludesSubdomains</key>
            <true/>
            <key>NSExceptionAllowsInsecureHTTPLoads</key>
            <true/>
        </dict>
    </dict>

so your file will look like this

    ...
    <key>UISupportedInterfaceOrientations</key>
    <array>
        <string>UIInterfaceOrientationPortrait</string>
        <string>UIInterfaceOrientationLandscapeLeft</string>
        <string>UIInterfaceOrientationLandscapeRight</string>
    </array>
    <key>UIViewControllerBasedStatusBarAppearance</key>
    <false/>
    <key>NSLocationWhenInUseUsageDescription</key>
    <string></string>
  <key>NSAppTransportSecurity</key>
  <dict>
    <key>NSAllowsArbitraryLoads</key>
    <true/>
  </dict>
  <key>NSExceptionDomains</key>
    <dict>
        <key>localhost</key>
        <dict>
            <key>NSExceptionAllowsInsecureHTTPLoads</key>
            <true/>
        </dict>
        <key>subdomain.example.com</key>
        <dict>
            <key>NSIncludesSubdomains</key>
            <true/>
            <key>NSExceptionAllowsInsecureHTTPLoads</key>
            <true/>
        </dict>
    </dict>
</dict>
</plist>

For a real production ready solution, https://stackoverflow.com/a/36368360/5943130 that solution is better

no resource found that matches the given name

Did you check to ensure that you have the string resource defined in res/values/strings.xml?

<string name="app_name">"My App"</string>

Sometimes, I've noticed eclipse will also throw errors that are hard to track if you have any .xml files with errors. I don't think the parser recovers well and sometimes the errors you get can be misleading.

---

Related Topics