Flutter安卓应用使用flutter_web_auth对接Spotify无法捕获回调URL

• FlutterWebAuth.authenticate的callbackUrlScheme参数传值错误：该参数仅需填写回调URL的协议头（scheme），无需传入完整回调地址。
• AndroidManifest.xml的intent-filter配置错误：<data>标签的android:scheme属性仅支持填写协议部分，直接填入完整回调URL会导致系统无法匹配到对应的应用Activity。
• 若使用HTTPS格式的回调地址，未配置Android App Links验证，系统不会将HTTPS请求重定向到本地应用，只会在浏览器中打开导致404。

1. 先完成前置配置 #

前往Spotify开发者后台的应用设置页，将自定义回调地址vinylapp://callback加入Redirect URIs白名单，所有回调地址必须和后台配置完全一致。

2. 修改Flutter端授权代码 #

onPressed: () async {
  final spotifyAuthURL = Uri.https(
    'accounts.spotify.com',
    '/authorize',
    {
      'response_type': 'code',
      'client_id': dotenv.get('SPOTIFY_CLIENT_ID'),
      'redirect_uri': 'vinylapp://callback', // 和Spotify后台配置的回调地址一致
      'scope': 'user-read-private user-read-email',
    },
  );

  final result = await FlutterWebAuth.authenticate(
    url: spotifyAuthURL.toString(),
    callbackUrlScheme: 'vinylapp', // 仅填写scheme，即://之前的内容
  );
  // 后续自行从result中解析授权码code即可
},

3. 修正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" />
        <!-- 拆分配置对应回调地址vinylapp://callback -->
        <data android:scheme="vinylapp"
              android:host="callback" />
    </intent-filter>
</activity>

如果一定要用https://vinyl_app_spotify.com/callback作为回调地址，需要额外完成以下配置：

1. 在该域名的根目录下放置assetlinks.json文件完成Android App Links的所有权验证
2. 调整代码中callbackUrlScheme为https
3. AndroidManifest的data标签调整为：

<data android:scheme="https"
      android:host="vinyl_app_spotify.com"
      android:pathPrefix="/callback" />

内容的提问来源于stack exchange，提问作者Rabbiot Rabbiot