capacitor-community / generic-oauth2

Generic Capacitor OAuth 2 client plugin. Stop the war in Ukraine!

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Navigation is Unreachable

ananthakrish98 opened this issue · comments

commented

###Navigation is Unreachable warning

Capacitor version:

 @capacitor/ios: not installed
  @capacitor/cli: 4.1.0        
  @capacitor/android: 4.1.0    
  @capacitor/core: 4.1.0    ```

### Library version:
<!-- Please remove all items that are not relevant. -->

- 3.0.1
- 2.1.0
- 2.0.0
- other: (Please fill in the version you are using.)

### OAuth Provider:

- Azure AD (B2C)

### Your Plugin Configuration
oauth2Options = {
appId: 'XXXXXXXXXXXXXXXXX',
authorizationBaseUrl: 'https://login.microsoftonline.com/xxxxxxxx/oauth2/v2.0/authorize',
accessTokenEndpoint: 'https://login.microsoftonline.com/xxxxxxxx/oauth2/v2.0/token',
scope: 'https://graph.microsoft.com/User.Read',
resourceUrl: "https://graph.microsoft.com/v1.0/me/",
pkceEnabled: true,
logsEnabled: true,
responseType: 'code',

web: {

  redirectUrl: 'http://localhost:8100/login',
  windowOptions: "height=600,left=0,top=0",
},
android: {


  redirectUrl: 'msauth://com.sxxx.xxxxxsb/xxxZydORfyjxxxx',

 
},
ios: {
  pkceEnabled: true,
  responseType: 'code',
  redirectUrl: 'msauth://com.sxxx.xxxxxsb/xxxZydORfyjxxxx',
  accessTokenEndpoint: 'https://login.microsoftonline.com/xxxxxxxx/oauth2/v2.0/token',
}
};

```typescript
import { Component, OnInit } from '@angular/core';
import { LoadingController, ModalController, NavController, Platform, ToastController } from '@ionic/angular';
import { SignupPage } from '../signup/signup.page';
import { FormGroup, FormControl, Validators } from '@angular/forms';
import { LoginService } from '../Service/login.service';
import { ActivatedRoute, Router } from '@angular/router';
import { fromEvent, Subject, Subscription } from 'rxjs';
import { environment } from 'src/environments/environment';
import { DeviceDetectorService } from 'ngx-device-detector';
import { first } from 'rxjs/operators';
import { GoogleAuth } from '@codetrix-studio/capacitor-google-auth';
import { isPlatform } from '@ionic/angular';

import { OAuth2AuthenticateOptions, OAuth2Client } from "@byteowls/capacitor-oauth2";

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


  oauth2Options = {
    appId: 'xxxxxxxxx-xxxxxxxxx-xxxxxx',
    authorizationBaseUrl: 'https://login.microsoftonline.com/xxxxxxxxxxxxxxxxxxxxxxxx/oauth2/v2.0/authorize',
    accessTokenEndpoint: 'https://login.microsoftonline.com/xxxxxxxxxxxxxxxxxxxxxxxxx/oauth2/v2.0/token',
    scope: 'https://graph.microsoft.com/User.Read',
    resourceUrl: "https://graph.microsoft.com/v1.0/me/",
    pkceEnabled: true,
    logsEnabled: true,
    responseType: 'code',


    web: {
      redirectUrl: 'http://localhost:8100/login',
      windowOptions: "height=600,left=0,top=0",
    },
    android: {

      redirectUrl: 'msauth://com.xxxxxx.xxxxxx/xxxxxxxxx',

     
    },
    ios: {
      pkceEnabled: true,
      redirectUrl: 'com.stream.skalablesb',
    }
  };

 



  authenticateModel: AuthenticateModel = new AuthenticateModel();
  private backbuttonSubscription: Subscription;

  constructor(
    public modalCtrl: ModalController,
    public loginService: LoginService,
    public loadingController: LoadingController,
    private _deviceService: DeviceDetectorService,
    private _accountService: AccountServiceProxy,
    private _tokenAuthService: TokenAuthServiceProxy,
    private toastController: ToastController,
    private loadingCtrl: LoadingController,
    private googlePlus: GooglePlus,
    private _expenseService: ExpenseServiceProxy,
    private _NavController: NavController,
    private _router:Router,
    private platform: Platform) {
  


  }

 
  ngOnInit() {
  
   
  }

  
  


 
 






  async oauth() {
    const loading = await this.loadingCtrl.create({
      message: 'Logging in with microsoft...',
      duration: 0,
      cssClass: 'custom-loading'
    });

    loading.present();
    OAuth2Client.authenticate(this.oauth2Options).then(response => {
      localStorage.setItem("ismicrosoftlogin", 'true');
      // const accessToken = response['access_token'];
      // console.log('decoded', JSON.stringify(this.parseJwt(accessToken)));
      var email=response.userPrincipalName;     
    })

      

      // go to backend
    }).catch(reason => {
      loading.dismiss();
      console.log(reason);
      console.error('OAuth rejected', reason);
    });
  }


}





Affected Platform(s):

  • Android
    • Version/API Level:
    • Device Model:
    • Content of your AndroidManifest.xml
<application android:allowBackup="true" android:icon="@mipmap/ic_launcher" android:label="@string/app_name" android:roundIcon="@mipmap/ic_launcher_round" android:supportsRtl="true" android:theme="@style/AppTheme">

    <activity android:configChanges="orientation|keyboardHidden|keyboard|screenSize|locale|smallestScreenSize|screenLayout|uiMode" android:name="xxx.xxxxx.xxxxx.MainActivity" android:label="@string/title_activity_main" android:theme="@style/AppTheme.NoActionBarLaunch" android:launchMode="singleTask" android:exported="true">

        <intent-filter>
            <action android:name="android.intent.action.MAIN" />
            <category android:name="android.intent.category.LAUNCHER" />
        </intent-filter>
        <intent-filter>
            <action android:name="android.intent.action.VIEW" />
            <category android:name="android.intent.category.DEFAULT" />
            <category android:name="android.intent.category.BROWSABLE" />
            <data android:scheme="@string/custom_url_scheme" android:host="oauth" />
        </intent-filter>

    </activity>

    <provider android:name="androidx.core.content.FileProvider" android:authorities="${applicationId}.fileprovider" android:exported="false" android:grantUriPermissions="true">
        <meta-data android:name="android.support.FILE_PROVIDER_PATHS" android:resource="@xml/file_paths"></meta-data>
    </provider>
</application>

<!-- Permissions -->

<uses-permission android:name="android.permission.INTERNET" />
``` File attached is debugging of the android app in chrome inspect

screenshot

  • Web
    • Browser:
commented

So basically i have missed adding the activity part in AndroidManifest.xml

**





  <intent-filter>
    <action android:name="android.intent.action.VIEW" />
    <category android:name="android.intent.category.DEFAULT" />
    <category android:name="android.intent.category.BROWSABLE" />
    <data android:scheme="@string/azure_b2c_scheme" android:host="@string/package_name" android:path="@string/azure_b2c_signature_hash" />
  </intent-filter>
</activity>**

After adding above part , navigation is redirecting back to app after authentication