android - 如何在 Flutter 应用程序中正确设置 redirect_uri？

Question

我正在尝试让用户从我的 Flutter 应用登录到 Google API，但无法让它自动获取 token 。我最接近的是在授权屏幕中看到 token 字符串，并被要求将其复制/粘贴回应用程序。我怀疑它与 redirect_uri 参数有关。

我尝试同时使用 oauth2_client和 flutter_appauth结果几乎相同。设置客户端时，如果我使用 Google urn:ietf:wg:oauth:2.0:oob 提供的第一个 redirect_uri，在授予权限后，它会在授权屏幕中显示 token 并指示用户将其复制并粘贴回应用程序中。如果我使用我在 AndroidManifest.xml 和 build.gradle 中设置的 uri，而不是同意屏幕，我会在浏览器中收到此消息:

"Invalid parameter value for redirect_url: Missing scheme:ai.autonet.afterme"

最后，如果我使用 "http://localhost"(Google 提供的第二个 uri)，我会得到“请求超时”。

我在 Google 端的客户端配置如下所示:

"client_id":"somethingsomething.apps.googleusercontent.com","project_id":"afterme-850af","auth_uri":"https://accounts.google.com/o/oauth2/auth","token_uri":"https://oauth2.googleapis.com/token","auth_provider_x509_cert_url":"https://www.googleapis.com/oauth2/v1/certs","redirect_uris":["urn:ietf:wg:oauth:2.0:oob","http://localhost"]

这是 flutter_appauth 实现的最简单版本:

main.dart
import 'package:flutter/material.dart';
    import 'package:flutter_appauth/flutter_appauth.dart';
    import 'package:oauth2_client/access_token_response.dart';
    import 'package:http/http.dart' as http;

    const AUTH_ENDIPOINT = 'https://accounts.google.com/o/oauth2/auth';
    const CLIENT_ID =
        'somethingsomething.apps.googleusercontent.com';
    const REDIRECT_URI = 'ai.autonet.afterme';
    const TOKEN_ENDPOINT = "https://oauth2.googleapis.com/token";
    var scopes = [
        "https://www.googleapis.com/auth/youtube",
        "https://www.googleapis.com/auth/youtube.upload",
    ];
    void main() {
        runApp(MyApp());
    }

    var httpClient = http.Client();

    class MyApp extends StatelessWidget {
        @override
        Widget build(BuildContext context) {
        return MaterialApp(
            title: 'Flutter Demo',
            theme: ThemeData(
            primarySwatch: Colors.blue,
            visualDensity: VisualDensity.adaptivePlatformDensity,
            ),
            home: MyHomePage(title: 'Flutter Demo Home Page'),
        );
        }
    }

    class MyHomePage extends StatefulWidget {
        MyHomePage({Key key, this.title}) : super(key: key);

        final String title;
        FlutterAppAuth appAuth = FlutterAppAuth();

        authorize() async {
        final AuthorizationTokenResponse result =
            await appAuth.authorizeAndExchangeCode(AuthorizationTokenRequest(
                CLIENT_ID, REDIRECT_URI,
                serviceConfiguration: AuthorizationServiceConfiguration(
                    AUTH_ENDPOINT,
                    TOKEN_ENDPOINT),
                scopes: scopes));
        print(result.accessToken.toString());
        }

        @override
        _MyHomePageState createState() => _MyHomePageState();
    }

    class _MyHomePageState extends State<MyHomePage> {
        getResources() async {
        http.Response resp = await httpClient
            .get('GET https://www.googleapis.com/youtube/v3/videos');
        print(resp.body);
        }


        @override
        Widget build(BuildContext context) {
        return Scaffold(
            appBar: AppBar(
            title: Text(widget.title),
            ),
            body: Center(
            child: Column(
                mainAxisAlignment: MainAxisAlignment.center,
                children: <Widget>[
                
                RaisedButton(
                    child: Text("Permission"), onPressed: () => widget.authorize()),
                ],
            ),
            ),
            
        );
        }
    }
----------------------------------------------------------------
AndroidManifest.xml:
        <manifest xmlns:android="http://schemas.android.com/apk/res/android"
            package="ai.autonet.afterme">
            
            <!-- io.flutter.app.FlutterApplication is an android.app.Application that
                calls FlutterMain.startInitialization(this); in its onCreate method.
                In most cases you can leave this as-is, but you if you want to provide
                additional functionality it is fine to subclass or reimplement
                FlutterApplication and put your custom class here. -->
            <application
                android:name="io.flutter.app.FlutterApplication"
                android:label="afterme"
                android:icon="@mipmap/ic_launcher">
                <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="ai.autonet.afterme" />
                </intent-filter>
            </activity>
                <activity
                    android:name=".MainActivity"
                    android:launchMode="singleTop"
                    android:theme="@style/LaunchTheme"
                    android:configChanges="orientation|keyboardHidden|keyboard|screenSize|smallestScreenSize|locale|layoutDirection|fontScale|screenLayout|density|uiMode"
                    android:hardwareAccelerated="true"
                    android:windowSoftInputMode="adjustResize">
                    <!-- Specifies an Android theme to apply to this Activity as soon as
                        the Android process has started. This theme is visible to the user
                        while the Flutter UI initializes. After that, this theme continues
                        to determine the Window background behind the Flutter UI. -->
                    <meta-data
                    android:name="io.flutter.embedding.android.NormalTheme"
                    android:resource="@style/NormalTheme"
                    />
                    <!-- Displays an Android View that continues showing the launch screen
                        Drawable until Flutter paints its first frame, then this splash
                        screen fades out. A splash screen is useful to avoid any visual
                        gap between the end of Android's launch screen and the painting of
                        Flutter's first frame. -->
                    <meta-data
                    android:name="io.flutter.embedding.android.SplashScreenDrawable"
                    android:resource="@drawable/launch_background"
                    />
                    <intent-filter>
                        <action android:name="android.intent.action.MAIN"/>
                        <category android:name="android.intent.category.LAUNCHER"/>
                    </intent-filter>
                </activity>
                <!-- Don't delete the meta-data below.
                    This is used by the Flutter tool to generate GeneratedPluginRegistrant.java -->
                <meta-data
                    android:name="flutterEmbedding"
                    android:value="2" />
            </application>
        </manifest>
-------------------------------------------------------------------------------------
build.gradle:
  ...
    defaultConfig {
        applicationId "ai.autonet.afterme"
        minSdkVersion 18
        targetSdkVersion 29
        versionCode flutterVersionCode.toInteger()
        versionName flutterVersionName
        manifestPlaceholders = [
        'appAuthRedirectScheme': 'ai.autonet.afterme'
        ]
    }
    ...

任何帮助都会受到重视。

Answer 1

您是否尝试过将 :// 添加到您的 Scheme 末尾？我不确定您是否向 Google 提供了有效的方案名称。

你可以尝试 ai.autonet.afterme:// 或 ai.autonet.afterme://auth 吗？