【问题标题】:Flutter: Oauth2 - Problems with redirect uriFlutter:Oauth2 - 重定向 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。因为这个原因,我没有解决这种问题

标签: flutter oauth oauth-2.0 spotify


【解决方案1】:

callbackUrlScheme 应为partyairedirect_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;您的帖子实际上是另一个问题,因此请考虑添加评论或发布新问题。答案应该只针对原始问题的实际解决方案
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2018-12-28
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多