【Flutter】UnivarlLinksによってアプリが起動されたのか感知する【uni_links】

Flutterのパッケージuni_linksを使ってUnivarlLinksによってアプリが起動されたのか感知したい！

概要

今回の記事では、Flutterのパッケージuni_linksを使ってUnivarlLinksによってアプリが起動されたのか感知する手順を掲載する。

UnivarlLinksを使うとシームレスにアプリを起動することが出来るようになる。
例えば、QRコードやNFCラベルのURLレコードに事前にGoogleやAppleの開発者向けのサービスに登録しておいたアプリ用のURLを書き込んでおいて、それをデバイスで読み取ることでアプリを起動させることが出来る。楽ちん！

この記事では各開発者向けのサービスに登録済みであることを前提にアプリ側でUnivarlLinksによってアプリが起動されたのか感知する手順について載せる。

開発者向けのサービスにアプリを登録する手順については別で記事を書くかもしれない。書かないかもしれない。

非同期で処理するためにパッケージriverpodを使う。

仕様書

環境

Android Studio Giraffe | 2023.2.1 Patch 2
Flutter 3.19.6
flutter_riverpod: 2.5.1
uni_links 0.5.1

手順書

インストール編とコード編の2部構成です。

インストール編

ターミナルでコマンドを実行するか

flutter pub add uni_links flutter_riverpod

pubspec.yamlのdependencies:に下記のような感じで追加して

dependencies:
  flutter_riverpod: ^2.5.1
  uni_links: ^0.5.1

ターミナルでflutter pub getする。

flutter pub get

コード編

UnivarlLinksによってアプリが起動されたら、読み込まれたURLを表示する例。普通にアイコンからアプリを起動した場合は何も表示されない。

import 'dart:async';
import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:uni_links/uni_links.dart';

void main() {
  runApp(
    MaterialApp(
      home: Scaffold(
        body: const UniLinkSample1()
      )
    )
  );
}

final uniLinkProvider = FutureProvider<String>((ref) async {
  StreamSubscription? sub;
  String result = "";

  try {
    sub = linkStream.listen((String? link) {
      if (link != null) {
        result = link;
      }
    });
  } catch (e) {
    debugPrint(e.toString());
  }

  sub?.cancel();

  return result;
});

class UniLinkSample1 extends StatelessWidget {
  const UniLinkSample1({super.key});

  @override
  Widget build(BuildContext context) {
    return ProviderScope(
      child: SafeArea(
        child: Center(
          child: Consumer(
              builder: (BuildContext context, WidgetRef ref, Widget? child) {
                final asyncValue = ref.watch(uniLinkProvider);
                return asyncValue.when(
                  data: (data) => Text(
                    data,
                    style: const TextStyle(
                        color: Color(0xFF000000)
                    ),
                  ),
                  loading: () => const CircularProgressIndicator(),
                  error: (error, stack) => Text(
                    'Error: $error',
                    style: const TextStyle(
                        color: Color(0xFFFF0000)
                    ),
                  ),
                );
              }
          ),
        ),
      ),
    );
  }
}

riverpodのFutureProviderについては下記の記事を参照。

【Flutter】FutureProviderを使って非同期でUIを更新する【flutter_riverpod】

FlutterのパッケージriverpodのFutureProviderを使って非同期でUIを更新したい！

uniLinkProviderの中にuni_linksを使った処理をまとめてる。Univarsal Linksでアプリが起動されるとURLが返される。URLにパラメーター（?xxx=yyy&aaa=bbbみたいなの）が含まれてる場合、それも含まれた文字列が返される。

また、iOSで試したところ、アプリ起動中にUnivarsal LinksのURLが書き込まれたNFCラベルを読み取ったら、アプリは再起動される模様。

まとめ（感想文）

URLにパラメーターが含まれててもアプリを起動できるので、読み込まれたQRコードによって処理を変えたり出来るかもね！

参考文献・引用

下記のサイトを参考にさせていただきました。ありがとうございました。

uni_links | Flutter package

Flutter plugin for accepting incoming links - App/Deep Links?