Flutter：Oauth2 - 重定向 uri 的问题

Question

我想在我的 Flutter 应用程序中设置 Spotify API 的 oAuth 身份验证。我选择了 flutter_web_auth 0.1.1 包。到目前为止，我已经设法让用户可以登录到 Spotify。登录后，用户应该被重定向回我的应用程序。那行不通。Spotify 总是将用户重定向到另一个网站，而不是返回到应用程序。用户登录后如何关闭 WebView 并将用户重定向到我的应用程序？

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>

在此处输入图片说明

Answer 1

本callbackUrlScheme应该是partyai，将redirect_uri要partyai:/和AndroidManifest.xml中机器人：计划值应为partyai。

Answer 2

使用此代码

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);
}

添加到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>