Wifiwizard is added to my config and package.json file but I can't find the import in my module.ts file

Question

Wifiwizard is added to my config and package.json file but I can't find the import in my module.ts file

nathancriel opened this issue 5 years ago · comments

nathan.criel commented 5 years ago

Prerequisites

Check all boxes if you have done the following:

Checked that your issue isn't already filed: https://github.com/tripflex/wifiwizard2/issues
Make sure you fill out the Issue Type below

Issue type

Select all that apply

Description

I'm using ionic framework. When I want to install the wifiwizard2 plugin I get no errors but i'm not able to use the plugin. The wifiwizard is added to my config and package.json file but I can't find the import in my module.ts file. Thanks in advance.

Steps to Reproduce

run sudo cordova plugin add https://github.com/tripflex/wifiwizard2
run sudo npm i cordova-plugin-wifiwizard2 or sudo ionic cordova plugin add cordova-plugin-wifiwizard2
[and so on...]

Expected behavior: Use the plugin

Actual behavior: cannot find import

Reproduces how often: 100%

Versions

Ionic:

ionic (Ionic CLI) : 4.10.3 (/usr/local/lib/node_modules/ionic)
Ionic Framework : @ionic/angular 4.1.1
@angular-devkit/build-angular : 0.13.6
@angular-devkit/schematics : 7.2.4
@angular/cli : 7.3.6
@ionic/angular-toolkit : 1.4.0

Cordova:

cordova (Cordova CLI) : 8.1.2 (cordova-lib@8.1.1)
Cordova Platforms : android 7.1.4
Cordova Plugins : cordova-plugin-ionic-keyboard 2.1.3, cordova-plugin-ionic-webview 3.1.2, (and 4 other plugins)

System:

Android SDK Tools : 26.1.1 (/Users/nathancriel/Library/Android/sdk)
NodeJS : v10.15.1 (/usr/local/bin/node)
npm : 6.7.0
OS : macOS Mojave
Xcode : Xcode 10.1 Build version 10B61

Additional Information

config.xml
<plugin name="wifiwizard2" spec="git+https://github.com/tripflex/wifiwizard2.git" /

package.json
dependencies "cordova-plugin-wifiwizard2": "git+https://github.com/tripflex/wifiwizard2.git",

Yossi Neiman · Answer 1 · Tue Mar 26 2019 14:59:35 GMT+0800 (China Standard Time)

This plugin does not have @ionic/native typings (yet), in order to use it add this to just below your import list on your service:

declare var WifiWizard2: any;

and then use the WifiWizard2 to invoke the function.

nathan.criel · Answer 2 · Tue Mar 26 2019 16:21:03 GMT+0800 (China Standard Time)

I get: WifiWizard2 is not defined.

nathan.criel · Answer 3 · Tue Mar 26 2019 16:44:39 GMT+0800 (China Standard Time)

i started a blank project and is still not working:
this is my tab1.page.ts:
import { Component } from '@angular/core'; import { Platform } from '@ionic/angular';


declare var wifiwizard2: any;
@Component({

selector: 'app-tab1',

templateUrl: 'tab1.page.html',

styleUrls: ['tab1.page.scss']

})
export class Tab1Page {

constructor (

private plt: Platform,
) {

this.plt.ready().then(() => {

this.getSSID();

});

}

getSSID() { console.log(wifiwizard2.getConnectedSSID()); } }

commands:
cordova plugin cordova-plugin-wifiwizard2
npm i cordova-plugin-wifiwizard2

wifiwizard is in my list of cordova plugins
wifiwizard is in my config.xml file
wifiwizard is in package.json

Yossi Neiman · Answer 4 · Tue Mar 26 2019 17:34:50 GMT+0800 (China Standard Time)

Try to use WifiWizard2 with capital W [Exactly as mentioned in my post]

nathan.criel · Answer 5 · Tue Mar 26 2019 18:48:57 GMT+0800 (China Standard Time)

Still the same reference error. I tried all combinations.

Yossi Neiman · Answer 6 · Tue Mar 26 2019 18:54:04 GMT+0800 (China Standard Time)

Try this :
declare var window: any;

window.WifiWizard2

If that's doesn't work paste your code here.

nathan.criel · Answer 7 · Tue Mar 26 2019 18:59:19 GMT+0800 (China Standard Time)

`import { Component } from '@angular/core';
import { Platform } from '@ionic/angular';

// declare var WifiWizard2: any;
declare var window: any;

@component({
selector: 'app-tab1',
templateUrl: 'tab1.page.html',
styleUrls: ['tab1.page.scss']
})

export class Tab1Page {
constructor(
private plt: Platform) {
this.plt.ready().then(() => {

  window.WifiWizard2.getConnectedSSID();
});

}
}
`
still error: Cannot read property 'getConnectedSSID' of undefined

Yossi Neiman · Answer 8 · Tue Mar 26 2019 19:00:18 GMT+0800 (China Standard Time)

Are you sure the plugin is installed?
Show me your log for:
console.log(window)

nathan.criel · Answer 9 · Tue Mar 26 2019 19:04:26 GMT+0800 (China Standard Time)

