I am developing a mobile application and the application uses 2 API keys one for production and another for debugging, since we use plugins it is a pain to change the api keys everytime I run ionic cordova run android/ios, I figured out setting the API key in index.html dynamically with the below code:
<script>
console.log("Api key in onLoad function", API_KEY)
function loadScript(){
console.log("loadScript being called with api key", API_KEY)
var script = document.createElement('script');
script.type = 'text/javascript';
script.src = 'https://maps.googleapis.com/maps/api/js?v=3.exp&key='+API_KEY+'&libraries=places' //&
needed
document.body.appendChild(script);
}
window.onload = loadScript;
</script>
<meta-data
android:name="com.google.android.geo.API_KEY"
android:value="${API_KEY}"/>
And this works fine, I call another script with a post method and fetch the api key from server and set it to API_KEY, but how do I set the same key in config.xml and in package.json where plugins along with there API keys are declared.
config.xml
<preference name="GOOGLE_API_KEY_FOR_ANDROID" value="google api key" />
<preference name="GOOGLE_MAPS_ANDROID_API_KEY" value="google api key" />
<preference name="GOOGLE_MAPS_IOS_API_KEY" value="google api key" />
package.json
"uk.co.workingedge.phonegap.plugin.launchnavigator": {
"GOOGLE_API_KEY_FOR_ANDROID": "google api key",
"OKHTTP_VERSION": "3.12.0"
}