TCP requests in Ionic 3

Ionic Framework ionic-v3
1

I’m writing an Ionic app that interfaces with a GPS device (via Wifi) and needs to communicate with the device using TCP. All the searching I have done has pointed me towards this repo: https://github.com/KoenLav/cordova-plugin-chrome-apps-sockets-tcp

Unfortunately, using Ionic 3, I am not able to get the plugin to show up on the window object. Example:

// chrome is undefined (window).chrome.tcp.socket.create();

I’ve tried declaring window.chrome in the app.module, but the plugin code is never added to window.chrome object.

Any suggestions?

2

you need to use the platform.ready() function to know if the cordova plugins are ready to be used

see here

[TCP sockets in ionic]

3

@sdetweil, yep I have done that - no luck.

4

and waited for the ‘cordova’ ready notice? I didn’t wait for that the first time.
oh, and if for android there is a bug …

I also had to change

node_modules/@ionic/app-scripts/dist/dev-server/serve-config.js like this

exports.ANDROID_PLATFORM_PATH = path.join('platforms', 'android', **'app/src/main',**'assets', 'www');

note the added ‘app/src/main’,

without that my android app could not use the chrome cordova plugins

from here

my app worked on ios just fine, not android

5

Yep:
image

6

Thanks @sdetweil, do I need to manually import any JS code? All I did was the following steps. I’m guessing I missed something:

// 1) Add plugin.
cordova plugin add cordova-plugin-chrome-apps-sockets-tcp

// 2) Use the plugin.
    this.platform.ready()
      .then((readySource) => {
        if (readySource == 'cordova') {
          // This will throw an error (chrome is undefined)
          (<any>window).chrome.tcp.socket.create();
        }
      });

Do I need to include any JS code from plugin? I assumed it automatically got added but I’m not familiar enough with Cordova to understand the whole process.

Thanks for the help!

7

you need to edit the file i referenced, and ADD some text to the android line

note the added ‘app/src/main’,

the ionic runtime forgot to call the app startup code.

8

I’m actually only interested in running this on iOS.

9

Are you using MobileChromeApps or KoenLav repository?

…Or…

10

MobileChromeApps version

11

@sdetweil, you mind taking a look at my sample project:
https://github.com/rustygreen/ionic-tcp-example

20180214_165330
20180214_165330.jpg3024×4032 1.38 MB

Thanks for the help!

12

looking, will let you know

13

Ok, i did the following

1 did a git pull on your repo
2. cd to that folder
3. npm i
4. ionic cordova platform add ios
5. used xcode to turn on app signing

the api is chrome.sockets.tcp, NOT chrome.tcp.socket

  1. changed your code
a(line 36)  if (!win.chrome  && !win.chrome.sockets) {
b(line 41) (<any>window).chrome.sockets.tcp.create

now works ok.

i use this to build it on my mac and it on my ipad

ionic cordova run ios -l -c -s
14

Hmm…strange - I wonder if this is a problem with Ionic pro build then. Even with those changes I still get the an error (window.chrome.sockets is undefined). I am building it through Ionic Pro and then distributing it to my iPad using Ionic View.

@sdetweil, if you have a chance could you try running the app in Ionic View? The App ID is: fa29551e

Here’s the error I get with the changes you recommended applied:
image

15

I am fairly sure that sockets plugin is not available in ionic view

Neither chrome sockets

16

the list of supported plugins in Ionic Pro/view is here

17

Thanks @sdetweil and @Tommertom, I did not realize their was a limitation on plugin usage in Ionic View. Does anyone know why their is a limitation? Or if that will change? I would like to use Ionic View, but it’s looking like that may not be an option?

18

that page has a link to support, where u may be able to get some answers

19

u r not the first to wonder how to get plugins in ionic view (or devapp)

ionic is closed source and the ionic company decides what to implement or not

support is the entry point for clarification, but I bet TCP isn’t high on their list