Flutter：Oauth2 - 重定向 uri 的问题

Posted 2023-04-15

【中文标题】Flutter：Oauth2 - 重定向 uri 的问题

【英文标题】：Flutter: Oauth2 - Problems with redirect uri

【发布时间】：2020-02-03 06:04:34

【问题描述】：

我想在我的 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>

enter image description here

【问题讨论】：

嘿，你得到令牌后在哪里存储它？共享偏好？安全存储？

嗨，我决定使用 Spotify Native SDK 而不是使用 Web API。因为这个原因，我没有解决这种问题

【参考方案1】：

callbackUrlScheme 应为partyai，redirect_uri 应为partyai:/，AndroidManifest.xml android:scheme 值应为partyai。

【讨论】：

非常感谢。有用。你为我节省了很多时间

【参考方案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>

【参考方案3】：

我还面临使用flutter_web_auth插件从flutter中的身份验证页面导航回应用程序的问题。

据我了解，一切正常，但它并没有返回到颤振应用程序。

问题：下面代码中的.CallbackActivity是什么

 <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>

【讨论】：

欢迎来到 SO；您的帖子实际上是另一个问题，因此请考虑添加评论或发布新问题。答案应该只针对原始问题的实际解决方案