Glitches After Using Phonegap Build

Ionic Framework ionic-v3
1

Hello, my app is working totally fine in emulators, but when I build it using Phonegap and submit to the Google Play store, it only displays the following text:

Webpage not available

The webpage at http://192.168.1.69:8100/
could not be loaded because:

net::ERR_ADDRESS_UNREACHABLE

I searched my project and I noticed that the IP address above is only hard-coded into my app two times, both in config.xml

Line 6:
<content original-src="index.html" src="http://192.168.1.69:8100" />

… and Line 80:
<allow-navigation href="http://192.168.1.69:8100" />

Additionally, running the command ionic cordova plugin list gives the following output (here I’m mainly trying to communicate the fact that I have cordova-plugin-whitelist installed):

C:\myApp>ionic cordova plugin list
> cordova plugin ls
√ Running command - done!
cordova-admob-sdk 0.7.0 "AdMob SDK"
cordova-plugin-admob-free 0.9.0 "Cordova AdMob Plugin"
cordova-plugin-console 1.0.5 "Console"
cordova-plugin-device 1.1.4 "Device"
cordova-plugin-splashscreen 4.0.3 "Splashscreen"
cordova-plugin-statusbar 2.2.2 "StatusBar"
cordova-plugin-whitelist 1.3.1 "Whitelist"
cordova-promise-polyfill 0.0.2 "cordova-promise-polyfill"

And lastly, here is my ionic info for reference:

C:\myApp>ionic info

cli packages: (C:\myApp\node_modules)

    @ionic/cli-utils  : 1.9.2
    ionic (Ionic CLI) : 3.9.2

global packages:

    Cordova CLI : 7.0.1

local packages:

    @ionic/app-scripts : 2.0.0
    Cordova Platforms  : android 6.2.3 browser 4.1.0 ios 4.4.0
    Ionic Framework    : ionic-angular 3.5.0

System:

    Android SDK Tools : 25.2.5
    Node              : v8.5.0
    npm               : 5.3.0
    OS                : Windows 10

Please let me know if anyone has insight into the cause of this issue! Thank you so much.

2

Hi,

Guessing you’re using Live Reload…?

If you build without that does it work? As in just a content src=“index.html” and nothing else…

3

Yes, I think right before this current build, I used --livereload to emulate and test my app.

Okay, I just ran ionic cordova run android and line 8 was changed to <allow-navigation href="http://ionic.local/*" />
Is this the problem? If I submit now, will the error disappear? Sadly, I don’t have an android device on which to test so I can only submit my app to beta and have my friends test it.

Remember, this issue only presented itself when I submitted to the Play store and tested it. (or, more accurately, ran the .apk on an actual device after using Phonegap Build) So, I can build without --livereload and it works fine, it just isn’t working on an actual device.

It would make sense that having the most recent build set for --livereload would cause an error on an actual Android device.

4

You are a braver man than I - I would not be trying to develop an app for an operating system I did not have access to. GET A CHEAP ANDROID.

Not to put you too far off your current track but why not use Ionic Pro instead of PhoneGap Build? They will build your apk / ipa’s and support over-the-air updates - even in your situation you don’t need to depend on a local PC where you need to be on the same physical network etc - and don’t need to have additional ‘allow’ statements in your config.xml.

Seriously it would make your life crazily simpler.

5

The more I think about it the more I think that definitely would be the right solution for your situation.

Incur a little bit of pain for a lot of gain.

Using Phonegap Build you essentially have to give it complete bundled code which is annoying. Ionic Pro will do that step -> just set up a git repo then it’s as simple as…

git push ionic master

You can then see it build as if you were doing it yourself.

PS
Don’t forget to update the scripts section in your package.json for the ‘build’ like to…

"build": "ionic-app-scripts build --prod",
6

I tried to link my app to ionic pro about a month ago when everything was revamped, but ran into some strange errors and decided to just stick with Phonegap Build because I was already using it. Here’s the error I get in the midst of switching from the legacy Ionic service I used earlier in the summer to Ionic Pro:

C:\myApp>git push ionic master
Permission denied (publickey).
fatal: Could not read from remote repository.

Please make sure you have the correct access rights
and the repository exists.
7

If you have an account for ionic pro already just try this.

Create a new app on ionic pro itself.
It should give you a couple lines to run locally to create a brand new app. Do what it tells you to do, then try the git push to ionic and see if that works.

What we’re hoping to learn is can it work at all with a brand new app eliminating everything else.

8

Okay, I remember what happened. Installing openSSH on Windows was really confusing. That’s why I decided to stick with Phonegap Build.

