I've written a small application to test the working of cordova app on XDK.
The source code is same as this question
However, I am attaching the code here :
(function()
{
"use strict";
/*
hook up event handlers
*/
function register_event_handlers()
{
/* button Login */
$(document).on("click", ".uib_w_9", function(evt)
{
//intel.xdk.notification.showBusyIndicator();
/*$.post("http://url/test.php", {test:'1'},
function(res){
alert(res);
}
);*/
$.ajax({
beforeSend: function(){
intel.xdk.notification.showBusyIndicator();
},
type: "GET",
url: 'http://url/test.php',
data:{test:'1'},
success: function(res){
alert(res);
intel.xdk.notification.hideBusyIndicator();
},
error:function(res){
alert(res);
intel.xdk.notification.hideBusyIndicator();
},
dataType: 'text'
});
});
}
document.addEventListener("app.Ready", register_event_handlers, false);
})();
This is the JS file of the application.
The screenshot of the app in XDK emulator :
Now When I do a build of the app using XDK cloud, I get a .apk file.
On uploading the file to GenyMotion Emulator, screen below :
The click doesn't do anything, nor does the showBusyIndicator() show, nor the alert appear.
What am I missing and what is going wrong ?
I've plans to use this ide for a proper project and hence the testing, some help will be appreciated.
UPDATE
I did a Cordova Hybrid App build initially and that caused the problem.
When I did a legacy android build, then the problem was solved.
So what do I need to do to get it to work with the Cordova Build ?
Build Page :
There is a known issue with AJAX when Intel XDK builds apk with Cordova CLI version 4.1.2. on Android version > 4.4
There is a workaround, go to Project Settings -> Build Settings -> Android, change Cordova CLI version from 4.1.2 to 3.5 and AJAX should work.
Related
I'm building an ionic application and I faced with an issue that affect only the Android devices.
I have some public images that I'd like to load like this:
<img src={imageurl} alt="" />
I'm using this plugin https://github.com/capacitor-community/http to make API calls, to avoid CORS issues. All the API calls are working on both platforms, but the images only works on iOS.
If I check the inspector this is the error message I get:
If I check the Android Studio logs I see these error messages: E/Capacitor: Unable to open asset URL:
If I'm using axios to make the API calls it works fine on Android but then it'll break on iOS due to CORS issues.
I was trying to separate the API calls and only use the native plugin on iOS but I don't think that is possible.. Android was able to make the calls with axios but response was always got response like this:
Android AndroidManifest is extended with this: android:usesCleartextTraffic="true"
webDir: "build",
bundledWebRuntime: false,
android: {
allowMixedContent: true
},
server: {
cleartext: true,
hostname: "baseurl.hu",
iosScheme: "localhost",
androidScheme: "https"
},
This is how I run the app:
ionic capacitor copy android
Android Studio run.
I am developing an android app based on ionic 2 using typescript.
I would like o open a PDF file inside my app with another app that is registered for the fyletype (e.g. Acrobat Reader).
Therefore i tried the two standard plugins:
https://github.com/disusered/cordova-open
https://github.com/pwlin/cordova-plugin-file-opener2
Although ive added both plugins via "ionic plugin add ..." and of course played around with several combination referencing to it
the result is always that they ere not found
cordova-open
var open = cordova.plugins.disusered.open;
Property 'disusered' does not exist on type 'CordovaPlugins'.
cordova-plugin-file-opener2
cordova.plugins.fileOpener2.open(
filePath,
fileMIMEType,
{
error : function(){ },
success : function(){ }
}
);
Property 'fileOpener2' does not exist on type 'CordovaPlugins'.
I am running the app on an emulator via ionic run android
Could you please give some hint how i can achieve to use one of these plugins?
Thank you very much
Shane
I am trying to force the links in my app to open in external browser. I am working with jQuery mobile & Phonegap build.
My app has a page with generated contact details. Among the details there is an link to the person's website:
row+='<div class="accWWW"> '+ data[i].website +'</div>';
I have these 2 functions defined in my code.
//function which forces open in browser
function openBrowser(url){
if(device.platform === 'Android') {
navigator.app.loadUrl(url, {openExternal:true});
} else {
window.open(url, '_system');
}
}
//opens generated URL's
function openGenerated(obj){
var url = obj.getAttribute("href");
console.log(url);
openBrowser(url);
return false;
}
I also have a simple <div class="accWWW"> Google </div> set in my index.html
So... this link to Google opens perfectly in iOS (haven't yet tested on Android because iOS was my biggest problem), but the generated link wouldn't do anything if I hadn't added the openGenerated function. Now there is an action, but it opens inside the app.
Do you have any idea why that is?
Also when checking on the laptop I get these errors in the console( link is my development url):
Uncaught ReferenceError: device is not defined *link*:277 // makes sense probably, because I am not using a mobile device
Uncaught SecurityError: Blocked a frame with origin "http://www.test.com" from accessing a frame with origin "*link*". Protocols, domains, and ports must match.// what is this?
I was thinking maybe it's an access issue, but I added <access origin="*" browserOnly="true" /> in my config.xml, so there shouldn't be a problem with this.
LATER EDIT: On Android the Google link doesn't work at all and the generated one opens inside the app... Apparently device.platform is always null, but the device plugin is added in xml as I can see in phonegap build this list of plugins:
Installed Plugins
Apps will be built with the latest version of a plugin unless you lock the version in your config.xml (see below). -- Plugin installed as a dependency of another plugin
Third Party VERSION LATEST VERSION
com.phonegap.plugin.statusbar 1.1.0 1.1.0
PhoneGap Core
org.apache.cordova.device 0.2.8 0.2.8
org.apache.cordova.inappbrowser 0.3.3 0.3.3
LATER EDIT:
Device.platform doesn't seem to be working, so I modified my function, adding Ved's suggestion, to:
function openBrowser(url){
if(navigator.app)
navigator.app.loadUrl(url, {openExternal:true});
else {
var ref = window.open(url, '_system', 'location=no');
ref.addEventListener('loadstart', function(event) {
});
ref.addEventListener('loadstop', function(event) {
console.log(event.type + ' - ' + event.url);
});
ref.addEventListener('exit', function(event) {
});
}
}
on iOS still opens inside the app. For Android I think it's working fine.
I fixed my issue.
I was adding cordova.js in my html. Apparently this broke things.
I have an app which was working fine up until this week, and I've no idea what has suddenly changed.
Consider the following code. The first "console.log" outputs correctly, but NOT ONE of the others outputs anything at all.
console.log('requesting file system');
try {
requestFileSystem(1, 1024*1024, function(fs) {
console.log('file system received. requesting root directory');
fs.root.getDirectory( options.name, {create:true}, function( directory ) {
console.log('root directory received');
filesystems[options.name] = directory;
console.log('calling callback');
if ( callback ) me.fn( me.name, callback ).call( me, me );
console.log('callback called');
}, function(e) {
console.log('error handler 1');
console.log(e);
});
}, function(e) {
console.log('error handler 2');
console.log(e);
});
}
catch(e) {
console.log('error handler 3');
console.log(e);
}
Any ideas what to look for?
I've "solved" this by starting a fresh application, copying the www directory over, re-installing all the plugins from the broken application.
I don't know what problem there was, but this clean installation is working fine now.
This issue lot of them are facing, stems from a bug in cordova nativetoJSbridge.
It has been marked fixed in 3.6.0, but never worked in that version. Couple of versions above the specific version works.
Steps to fix it in your existing project if you are using eclipse.
Install latest cordova using npm and create a new project using CLI.
Add the file api to your new project using cordova plugin add command.
Once the plugin is added to your project, copy the latest java sources of cordova as well as your file api to your old project.
Also, copy the file api plugin javascript sources and diff and merge cordova.js.
Now compiling your old project should fix window.requestFileSystem issue.
If you are using CLI, even better. create a new project from CLI and copy your old project sources to new project and add the plugins using CLI or update your project using CLI.
As a side note, this bug had been around for a while, where the problem seems to be in
NativeToJsMessageQueue
https://issues.apache.org/jira/browse/CB-6761
Though from the bug it reads to be unresolved, it is fixed in latest version above 3.6.x
I'm completely new to phonegap. I started with phonegap build - by running 'npm install -g phonegap'.
My system is windows7.
When i run the command 'phonegap run android' i'm getting console messages as follows:
[phonegap] detecting Android SDK environment..
[phonegap] using the local environment
[phonegap] compiling Android...
[phonegap] successfully compiled Android app
[phonegap] trying to install app onto device
[phonegap] successfully installed onto device
I can see the app running on my device (sony Xperia -E).
But when i put in my javascript code:
bindEvents: function() {
document.addEventListener('deviceready', this.onDeviceReady, false);
},
// deviceready Event Handler
//
// The scope of 'this' is the event. In order to call the 'receivedEvent'
// function, we must explicity call 'app.receivedEvent(...);'
onDeviceReady: function() {
app.receivedEvent('deviceready');
},
// Update DOM on a Received Event
receivedEvent: function(id) {
console.log('Received Event: ' + id);
//HERE
alert(navigator.camera)
}
i keep getting alert which say 'undefined'. I checked the same with navigtaor.geolocation, and it wasnt undefined.
I guess it something to do with camera plugin. Am i right?
Please Help
Thanks Forwards
You have to add these things:
--> app/res/xml/plugins.xml
<plugin name="Camera" value="org.apache.cordova.CameraLauncher" />
--> app/AndroidManifest
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />
After looking itno this project i figured out where was my mistake
I tried to use the 'ondeviceready' eventhandler which comes with index.js.
Dont know why yet, but this handler fires when camera is undefined.
After i specified my own handler on the page
document.addEventListener("deviceready",onDeviceReady,false);
function onDeviceReady() {
alert(navigator.camera);
}
camera became defined
It is supposed to have the cordova-plugin-camera plugin added to your PhoneGap/Cordova project, so just this way you'll get the example working.
See the right command:
cordova plugin add cordova-plugin-camera
Before running phonegap application, make sure you add the lib:
phonegap local plugin add https://git-wip-us.apache.org/repos/asf/cordova-plugin-camera.git
phonegap local plugin add https://git-wip-us.apache.org/repos/asf/cordova-plugin-media-capture.git
phonegap local plugin add https://git-wip-us.apache.org/repos/asf/cordova-plugin-media.git
If you omit loading the plugin before building the app it will not work, I also had problems sometimes with installed plugins, so if you did install them, try removing and re-adding them, that worked for me. You can check what plugins are installed by:
phonegap local plugin list
For more information please visit: Official Phonegap Documenattion
Regarding: navigtaor.geolocation it is a standard HTML5 call so if the geolocation plugin is not installed (at least on Android) it will be interpreted as a standard HTML5 geolocation call.
This worked for me, I guess someone needs to make a release.
cordova plugin remove cordova-plugin-camera && cordova plugin add https://github.com/apache/cordova-plugin-camera