I wanted to create the iOS and Windows Phone versions of Xtegos using Phonegap, and the main problem I had was sharing audio files on Whatsapp.
There is a fantastic Cordova plugin called Social Sharing, developed by Eddy Verbruggen (thanks for your help), which makes things much easier, but it does not explain how to share audio files. This is how I did it on Javascript:
The function below assumes that your file is in a remote server. If this is not the case, the code is much simpler and you can remove all the XMLHttpRequest code.
function shareAudio() {
var endpoint = 'http://www.example.com/yourFile.mp3;
var client = new XMLHttpRequest();
client.open('GET', endpoint, true); // Async call
// Need to change the MimeType for this kind of binary content
client.overrideMimeType("text/plain; charset=x-user-defined");
client.onreadystatechange = function() {
// When the progress is level 4 (ready) and the status is 200
if (client.readyState == 4 && client.status == 200) {
// Append the base64 header and the base64 response text from the server
var base64audio = 'data:audio/mp3;base64,' + stringToBase64(client.responseText);
// Shares the audio file with a new name file.mp3 using Cordova plugin
window.plugins.socialsharing.share(null, 'file.mp3', base64audio, null);
}
}
client.send(); // Send the request
}
The function below simply transforms a string into Base64 format. Original code by Niko.
function stringToBase64(str) {
var CHARS = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/";
var out = "", i = 0, len = str.length, c1, c2, c3;
while (i < len) {
c1 = str.charCodeAt(i++) & 0xff;
if (i == len) {
out += CHARS.charAt(c1 >> 2);
out += CHARS.charAt((c1 & 0x3) << 4);
out += "==";
break;
}
c2 = str.charCodeAt(i++);
if (i == len) {
out += CHARS.charAt(c1 >> 2);
out += CHARS.charAt(((c1 & 0x3)<< 4) | ((c2 & 0xF0) >> 4));
out += CHARS.charAt((c2 & 0xF) << 2);
out += "=";
break;
}
c3 = str.charCodeAt(i++);
out += CHARS.charAt(c1 >> 2);
out += CHARS.charAt(((c1 & 0x3) << 4) | ((c2 & 0xF0) >> 4));
out += CHARS.charAt(((c2 & 0xF) << 2) | ((c3 & 0xC0) >> 6));
out += CHARS.charAt(c3 & 0x3F);
}
return out;
}
In order to use the Social Sharing plugin you need to add the following line in the <head> of your index.html file:
<script type="text/javascript" src="cordova.js"></script>
And this other line in your Phonegap's config.xml file:
<gap:plugin name="org.apache.cordova.media" source="npm" />
<gap:plugin name="org.apache.cordova.network-information" source="npm" />
<gap:plugin name="cordova-plugin-x-socialsharing" source="npm" />
<gap:plugin name="cordova-plugin-whitelist" source="npm" />
<allow-navigation href="*" />
<allow-navigation href="http://*/*" />
Now you will be able to share your audio files on Whatsapp, Facebook messenger, email, etc. Enjoy!
There is a fantastic Cordova plugin called Social Sharing, developed by Eddy Verbruggen (thanks for your help), which makes things much easier, but it does not explain how to share audio files. This is how I did it on Javascript:
The function below assumes that your file is in a remote server. If this is not the case, the code is much simpler and you can remove all the XMLHttpRequest code.
function shareAudio() {
var endpoint = 'http://www.example.com/yourFile.mp3;
var client = new XMLHttpRequest();
client.open('GET', endpoint, true); // Async call
// Need to change the MimeType for this kind of binary content
client.overrideMimeType("text/plain; charset=x-user-defined");
client.onreadystatechange = function() {
// When the progress is level 4 (ready) and the status is 200
if (client.readyState == 4 && client.status == 200) {
// Append the base64 header and the base64 response text from the server
var base64audio = 'data:audio/mp3;base64,' + stringToBase64(client.responseText);
// Shares the audio file with a new name file.mp3 using Cordova plugin
window.plugins.socialsharing.share(null, 'file.mp3', base64audio, null);
}
}
client.send(); // Send the request
}
The function below simply transforms a string into Base64 format. Original code by Niko.
function stringToBase64(str) {
var CHARS = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/";
var out = "", i = 0, len = str.length, c1, c2, c3;
while (i < len) {
c1 = str.charCodeAt(i++) & 0xff;
if (i == len) {
out += CHARS.charAt(c1 >> 2);
out += CHARS.charAt((c1 & 0x3) << 4);
out += "==";
break;
}
c2 = str.charCodeAt(i++);
if (i == len) {
out += CHARS.charAt(c1 >> 2);
out += CHARS.charAt(((c1 & 0x3)<< 4) | ((c2 & 0xF0) >> 4));
out += CHARS.charAt((c2 & 0xF) << 2);
out += "=";
break;
}
c3 = str.charCodeAt(i++);
out += CHARS.charAt(c1 >> 2);
out += CHARS.charAt(((c1 & 0x3) << 4) | ((c2 & 0xF0) >> 4));
out += CHARS.charAt(((c2 & 0xF) << 2) | ((c3 & 0xC0) >> 6));
out += CHARS.charAt(c3 & 0x3F);
}
return out;
}
In order to use the Social Sharing plugin you need to add the following line in the <head> of your index.html file:
<script type="text/javascript" src="cordova.js"></script>
And this other line in your Phonegap's config.xml file:
<gap:plugin name="org.apache.cordova.media" source="npm" />
<gap:plugin name="org.apache.cordova.network-information" source="npm" />
<gap:plugin name="cordova-plugin-x-socialsharing" source="npm" />
<gap:plugin name="cordova-plugin-whitelist" source="npm" />
<allow-navigation href="*" />
<allow-navigation href="http://*/*" />
Now you will be able to share your audio files on Whatsapp, Facebook messenger, email, etc. Enjoy!