Phonegap Developer storing files in development on cache - javascript

I'm developing a Phonegap application using Phonegap Developer for Android. And I have a big problem: after I change some file, like index.html, or some.js, some.css, some.png... it doesn't works on app. Basically the application reload and I get same old file.
I tried use four fingers to reload, and three fingers to back to application home, and connect again. I tried inspect via desktop and force location.reload(true). Nothing. The unique solution is force close Phonegap Developer and open it again.
Even if I put something like some.js?$timestamp, it doesn't works, because index.html is cached too. I guess that this cache is cleaned time in time, but I don't know how much. And some changes I need test imediatly.

don't know if this is the same issue I had two days ago, but the simptoms are like you described. I finally solved it upgrading phonegap. Maybe it's not the best solution, but it worked for me.
$ sudo npm update -g phonegap

You can check a similar answer here : PhoneGap disable caching
document.addEventListener('deviceready', onDeviceReady);
function onDeviceReady()
{
var success = function(status) {
alert('Message: ' + status);
}
var error = function(status) {
alert('Error: ' + status);
}
window.cache.clear( success, error );
}

Related

Why is Service Worker not running on Chrome for Android?

Currently I'm trying to build a web app using the Samsung Tab A. I thought this device would support Service Workers, cause following Can I Use says Chrome for Android 55 is required to run SW.
The tablet is running Android 6.0.1 (no more updates available) and Chrome 55.0.2, but unfortunately when the code shown below runs, the 'no sw' alert pops up.. The SW works fine in Chrome on desktop (mac OS).
if('serviceWorker' in navigator) {
navigator.serviceWorker.register('/sw.js').then((registration) => {
alert('sw');
console.log('ServiceWorker successful, scope: ', registration.scope);
}).catch((err) => {
alert('no sw');
console.log('ServiceWorker failed: ', err);
});
}
Am I doing something wrong, or is it not possible to run SW on this kind of tablet? What else is needed if Chrome 55 isn't enough? I think there is some lack of information about this topic since I can't find the answer on this .. :(
Thanks in advance!
EDIT: I'd already enable multiple flags via chrome://flags without any success..
I was using ngrok to serve my webapp locally to my tablet. Did forget to use https..
Go to chrome://flags and add the url like http://localhost:3000/ to the unsafe input
if you don't know just follow the picture bellow.
https://i.ibb.co/Tvwv6VN/Screenshot-20220727-223110.jpg
after this re launch your chrome or any browser.

ionic http get to a local file gives http error code 0?

I'm building a map using leaflet, mapbox, and omnivore. I have a .kml file with a list of markers on it. The markers load fine on desktop using ionic serve, but not when I actually run it on a mobile device (I have tested both android/ios).
I know that omnivore loads this file using an xhr request, so I decided to test that myself:
test = function() {
$http.get('/kml/file.kml').success(function(data, status, headers, config) {
alert('Success!: ' + status);
})
.error(function(data, status,headers,config) {
alert('FAILURE!: ' + status);
});
}
I get 200 success on desktop, but when I run it on a mobile device using ionic view or build it for Android I get failure with error code 0.
I'm not sure why this is happening on mobile devices, I have <access origin="*"/> in my config.xml.
Any help would be appreciated, thanks!
Dont't know what version of Angular you are running, but $http.success and $http.error has been deprecated (since v.1.4.4 I think) and been replaced with success and error callback functions
$http.get('/kml/file.kml').then(
function successCallback(response) {
console.log(response);
}, function errorCallback(error) {
console.log(error);
});
Not sure if this is your problem, but try update your angular and/or change your code and see if this makes any difference.
Well, I figured out the solution. I had a leading slash in the url to the file which was being read correctly when ionic serve was putting the site up as a server, but when using on a mobile device ionic launches the app using the file:// protocol and the leading slash was causing conflicts.
tldr; removed the leading slash, all is well.

Branch.io Cordova API - init() fails on Android Device

I'm having problems getting Branch.io to work in a Cordova powered Android app. I have a landing page that parses the data from branch.io deep links and forwards the user to the correct page. My javascript for this page contains:
function onDeviceReady() {
console && console.log("Device Ready");
initBranch();
}
function initBranch() {
branch.init(<branchKey>, function(err, data) {
console && console.log("branch init error: " + err);
//then the parsing and forwarding follows - omitted here
}
I then created a Branch.io deep link to this landing page in the web api and tested it in chrome which works.
Then i tried to move to the Cordova app...
I followed this guide to prepare the app for branch.io:
https://dev.branch.io/recipes/quickstart_guide/cordova/ (I installed the plugin and adapted the Manifest file.)
But when i try to open the same link that worked in chrome on my Android device the app opens correctly and the landing page loads, but i'm not forwared. Instead i see the following error in logcat:
I/chromium(19382): [INFO:CONSOLE(22)] "Device Ready"
[...]
I/chromium(19382): [INFO:CONSOLE(29)] "branch init error: Error: API request /v1/open missing parameter device_fingerprint_id"
Can anyone tell me what i'm doing wrong? I'm just getting to know Cordova and Branch.io so it's probably something small i'm overlooking.
Thanks,
Lif
A colleague of mine figured it out:
Branch.io creates an entry branch_session in the local storage of the android device. On my device this session was corrupted somehow and the device_fingerprint_id was empty:
{"session_id":"198413861345316824","identity_id":"198398707320770300","device_fingerprint_id":null,"browser_fingerprint_id":null,"link":"<link>","data":"{\"+is_first_session\":false,\"+clicked_branch_link\":false}"}
After clearing the local storage* the session was freshly created, and now looks like this:
{"session_id":"198413861345316824","identity_id":"198398707320770300","device_fingerprint_id":"118176839880411216","browser_fingerprint_id":null,"link":<link>,"data":"{\"+is_first_session\":false,\"+clicked_branch_link\":false}"}
And now deep linking works.
Kr,
Lif
* To clear the local storage i used chrome://inspect --> inspect webview, go to resources tab, choose "local storage" and the the correct url, then remove all values.

How to get started using Phonegap Build with a Durandal SPA App?

I've built a SPA using Durandal and it all works fine in a browser. What I'm trying to do now is wrap it up with Phonegap (ideally using Phonegap Build) and deploy it as an Android app.
The Durandal documentation on the subject (http://durandaljs.com/documentation/Native-Apps-With-PhoneGap-Cordova/) is pretty sparse. It's key points of optimizing the app to generate a main-built.js file were done as were gathering the js/css assets into one place.
However, it doesn't mention anything about Phonegap/Cordova having a device ready event rather than a document ready one. I've packaged the app according to instructions. It installs alright on my Android device but gets stuck on the splash screen. Other questions have asked about being stuck on the splash screen, but the solutions posted there don't help. I can't help but think something fundamental is missing here?!?
Do I need to have Phonegap specific code in index.html? In any javascript?
Note: I'm using Durandal 1.2 but the same questions apply for v2.0.
You can hook into the Phonegap device ready event in main.js, you can then be sure the device is ready before the shell or any view activate events are fired. This example checks the agent so it will still fire up in a browser. This is from my example Durandal 2 / Phonegap Build project.
https://github.com/BenSinnott/LandmarkTracker
define(['durandal/app', 'durandal/viewLocator', 'durandal/system'], boot);
function boot(app, viewLocator, system) {
var useragent = navigator.userAgent.toLowerCase();
if (useragent.match(/android/) || useragent.match(/iphone/) || useragent.match(/ipad/) || useragent.match('ios') || useragent.match('Windows Phone') || useragent.match('iemobile')) {
document.addEventListener('deviceready', onDeviceReady, false);
}
else {
onDeviceReady();
}
function onDeviceReady() {
app.title = 'Landmark Tracker';
app.configurePlugins({
router: true
});
app.start().then(function () {
viewLocator.useConvention();
app.setRoot('viewmodels/shell', 'entrance');
});
}
}
However, it doesn't mention anything about Phonegap/Cordova having a device ready event rather than a document ready one.
jQuery can listen for document ready via $(document).ready but HTML/javascript itself doesn't have a document ready event. The closest pure javascript equivalent is listening for the DOMContentLoaded event. Phonegap/Cordova offers the device ready event as documented here. Be sure to include <script type="text/javascript" charset="utf-8" src="cordova.js"></script> in your <head></head> tags.
It installs alright on my Android device but gets stuck on the splash screen.
Take a look at your config.xml. Do you have <preference name="splash-screen-duration" value="xxxx"/> where xxxx is set to some crazy high number?
You could always call navigator.splashscreen.hide() after device ready fires but you will need to build in the deviceready listiner. Easy to do using the documentation I provided above. If that doesnt fix it, then we will need to take a look at some of your code to dig into what is going on.
First of all try an unminified Version. Means copy all the folders into your assets folder. Then look at logcat. Most likely u had a js error. If that works try the minified version and check if that one throws errors via logcat
Edit: sry this applies of course only for manual build in android not for the online service. For IOS as far as i remember you get the errors thrown in the output window.

Loading Meteor .js in a local Html file in android

I am trying to work with Meteor. Now I have the entire setup running in my localmachine with apache2 and the meteor.js also works when browsing the same URL from Android Emulator's Browser . Now the main problem is that I need the functionality in my android app from a local URL and here the page is not able to load the remote js. I am loading the following html using WebViews loadURL method after setting the javascript as enabled .The js embedded in the html will be something like this
<script type="text/javascript" src="http://meteor.mywebserver.com/meteor.js"></script>
<script type="text/javascript">
window.onload = function()
{
Meteor.host = "meteor.mywebserver.com";
alert(textStatus);
// Call the test() function when data arrives
Meteor.registerEventCallback("process", commentsUpdate);
// Join the demo channel and get last five events, then stream
Meteor.joinChannel("demo", 0);
Meteor.mode = 'longpoll';
// Start streaming!
Meteor.connect();
// Handle incoming events
function commentsUpdate(data)
{
alert(data);
};});
After searching around a lot I tried this stackoverflow answer
To no avail . Can anybody help me find a work around here , I cant use a local meteor.js as it wont work.
Thanks
This has since been addressed in Meteor by way of integrated Cordova, which you can read about here. Basically, you tell Meteor that you want to add the Android platform to your app, and it builds the Android project files for you. Your app will look as if it's running native, but it's really just running in a light app surrounding a "web view". In iOS this is done using WebKit, but I think in Android it depends on the version of the OS.
You will still need to deploy your app to the Play store, which requires signing the app and all.

Categories

Resources