Ionic 3 Уникальный идентификатор устройства Отображается ошибка «сбой привязки к устройству» - PullRequest
0 голосов
/ 10 декабря 2018

В моем родном приложении Ionic3 я уже установил и настроил плагин уникального идентификатора устройства Ionic Native.Однако, когда я попытался войти в систему, используя мою учетную запись в социальной сети (например, Twitter), на экране появилось сообщение «Ошибка привязки к устройству».

pop up display to show unique device id plugin error

Моя версияуникального идентификатора устройства 1.3.2 на основе моего config.xml файла.

config.xml

<?xml version='1.0' encoding='utf-8'?>
<widget id="com.codelean.quickedit" version="0.0.1" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
    <name>Quickedit</name>
    <description />
    <author email="hi@ionicframework" href="http://ionicframework.com/">Ionic Framework Team</author>
    <content src="index.html" />
    <access origin="*" />
    <allow-intent href="http://*/*" />
    <allow-intent href="https://*/*" />
    <allow-intent href="tel:*" />
    <allow-intent href="sms:*" />
    <allow-intent href="mailto:*" />
    <allow-intent href="geo:*" />
    <allow-navigation href="mobilenotes://" />
    <preference name="ScrollEnabled" value="false" />
    <preference name="android-minSdkVersion" value="19" />
    <preference name="BackupWebStorage" value="none" />
    <preference name="SplashMaintainAspectRatio" value="true" />
    <preference name="FadeSplashScreenDuration" value="300" />
    <preference name="SplashShowOnlyFirstTime" value="false" />
    <preference name="SplashScreen" value="screen" />
    <preference name="SplashScreenDelay" value="3000" />
    <platform name="android">
        <allow-intent href="market:*" />
        <icon density="ldpi" src="resources/android/icon/drawable-ldpi-icon.png" />
        <icon density="mdpi" src="resources/android/icon/drawable-mdpi-icon.png" />
        <icon density="hdpi" src="resources/android/icon/drawable-hdpi-icon.png" />
        <icon density="xhdpi" src="resources/android/icon/drawable-xhdpi-icon.png" />
        <icon density="xxhdpi" src="resources/android/icon/drawable-xxhdpi-icon.png" />
        <icon density="xxxhdpi" src="resources/android/icon/drawable-xxxhdpi-icon.png" />
        <splash density="land-ldpi" src="resources/android/splash/drawable-land-ldpi-screen.png" />
        <splash density="land-mdpi" src="resources/android/splash/drawable-land-mdpi-screen.png" />
        <splash density="land-hdpi" src="resources/android/splash/drawable-land-hdpi-screen.png" />
        <splash density="land-xhdpi" src="resources/android/splash/drawable-land-xhdpi-screen.png" />
        <splash density="land-xxhdpi" src="resources/android/splash/drawable-land-xxhdpi-screen.png" />
        <splash density="land-xxxhdpi" src="resources/android/splash/drawable-land-xxxhdpi-screen.png" />
        <splash density="port-ldpi" src="resources/android/splash/drawable-port-ldpi-screen.png" />
        <splash density="port-mdpi" src="resources/android/splash/drawable-port-mdpi-screen.png" />
        <splash density="port-hdpi" src="resources/android/splash/drawable-port-hdpi-screen.png" />
        <splash density="port-xhdpi" src="resources/android/splash/drawable-port-xhdpi-screen.png" />
        <splash density="port-xxhdpi" src="resources/android/splash/drawable-port-xxhdpi-screen.png" />
        <splash density="port-xxxhdpi" src="resources/android/splash/drawable-port-xxxhdpi-screen.png" />
    </platform>
    <platform name="ios">
        <allow-intent href="itms:*" />
        <allow-intent href="itms-apps:*" />
        <icon height="57" src="resources/ios/icon/icon.png" width="57" />
        <icon height="114" src="resources/ios/icon/icon@2x.png" width="114" />
        <icon height="40" src="resources/ios/icon/icon-40.png" width="40" />
        <icon height="80" src="resources/ios/icon/icon-40@2x.png" width="80" />
        <icon height="120" src="resources/ios/icon/icon-40@3x.png" width="120" />
        <icon height="50" src="resources/ios/icon/icon-50.png" width="50" />
        <icon height="100" src="resources/ios/icon/icon-50@2x.png" width="100" />
        <icon height="60" src="resources/ios/icon/icon-60.png" width="60" />
        <icon height="120" src="resources/ios/icon/icon-60@2x.png" width="120" />
        <icon height="180" src="resources/ios/icon/icon-60@3x.png" width="180" />
        <icon height="72" src="resources/ios/icon/icon-72.png" width="72" />
        <icon height="144" src="resources/ios/icon/icon-72@2x.png" width="144" />
        <icon height="76" src="resources/ios/icon/icon-76.png" width="76" />
        <icon height="152" src="resources/ios/icon/icon-76@2x.png" width="152" />
        <icon height="167" src="resources/ios/icon/icon-83.5@2x.png" width="167" />
        <icon height="29" src="resources/ios/icon/icon-small.png" width="29" />
        <icon height="58" src="resources/ios/icon/icon-small@2x.png" width="58" />
        <icon height="87" src="resources/ios/icon/icon-small@3x.png" width="87" />
        <icon height="1024" src="resources/ios/icon/icon-1024.png" width="1024" />
        <splash height="1136" src="resources/ios/splash/Default-568h@2x~iphone.png" width="640" />
        <splash height="1334" src="resources/ios/splash/Default-667h.png" width="750" />
        <splash height="2208" src="resources/ios/splash/Default-736h.png" width="1242" />
        <splash height="1242" src="resources/ios/splash/Default-Landscape-736h.png" width="2208" />
        <splash height="1536" src="resources/ios/splash/Default-Landscape@2x~ipad.png" width="2048" />
        <splash height="2048" src="resources/ios/splash/Default-Landscape@~ipadpro.png" width="2732" />
        <splash height="768" src="resources/ios/splash/Default-Landscape~ipad.png" width="1024" />
        <splash height="2048" src="resources/ios/splash/Default-Portrait@2x~ipad.png" width="1536" />
        <splash height="2732" src="resources/ios/splash/Default-Portrait@~ipadpro.png" width="2048" />
        <splash height="1024" src="resources/ios/splash/Default-Portrait~ipad.png" width="768" />
        <splash height="960" src="resources/ios/splash/Default@2x~iphone.png" width="640" />
        <splash height="480" src="resources/ios/splash/Default~iphone.png" width="320" />
        <splash height="2732" src="resources/ios/splash/Default@2x~universal~anyany.png" width="2732" />
    </platform>
    <plugin name="cordova-plugin-advanced-http" spec="2.0.1" />
    <plugin name="twitter-connect-plugin" spec="git+https://github.com/chroa/twitter-connect-plugin.git">
        <variable name="FABRIC_KEY" value="a4387287f874e396294c0bf5186ee1bdfee00cd1" />
        <variable name="TWITTER_KEY" value="(twitter key here)" />
        <variable name="TWITTER_SECRET" value="(twitter secret here)" />
    </plugin>
    <plugin name="cordova-plugin-x-socialsharing" spec="5.4.1" />
    <plugin name="cordova-plugin-whitelist" spec="^1.3.3" />
    <plugin name="cordova-plugin-statusbar" spec="^2.4.2" />
    <plugin name="cordova-plugin-splashscreen" spec="^5.0.2" />
    <plugin name="cordova-plugin-ionic-webview" spec="^2.2.5">
        <variable name="ANDROID_SUPPORT_ANNOTATIONS_VERSION" value="27.+" />
    </plugin>
    <plugin name="cordova-plugin-ionic-keyboard" spec="^2.1.3" />
    <plugin name="cordova-clipboard" spec="^1.2.1" />
    <plugin name="cordova-plugin-uniquedeviceid" spec="^1.3.2" />
    <plugin name="cordova-plugin-screen-orientation" spec="3.0.1" />
    <plugin name="cordova-plugin-telerik-imagepicker" spec="2.2.2">
        <variable name="PHOTO_LIBRARY_USAGE_DESCRIPTION" value="your usage message" />
    </plugin>
    <plugin name="cordova-plugin-camera" spec="4.0.3" />
    <plugin name="com.lampa.startapp" spec="6.1.6" />
    <plugin name="cordova-plugin-file" spec="^6.0.1" />
    <plugin name="cordova-plugin-crop" spec="0.4.0" />
    <plugin name="com.telerik.plugins.nativepagetransitions" spec="0.6.5" />
    <plugin name="cordova-plugin-device" spec="^2.0.2" />
    <plugin name="com.paypal.cordova.mobilesdk" spec="3.5.0" />
    <engine name="android" spec="7.1.2" />
    <engine name="ios" spec="4.5.5" />
