I've trying for some days to get inAppBrowser to work in a simple Phonegap App for iOS with no luck.
Nothing happens... No log con the console.log...
What I've done so far is:
Install inAppBrowser using: plugman --platform ios --project /path/to/app --plugin inappbrowser
If I try to install it using
phonegap plugin add
https://git-wip-us.apache.org/repos/asf/cordova-plugin-inappbrowser.git
it says it's already installed, so I assume installation is OK.
Add the plugin call in the main config.xml file this way: <gap:plugin name="org.apache.cordova.inappbrowser" version="0.2.4" />
My index.html file looks like this:
<!DOCTYPE html>
<html>
<head>
<title>InAppBrowser Example</title>
<script type="text/javascript" charset="utf-8" src="phonegap.js"></script>
<script type="text/javascript" charset="utf-8">
// Wait for Cordova to load
//
document.addEventListener("deviceready", onDeviceReady, false);
// Cordova is ready
//
function onDeviceReady() {
var ref = window.open('http://apache.org', '_blank', 'location=yes');
}
</script>
</head>
<body>
Hello World
</body>
</html>
I understand, on launch, it should open the Apache home, or stay blank (because of Phonegap URL permissions), but it just shows up the "Hello World" text and nothing happens.
Any ideas of what am I doing wrong?
Thanks in advance, and sorry about my poor english!
Make sure you have the following in your config.xml:
I used to have org.apache.cordova.InAppBroweser - maybe from an older version and it caused issues.
Also make sure your config.xml (in your apk file) is created properly.
Related
I just tried to test electron environment for programming with JavaScript on desktop with Windows 10.
So I have an app:
const electron=require("electron");
const app=electron.app;
const BrowserWindow=electron.BrowserWindow;
var mainWindow=null;
app.on("ready",function(){
mainWindow=new BrowserWindow({height:600,width:800});
mainWindow.loadURL("file://"+__dirname+"index.html");
});
and index.html is:
<html>
<head>
<title> MyIndex.html </title>
</head>
<body>
Hello World from Electron!<br>
</body>
</html>
and package.json is:
{
"name":"Electron-Test",
"version":"0.1.0",
"main":"./main.js",
"scripts":{"start":"electron ."}
}
If I run electron . or npm start the application seems to start, but no browser window opens. On console I have to press Ctrl-C to stop the application.
Does anyone know where is the problem?
try to add one more/after file:
you are also missing a / before index.html
app.on("ready",function(){
mainWindow=new BrowserWindow({height:600,width:800});
mainWindow.loadURL("file:///"+__dirname+"/index.html");
});
i saw it in this video, at 3:32 https://www.youtube.com/watch?v=i0AkgNv4U4E
From this link, it says :
Once an application is cached, it remains cached until one of the
following happens:
The user clears the browser's cache
The manifest file is modified (see tip below)
The application cache is programmatically updated
Following the instruction from the internet, for the manifest file I use a version number. When I change the content of the index.html with 01.jpg to 02.jpg - I also changed the version number of the manifest file.
With the steps above, it works within my Win7 Wamp Server Local Host. But once I do the same steps in my web server (after uploading the file to the web server) - it doesn't work.
Can somebody please help me what did I do wrong ?
Document was loaded from Application Cache with manifest http://www.example.com/test/offline.appcache
Application Cache Checking event
Navigated to http://www.example.com/test/
Application Cache NoUpdate event
Above is from the Chrome browser console after I modified the version number of the manifest file (from #01 to #02) and the jpg file (from 01.jpg to 02.jpg) in the index.html file.
The offline.appcache CACHE file list no change, except the version number :
CACHE MANIFEST
# 2017-03-25 version#01
uploads/event.jpg
uploads/baby.jpg
/favicon.ico
NETWORK:
indexPHP.php
The index.html file :
<!DOCTYPE html>
<html manifest="offline.appcache">
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style></style>
</head>
<body>
<img src="uploads/01.jpg">
</body>
</html>
<script type="text/javascript">
function onUpdateReady() {
alert("offline files will be updated");
window.location.reload();
}
window.applicationCache.addEventListener('updateready', onUpdateReady);
if(window.applicationCache.status === window.applicationCache.UPDATEREADY) {
onUpdateReady();}
</script>
the .htaccess file :
AddType text/cache-manifest .appcache
the "tree" :
example.com/.htaccess
example.com/favicon.ico
example.com/test/index.html
example.com/test/offline.appcache
example.com/test/uploads/01.jpg
example.com/test/uploads/02.jpg
Thank you in advanced.
I have an app I developed in Android. I installed a VM with Mac, and I'm testing it in iOS. The app worked perfectly in Android, but in iOS it is not. When I use 'ionic serve' or 'ionic serve --lab' the browser show a white screen, and in the console I get this errors (link of image below):
Console
Here is some code from the index.html:
<link href="lib/ionic/css/ionic.css" rel="stylesheet">
<link href="css/style.css" rel="stylesheet">
<link href="css/font-awesome-4.7.0/css/font-awesome.min.css" rel="stylesheet">
<link href="css/style.css" rel="stylesheet">
<link href="lib/ionic/css/style.css" rel="stylesheet">
<!-- IF using Sass (run gulp sass first), then uncomment below and remove the CSS includes above
<link href="css/ionic.app.css" rel="stylesheet">
-->
<!-- ionic/angularjs js -->
<script src="lib/bluebird.min.js"></script>
<script src="lib/ionic/js/ionic.bundle.js"></script>
<script src="lib/ionic.cloud.min.js"></script>
<script src="lib/ionic/js/ionic-modal-select.min.js"></script>
<script src="lib/ionic/js/ionic-toast.js"></script>
<!-- cordova script (this will be a 404 during development) -->
<script src="js/ng-cordova.min.js"></script>
<script src="cordova.js"></script>
I'm really lost here because the exact same files works OK for Android.
Which error you are posted, not library error.Error coming from app.js file.If you dont mind create a new ionic app and replace your file in new app.it will works.
I am having a problem with my ionic project, it is not loading cordova.js file or ngCordova.js file.
Here is my index.html file
<!DOCTYPE html>
<html>
<head>
<script src="lib/ngCordova/dist/ng-cordova.js"/>
<script src="cordova.js"></script>
<script type='text/javascript' src="lib/cryptojslib/rollups/aes.js"></script>
...
</head>
When I deploy the app on my iphone, aes.js and cordova.js file is loaded, the problem is ng-cordova.js is not loaded because when I invoke that code I get:
Error: Can't find variable: cordova
scan#file:///var/containers/Bundle/Application/6888FB51-F164-46EC-89AC-B8960C93FC7A/Nastic.app/www/lib/ngCordova/dist/ng-cordova.js:596:16\
....
If I switch lines:
<!DOCTYPE html>
<html>
<head>
<script src="cordova.js"></script>
<script src="lib/ngCordova/dist/ng-cordova.js"/>
<script type='text/javascript' src="lib/cryptojslib/rollups/aes.js"></script>
...
</head>
Then ng-cordova.js is loaded, but aes.js is not loaded.
I was looking for a fix to this problem but couldn't find anything that solved the issue, however lot of similar issues.
Thanks
You should always include the file cordova.js after loading ng-cordova.js
<script src="lib/ngCordova/dist/ng-cordova.js"></script>
<script src="cordova.js"></script>
<script src="lib/cryptojslib/rollups/aes.js"></script>
Reference: http://ngcordova.com/docs/install/
I am trying out a Polymer Dart App under Cordova. So I started with the Dart Editor Sample App.
I use a recent version of Polymer so I had to edit the sample code. Here is my pubspec.yaml
name: cortst
description: Cordova Test Application
dependencies:
polymer: '>=0.15.1+3 <0.16.0'
transformers:
- polymer:
entry_points:
- web/cortst.html
And here is the combined HTML and Dart. I think the initialization uses the new/approved technique:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Sample App</title>
<link rel="import" href="clickcounter.html">
<link rel="stylesheet" href="cortst.css">
<script type="application/dart">
import 'dart:async';
import 'package:polymer/polymer.dart';
void main() {
initPolymer().run( () {
Polymer.onReady.then( (_) {
new Future( () {
// stuff goes here!
});
});
});
}
</script>
</head>
<body>
<h1>A Test</h1>
<div id="sample_container_id">
<click-counter count="5"></click-counter>
</div>
</body>
</html>
To generate stand-alone JavaScript I run dart2js via the command line:
pub build --mode=debug
And these are the results:
Dartium (37.0.2062.120 (292122) via Dart Editor 1.7.2) - OK
Run as JavaScript on Chrome (38.0.2125.111 m) - OK
Run as JavaScript on Firefox (33.0.3) - OK
dart2js and run on Chrome - no shadow DOM.
dart2js and run on Firefox - OK
When it fails the click counter is rendered (invisibly) as
<click-counter count="5"></click-counter>
This Chrome problem matters because the standard web host on Android is Chrome.
For brevity, I have embedded the Dart script in the HTML. I get the same results when I use a separate .dart file.
Perhaps I have overlooked something - it wouldn't be the first time...