I’m not sure what role openSSH has in all of this, and I don’t know if I need to download and install or how to do so with respect to Ionic.

C:\myApp>ionic link --pro-id fb80ad3e
> ionic ssh setup
[ERROR] Command not found: ssh
[WARN] OpenSSH not found on your computer.
[INFO] Looks like you haven't configured your SSH settings yet.

? How would you like to connect to Ionic Pro? Automatically setup new a SSH key pair for Ionic Pro
[INFO] The automatic SSH setup will do the following:
       1) Generate a new SSH key pair with OpenSSH (will not overwrite any existing keys).
       2) Upload the generated SSH public key to our server, registering it on your account.
       3) Modify your SSH config (..\Users\David Biggs\.ssh\config) to use the generated SSH private key for our
       server(s).

? May we proceed? Yes
> ionic ssh generate "C:\Users\David Biggs\.ssh\ionic\856057_rsa"
[ERROR] Command not found: ssh
[WARN] OpenSSH not found on your computer.
[INFO] You will be prompted to provide a passphrase, which is used to protect your private key should you lose it. (If
       someone has your private key, they can impersonate you!) Passphrases are recommended, but not required.
'ssh-keygen' is not recognized as an internal or external command,
operable program or batch file.
[ERROR] Command not found: ssh-keygen
9

Right make that easy for yourself. Forget command prompt.

Use gitbash. You probably already have it if you have the git tools installed.

It’s an awesome cli and includes a raft of Linux commands out the box.

Try running the ionic commands with that.

10

Alright, I did as you said but I still get the following error:

David Biggs@DESKTOP-NKTO318 MINGW64 /c/myApp (master)
$ git push ionic master
/c/Users/David Biggs/.ssh/config line 3: garbage at end of line; "Biggs\\.ssh\\ionic\\856057_rsa".
fatal: Could not read from remote repository.

Please make sure you have the correct access rights
and the repository exists.
11

That’s a bit closer.

Is that with a brand New Ionic project? I notice the path is the same, myapp.

Can you try AGAIN? New Ionic project and all the other steps…

12

Still no dice with a test app. Seems like an SSH issue…

David Biggs@DESKTOP-NKTO318 MINGW64 /c/Test (master)
$ git push ionic master
/c/Users/David Biggs/.ssh/config line 3: garbage at end of line; "Biggs\\.ssh\\ionic\\856057_rsa".
fatal: Could not read from remote repository.

Please make sure you have the correct access rights
and the repository exists.
13

Rename the .ssh folder. Let it recreate.

Als make sure the git repo is set up correct.

/c/test folder.
git remote -r

14

Done. Check this out:

David Biggs@DESKTOP-NKTO318 MINGW64 /c
$ git remote -r
fatal: Not a git repository (or any of the parent directories): .git

EDIT: Ran that in the wrong folder. Here’s the output you asked for:

David Biggs@DESKTOP-NKTO318 MINGW64 /c/Test (master)
$ git remote -r
error: unknown switch `r'
usage: git remote [-v | --verbose]
   or: git remote add [-t <branch>] [-m <master>] [-f] [--tags | --no-tags] [--mirror=<fetch|push>] <name> <url>
   or: git remote rename <old> <new>
   or: git remote remove <name>
   or: git remote set-head <name> (-a | --auto | -d | --delete | <branch>)
   or: git remote [-v | --verbose] show [-n] <name>
   or: git remote prune [-n | --dry-run] <name>
   or: git remote [-v | --verbose] update [-p | --prune] [(<group> | <remote>)...]
   or: git remote set-branches [--add] <name> <branch>...
   or: git remote get-url [--push] [--all] <name>
   or: git remote set-url [--push] <name> <newurl> [<oldurl>]
   or: git remote set-url --add <name> <newurl>
   or: git remote set-url --delete <name> <url>

    -v, --verbose         be verbose; must be placed before a subcommand
15

Sorry I’m an idiot. Not r, v

16 
David Biggs@DESKTOP-NKTO318 MINGW64 /c/Test (master)
$ git remote -v
ionic   git@git.ionicjs.com:dgbiggs/test.git (fetch)
ionic   git@git.ionicjs.com:dgbiggs/test.git (push)
17

If you’ve renamed the ssh folder. Give it another try.

git push ionic master

18

Okay, I found out that the problem had to do with my “publickey” not being set up. I ran the command ionic login and it looks like it uploaded fine. Now I’m getting strange errors when running it in Ionic View, though… haha

19

Suspect you’re at a point you can make something happen now

20

Don’t forget to like or tick as a solution any of these posts