前陣子參考暢言的 API 文檔給 flutter 做了暢言插件：

https://pub.dartlang.org/packages/flutter_changyan 方法的調(diào)用上倒還算不麻煩，但是在登錄的時(shí)候需要搭配 webview 實(shí)現(xiàn)，在這里分享下我的思路。

首先 flutter 提供 webview 插件：https://pub.dartlang.org/packages/flutter_webview_plugin 可以控制打開的 url 以及監(jiān)聽 url 的變化，所以登錄思路是：

• 先通過暢言插件獲取登錄 url ->
• 監(jiān)聽 url change 事件 ->
• 調(diào)用 webview 打開登錄 url 當(dāng)三方登錄成功后會(huì)跳會(huì)預(yù)配置的域名 ->
• url change 時(shí)間監(jiān)聽到訪問指定 host 截取 url 中的 code 參數(shù) ->
• 關(guān)閉 webview
• 用 code 參數(shù)調(diào)用暢言插件登錄功能保存登錄成功的 token

下面是關(guān)鍵代碼：

void _loginChangyan() {
    final flutterWebviewPlugin = new FlutterWebviewPlugin();
    flutterWebviewPlugin.onUrlChanged.listen((String url) {
      var _uri = Uri.parse(url);
      if (_uri.host == 'yourdomain.com' &&
          _uri.queryParameters['code'] != null) {
        Navigator.of(context).pop();
        FlutterChangyan.login(_uri.queryParameters['code']).then((accessToken) {
          print('login success: $accessToken');
        });
      }
    });
    FlutterChangyan.register('client id', 'client secret', 'callback url');
    var loginUrl = FlutterChangyan.loginUrl();
    Navigator.push(context, new MaterialPageRoute<void>(
      builder: (BuildContext context) {
        return new WebviewScaffold(
          url: loginUrl,
          appBar: new AppBar(
            title: const Text('登錄暢言'),
            leading: new IconButton(
              icon: const Icon(Icons.close),
              onPressed: _handleWebViewClose
            )
          ),
          withZoom: true,
          withLocalStorage: true,
        );
      },
    ));
  }