Flutter: Oauth2 - Problems with redirect uri - flutter

Question

I want to set up the oAuth authentication of the Spotify API in my Flutter app. I chose the flutter_web_auth 0.1.1 package.
So far, I have managed that the user can log in to Spotify. After logging in, the user should be redirected back to my app. That does not work. Spotify always redirects the user to another website and not back to the app. How do I close the WebView after the user logging in and redirect the user to my app?
import 'package:flutter/material.dart';
import 'package:flutter_web_auth/flutter_web_auth.dart';
void main() => runApp(MyApp());
class MyApp extends StatefulWidget {
#override
_MyAppState createState() => _MyAppState();
}
class _MyAppState extends State<MyApp> {
#override
void initState() {
super.initState();
authenticate();
}
void authenticate() async {
// Present the dialog to the user
final result = await FlutterWebAuth.authenticate(
url:
"https://accounts.spotify.com/de/authorize?client_id=78ca499b2577406ba7c364d1682b4a6c&response_type=code&redirect_uri=https://partyai/callback&scope=user-read-private%20user-read-email&state=34fFs29kd09",
callbackUrlScheme: "https://partyai/callback",
);
// Extract token from resulting url
final token = Uri.parse(result).queryParameters['token'];
print('token');
print(token);
}
#override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
appBar: AppBar(
title: const Text('Web Auth example'),
),
body: Center(
child: Text(
'test',
),
),
),
);
}
}
android/app/src/main/AndroidManifest.xml
<activity android:name="com.linusu.flutter_web_auth.CallbackActivity" >
<intent-filter android:label="flutter_web_auth">
<action android:name="android.intent.action.VIEW" />
<category android:name="android.intent.category.DEFAULT" />
<category android:name="android.intent.category.BROWSABLE" />
<data android:scheme="https://partyai/callback" />
</intent-filter>
</activity>
enter image description here

Answer 1

The callbackUrlScheme should be partyai, the redirect_uri should be partyai:/ and the AndroidManifest.xml android:scheme value should be partyai.

Answer 2

Use this code
void authenticate() async {
// Present the dialog to the user
final result = await FlutterWebAuth.authenticate(
url:
"https://accounts.spotify.com/authorize?client_id=xxxxxxxxxxxxxxxxxxxxxxxxxxxxx&redirect_uri=yourname:/&scope=user-read-currently-playing&response_type=token&state=123",
callbackUrlScheme: "yourname",
);
// Extract token from resulting url
final token = Uri.parse(result);
String at = token.fragment;
at = "http://website/index.html?$at"; // Just for easy persing
var accesstoken = Uri.parse(at).queryParameters['access_token'];
print('token');
print(accesstoken);
}
Add to AndroidManifest.xml android\app\src\main
...
</activity>
<activity android:name="com.linusu.flutter_web_auth.CallbackActivity" >
<intent-filter android:label="flutter_web_auth">
<action android:name="android.intent.action.VIEW" />
<category android:name="android.intent.category.DEFAULT" />
<category android:name="android.intent.category.BROWSABLE" />
<data android:scheme="yourname" />
</intent-filter>
</activity>
</application>
</manifest>

Answer 3

I am also facing issue with navigating back to app from authentication page in flutter am using flutter_web_auth plugin.
As per my understanding every thing working fine but it is not navigating back to flutter application.
Question: what is the .CallbackActivity in the below code
<activity android:name="com.linusu.flutter_web_auth.CallbackActivity" >
<intent-filter android:label="flutter_web_auth">
<action android:name="android.intent.action.VIEW" />
<category android:name="android.intent.category.DEFAULT" />
<category android:name="android.intent.category.BROWSABLE" />
<data android:scheme="yourname" />
</intent-filter>
</activity>