</widget>

И я уже поставилэтот плагин в мой app.module.ts файл.

app.module.ts

import { BrowserModule } from '@angular/platform-browser';
import { ErrorHandler, NgModule } from '@angular/core';
import { IonicApp, IonicErrorHandler, IonicModule } from 'ionic-angular';
import { SplashScreen } from '@ionic-native/splash-screen';
import { StatusBar } from '@ionic-native/status-bar';

import { MyApp } from './app.component';

import { HomePage } from '../pages/home/home';
import { LoadingPage } from '../pages/loading/loading';
import { LoginPage } from '../pages/login/login';
import { RegisterUserPage } from '../pages/register-user/register-user';
import { RecoverPasswordPage } from '../pages/recover-password/recover-password';
import { DashboardPage } from '../pages/dashboard/dashboard';
import { BuyWordsPage } from '../pages/buy-words/buy-words';
import { NewOrderPage } from '../pages/new-order/new-order';
import { ProfilePage } from '../pages/profile/profile';
import { NotificationSettingPage } from '../pages/notification-setting/notification-setting';
import { SocialNetworksPage } from '../pages/social-networks/social-networks';
import { MenuPage } from '../pages/menu/menu';
import { OrderHistoryPage } from '../pages/order-history/order-history';
import { PaymentHistoryPage } from '../pages/payment-history/payment-history';
import { ViewOrderPage } from '../pages/view-order/view-order';
import { HTTP } from '@ionic-native/http';
import { Clipboard } from '@ionic-native/clipboard';
import { UniqueDeviceID } from '@ionic-native/unique-device-id';
import { TwitterConnect } from '@ionic-native/twitter-connect';
import { SocialSharing } from '@ionic-native/social-sharing';
import { SuperTabsModule } from 'ionic2-super-tabs';
import { ApiProvider } from '../providers/api/api';
import { ImagePicker } from '@ionic-native/image-picker';
import { Camera, CameraOptions } from '@ionic-native/camera';
import { Crop } from '@ionic-native/crop';
import { File } from '@ionic-native/file';
//import { ScreenOrientation } from '@ionic-native/screen-orientation';
import { PayPal, PayPalPayment, PayPalConfiguration } from '@ionic-native/paypal';
import { Device } from '@ionic-native/device';

