The Problem:
After pushing my Android app built with React-Native and Expo, HereHere, to the Google Play Store recently, the app froze when accessing a page that uses the Google Maps and Google Places API. After looking at the logs, I noticed an error message indicating a missing API Key in the Android Manifest. The error stated that android.config.googleMaps.apiKey is missing.
The Solution:
It turns out that after upgrading my app to use the latest version of the Expo SDK, there is a required config variable for the Google Maps API that needs to be set in your app.json file.
*NOTE: My project was built using Expo’s managed workflow. If you built your project without Expo, you may need to look at updating your AndroidManifest.xml file instead and making sure the API key is set there.
{
"expo": {
// other props...,
"android": {
...,
"config": {
"googleMaps": {
"apiKey": "[your api key here]"
}
},
"package": "...",
"permissions": [...]
},
"sdkVersion": "38.0.0"
}
}
The tricky thing about this was that the app worked fine in development and the problem only arose after I pushed to the Google Play Store and downloaded the app to my phone. The reason was that my app was using a local config file to get the API key, and the production build looks for the value in app.json to inject into the Android Manifest file.