when i run: sudo cordova plugin ls
cordova-plugin-device 2.0.2 "Device"
cordova-plugin-ionic-keyboard 2.1.3 "cordova-plugin-ionic-keyboard"
cordova-plugin-ionic-webview 3.1.2 "cordova-plugin-ionic-webview"
cordova-plugin-splashscreen 5.0.2 "Splashscreen"
cordova-plugin-statusbar 2.4.2 "StatusBar"
cordova-plugin-whitelist 1.3.3 "Whitelist"
es6-promise-plugin 4.1.0 "Promise"
wifiwizard2 3.1.0 "WifiWizard2"

Angelo Fan · Answer 10 · Tue Mar 26 2019 19:23:40 GMT+0800 (China Standard Time)

@Crielz
Now I write my code here, I hope I can help you.

//Introducing wifi management dependencies
declare var WifiWizard2: any;

doGetWifiSsid(){
  WifiWizard2.getConnectedSSID().then((ssid) => {
    console.log("Get ssid success: " + ssid);
  }).catch((err) => {
    console.log("Failed to get ssid, please check the error↓");
    console.error(err);
  });
}

Very happy to help anyone, good luck!

nathan.criel · Answer 11 · Tue Mar 26 2019 19:36:04 GMT+0800 (China Standard Time)

Still not able to fetch methods of the wifiwizard plugin. Anyone that would like to share a blank project with the working plugin?

Angelo Fan · Answer 12 · Tue Mar 26 2019 19:41:02 GMT+0800 (China Standard Time)

@Crielz
I have successfully run into my project, this plugin must be tested with real devices. Wait a moment, I will create a Demo project and push it to my repository. You can clone and run directly to see if it can succeed. I will reply you later, about an hour. I am going to work for this now.

nathan.criel · Answer 13 · Tue Mar 26 2019 19:52:56 GMT+0800 (China Standard Time)

I think something went wrong when you pushed your project. Only .gitignore and License files.

Yossi Neiman · Answer 14 · Tue Mar 26 2019 20:10:44 GMT+0800 (China Standard Time)

@Crielz are you testing this on a real device or in the browser??

Angelo Fan · Answer 15 · Tue Mar 26 2019 20:14:07 GMT+0800 (China Standard Time)

https://github.com/13546777510/WifiWizard2-Demo.git

It works perfectly

Angelo Fan · Answer 16 · Tue Mar 26 2019 20:27:58 GMT+0800 (China Standard Time)

home.ts


import { Component } from '@angular/core';

//Introducing wifi management dependencies
declare var WifiWizard2: any;

@Component({
  selector: 'app-home',
  templateUrl: 'home.page.html',
  styleUrls: ['home.page.scss'],
})
export class HomePage {

  public wifiSsid = 'Loading...';

  doGetWifiSsid(){
    WifiWizard2.getConnectedSSID().then((ssid) => {
      console.log("Get ssid success: " + ssid);
      this.wifiSsid = ssid;
    }).catch((err) => {
      console.log("Failed to get ssid, please check the error↓");
      console.error(err);
    });
  }

}

home.html

<ion-header>
  <ion-toolbar>
    <ion-title>
      WifiWizard2-Demo
    </ion-title>
  </ion-toolbar>
</ion-header>

<ion-content>
  <div class="ion-padding">
    <p>This is to test the operation of the WifiWizard2 plugin.</p>
    <ion-input [(ngModel)]="wifiSsid" disabled></ion-input>
    <ion-button expand="full" (click)="doGetWifiSsid()">Get Wifi Ssid</ion-button>
  </div>
</ion-content>

In addition, you need to pay attention to:

Android 8.0 or higher needs to enable location authorization to obtain WiFi information, otherwise it returns <unknown ssid>, because we can judge the user's location from wifi information.
this plugin can only be used on real devices, such as Android or iOS, the browser can not use this plugin

The method I am working on:

create an ionic project
ionic cordova plugin add https://github.com/tripflex/WifiWizard2.git
write the code, you can refer to the Demo
Create an Android project:
ionic cordova prepare android
Enter y when prompted to install
open with Android studio
test/platforms/android
Compile your project and run it on your Android device.

good luck

nathan.criel · Answer 17 · Tue Mar 26 2019 20:49:05 GMT+0800 (China Standard Time)

When i run your project on an android device it works! thanks a lot for that.
But when i call the method in my browser i get the same reference error. Wifiwizard2 is not defined. Is this normal?

Angelo Fan · Answer 18 · Tue Mar 26 2019 20:50:48 GMT+0800 (China Standard Time)

@Crielz
I am very happy to help you.
This is normal, because this plugin can't be run in the browser. To use this function, you must run it on the device, such as Android or iOS.

nathan.criel · Answer 19 · Tue Mar 26 2019 21:06:39 GMT+0800 (China Standard Time)

Thanks a lot! @13546777510 and @saoron

Raman Raja · Answer 20 · Sun Jul 17 2022 20:43:05 GMT+0800 (China Standard Time)

The link
https://github.com/13546777510/WifiWizard2-Demo.git
appears to be stale. Can you please refresh it? Thanks.

Robson Xavier · Answer 21 · Fri Apr 14 2023 03:37:09 GMT+0800 (China Standard Time)

The link
https://github.com/13546777510/WifiWizard2-Demo.git
appears to be stale. Can you please refresh it? Thanks.

Does anyone have this example?

Raman Raja · Answer 22 · Mon May 01 2023 16:24:06 GMT+0800 (China Standard Time)

Is this the one you are looking for?
https://github.com/tripflex/WifiWizard2