@NgModule({
    declarations: [
        MyApp,
        HomePage,
        LoadingPage,
        LoginPage,
        RegisterUserPage,
        RecoverPasswordPage,
        DashboardPage,
        BuyWordsPage,
        NewOrderPage,
        ProfilePage,
        NotificationSettingPage,
        SocialNetworksPage,
        MenuPage,
        OrderHistoryPage,
        PaymentHistoryPage,
        ViewOrderPage
    ],
    imports: [
        BrowserModule,
        IonicModule.forRoot(MyApp, {
            tabsPlacement: 'top'
        }),
        SuperTabsModule
    ],
    bootstrap: [IonicApp],
    entryComponents: [
        MyApp,
        HomePage,
        LoadingPage,
        LoginPage,
        RegisterUserPage,
        RecoverPasswordPage,
        DashboardPage,
        BuyWordsPage,
        NewOrderPage,
        ProfilePage,
        NotificationSettingPage,
        SocialNetworksPage,
        MenuPage,
        OrderHistoryPage,
        PaymentHistoryPage,
        ViewOrderPage
    ],
    providers: [
        StatusBar,
        SplashScreen,
        HTTP,
        Clipboard,
        UniqueDeviceID,
        TwitterConnect,
        SocialSharing,
        ApiProvider,
        PayPal,
        ImagePicker,
        Camera, 

        Device,

        Crop,
        File,

        //ScreenOrientation,

        {provide: ErrorHandler, useClass: IonicErrorHandler}
    ]
})
export class AppModule {}

login.ts

import { Component } from '@angular/core';
import { IonicPage, 
        NavController, 
        NavParams,
        AlertController,
        ToastController } from 'ionic-angular';

import { RecoverPasswordPage } from '../recover-password/recover-password';
import { RegisterUserPage } from '../register-user/register-user';
import { DashboardPage } from '../dashboard/dashboard';

import { UniqueDeviceID } from '@ionic-native/unique-device-id';
import { TwitterConnect } from '@ionic-native/twitter-connect';
import { HomePage } from '../../pages/home/home';
import { ApiProvider } from '../../providers/api/api';

/**
* Generated class for the LoginPage page.
*
* See https://ionicframework.com/docs/components/#navigation for more info on
* Ionic pages and navigation.
*/

@IonicPage()
@Component({
    selector: 'page-login',
    templateUrl: 'login.html',
})
export class LoginPage {

    //initialize api variables as empty value 
    grant_type = '';
    email = '';
    password = '';
    deviceId = '';
    login_type = '';
    network_name = '';
    network_id = '';
    scope = '';
    uuid = '';

    constructor(public navCtrl: NavController, 
                public navParams: NavParams,
                public alertCtrl: AlertController,
                public toast: ToastController,
                public quickeApi: ApiProvider,
                private twitter: TwitterConnect,
                private uniqueDeviceID: UniqueDeviceID) {

    }

    ionViewDidLoad() {
        console.log('ionViewDidLoad LoginPage');
    }

    ionViewWillEnter() {
        var handleDevIdSuccess = (uuid) => {
            this.deviceId = uuid;
        };

        var handleDevIdFailure = (error) => {
            this.alertCtrl.create({
                title: 'ALERT',
                subTitle: 'Error with Device ID',
                buttons: ['Dismiss']
            }).present();
        };

        this.uniqueDeviceID.get().then(handleDevIdSuccess).catch(handleDevIdFailure);
    }

    loginTw() { //twitter log in
        this.grant_type = 'password';
        this.network_name = 'twitter';
        this.login_type = 'network';
        this.scope = '*';
        var onNetworkLoginSuccess = (response) => {
            var result = JSON.parse(response.data);

            // show alert if there is an error
            if(result.errors.length !== 0)
            {
                this.alertCtrl.create({
                    title: 'ALERT',
                    subTitle: result.errors.join('. '),
                    buttons: ['Dismiss']
                }).present();
                return;
            }
            this.toast.create({
                message: 'Log In Successful!',
                duration: 3000,
                position: 'bottom'
            }).present();
            // save the access token and then go to home page
            this.quickeApi.setTokenType(result.token_type);
            this.quickeApi.setAccessToken(result.access_token);
            //this.navCtrl.push(DashboardPage);
            this.navCtrl.push(HomePage);
            return;
        };

        var onNetworkLoginFailure = (error) => {
            this.alertCtrl.create({
                title: 'ALERT',
                subTitle: 'Twitter Login Failed',
                buttons: ['Dismiss']
            }).present();


        };

        var onTwSuccess = (response) => {
            var data = {
                'grant_type' : this.grant_type,
                'client_id' : this.quickeApi.getClientId(),
                'client_secret' :  this.quickeApi.getClientSecret(),
                'network_name' : this.network_name,
                'network_id' : response.userName,
                'scope' : this.scope,
                'uuid' : this.deviceId,
                'login_type' : this.login_type
            };

            this.quickeApi.login(data, onNetworkLoginSuccess, onNetworkLoginFailure);
        };

        var onTwError = (error) => {
            this.alertCtrl.create({
                title: 'ALERT',
                subTitle: 'Twitter login failed. Please install the twitter app and login with your account.',
                buttons: ['Dismiss']
            }).present();
        };

        this.twitter.login().then(onTwSuccess, onTwError);
    }

    loginGp() {
    }

    loginFb() {
    }

    register() {
        this.navCtrl.push(RegisterUserPage);
    }

    recoverPassword() {
        this.navCtrl.push(RecoverPasswordPage);
    }

    login() {
        this.grant_type = 'password';
        this.login_type = 'email';
        this.scope = '*';
        var data = {
            'grant_type' : this.grant_type,
            'client_id' : this.quickeApi.getClientId(),
            'client_secret' :  this.quickeApi.getClientSecret(),
            'email' : this.email,
            'password' : this.password,
            'scope' : this.scope,
            'uuid' : this.deviceId,
            'login_type' : this.login_type
        };

        var onLoginSuccess = (response) => {
            var result = JSON.parse(response.data);

            // show alert if there is an error
            if(result.errors.length !== 0)
            {
                this.alertCtrl.create({
                    title: 'ALERT',
                    subTitle: result.errors.join('. '),
                    buttons: ['Dismiss']
                }).present();
                return;
            }
            this.toast.create({
                message: 'Log In Successful!',
                duration: 3000,
                position: 'bottom'
            }).present();
            // save the access token and then go to home page
            this.quickeApi.setTokenType(result.token_type);
            this.quickeApi.setAccessToken(result.access_token);
            //this.navCtrl.push(DashboardPage);
            this.navCtrl.push(HomePage);
            return;
        };

        var onLoginError = (error) => {
            this.alertCtrl.create({
                title: 'ALERT',
                subTitle: 'Cannot Log In',
                buttons: ['Dismiss']
            }).present();
        };

        this.quickeApi.login(data, onLoginSuccess, onLoginError); //call API to user log in
    }
}
...