Open your flutter app from external link using uni_links

Yan Yan
2 min readJun 22, 2022

--

အခုခေါင်းစဥ်အနေနဲ့ ကိုယ့်ရဲ့ application ကို deep link ရဲ့ feature သုံးပီး link ကနေ ဖွင့်နိုင်အောင်လုပ်သွားပါမယ်။ အခု tutorial မှာတော့ uni_links ဆိုတဲ့ package ကို သုံးပီး ပြုလုပ်သွားပါမယ်။ဒီ packet က deep link ကိုအခြေခံပီး ပြုလုပ်ထားတာကြောင့် host website တွေမလိုအပ်ဘဲ ကိုယ်သွားစေချင်တဲ့ app ကို ဖွင့်ပေးနိုင်ပါတယ်။ In app host ပုံစံမျိုး ကိုယ်ရဲ့ host name ကို သတ်မှတ်ပေးလိုက်ရင် ရပါတယ်။ဒါပေမဲ့ application ကိုတော့ အရင် install လုပ်ဖို့ လိုအပ်ပါမယ်။ unit_links ကနေလည်း အသေးစိတ် ၀င်ကြည်လို့ရပါတယ်။ final output ကိုကြည့်ရအောင်

စရေးလိုက်ကြရအောင်။
1.Dependency

အရင်ဦးဆုံး dependency ကိုထည့်ရပါမယ်။

flutter pub add uni_links

2.define a unique scheme and host name.
ကိုယ့်ရဲ့ scheme and host name ကို uniqueဖြစ်အောင်သတ်မှတ်ထားပါ။
eg.

Scheme name of: https
And a host name of: deeplinkstesting.com

3. Configure Android
Android configuration လုပ်ဖို့ AndroidManifest.xml ကိုသွားပါ။
— android > app > src > main > AndroidManifest.xml
— Deep Links ရဲ့ scheme and host name ကို အောက်ပါတိုင်း ထည့်လိုက်ပါ။

4. Configure iOS
IOS configuration လုပ်ဖို့ Info.plist ကိုသွားပါ။
— ios > Runner (or your app name) > Info.plist
— Deep Links ရဲ့ scheme and host name ကို အောက်ပါတိုင်း ထည့်လိုက်ပါ။

5. Handle in main.dart

Deep link ကို handle လုပ်ဖို့ နည်းလမ်းနှစ်မျိုးရှိပါတယ်။

  1. Cold start : application ကို မဖွင့်ထားဘဲ(is not running in background) deep link သုံးပီးစဖွင့်မယ်ဆိုရင် _initURIHandler function နဲ့ စပီး triger ဖြစ်ပီး initial link ကို ရပါမယ်။
  2. Coming back to the foreground : application က backgroundမှာ runနေရင် Stream ကနေ initial link ကို
    ရပါမယ်။
    ဒီနေရာမှာ _initURIHandler ကို app lifecycle မှာ တစ်ခါဘဲ run ရပါမယ်။ဒါကို handle လုပ်ဖို့ _initialURILinkHandled ကို global variableသတ်မှတ်ပီး ထိန်းထားပါမယ်။

နောက်တစ်ဆင့်

ရှင်းလင်းချက်

Uri နှစ်ခုက ၀င်လာတဲ့ host link က initial လား current လား ဆိုတာ သတ်မှတ်ပီး လုပ်ဆောင်ပေးဖို့ပါ
_err က Uri error တတ်ရင် handling လုပ်ဖို့ နဲ့
_streamSubscription က၀င်လာတဲ့ link က app ဖွင့်ထားချိန်မှာဆိုရင် handle လုပ်ဖို့ဘဲဖြစ်ပါတယ်

နောက်တစ်ဆင့် _initURIHandler method ကို create လုပ်မယ်။

ရှင်းလင်းချက်

- _initialURILinkHandled ကို တစ်ခါဘဲ run အောင် true ပေး
- _initialURILinkHandled runရင် fluttertoast ပြ
- getInitialUri ကနေ ပြန်လာတဲ့ call back ကို initialUri ထဲထည့်
- null မဟုတ်ရင် initialUri ကို setup လုပ်
- PlatformException error တတ်ရင် handle လုပ်

နောက် _incomingLinkHandler create လုပ်မယ်။

ရှင်းလင်းချက်
- web platform ဆိုရင် initialUri ဘဲ handle လုပ်မယ်
- uriLinkStream ကိုlisten လုပ်ပီး ၀င်လာတဲ့ link ကို currentUri ထည့်ပီး
- error တတ်ရင် handle လုပ်

လိုအပ်တဲ logic impelement လုပ်ပီးရင် initiState ကနေ ခေါ်ပါမယ်။

stream ကို dispose() လုပ်ပေးရပါမယ်။

build method ကိုကြည့်ရအောင်

ရှင်းလင်းချက်

(1) getInitialUri ကနေ၀င်လာတဲ့ linkကို _initialURI ထဲသိမ်းပီး ListTile နဲ့ပြမယ်
(2) stream ကနေ ၀င်လာတဲ့ current link ကို mobile only ဘဲပြပါမယ်။
(3) errorတတ်ရင်ပြပါမယ်။

application ကို build and restart လုပ်ပါမယ်။
ဒီလိုပေါ်လာပါလိမ့်မယ်။ List Tile ရဲ့ subtitle တေွကnull ဖြစ်နေပါလိမ့်မယ်။နောက်တစ်ဆင့်ကြရင် testing လုပ်ပါမယ်။

6.Testing your deep links

Android

  • app ထဲ register လုပ်ထားတဲ့ deep link ကို CLI tool ကို သံုးပီးစမ်းပြပါမယ်။ tool ကို install မလုပ်ထားရင်
    Android studio ရဲ့ setting ထဲ့သွားပီး SDK platform-tools ကို install လုပ်ရပါမယ်။Emulater နဲ့ကြည့် ရအောင် terminal ကနေ အောက်ပါ commond ကို run ကြည့်ပါ

IOS

Xcode ကို install လုပ်ပီးရင် အောက်ပါcommand ကိုစမ်းကြည့်ပါ။

project source code ကို အောက်က link ကနေကြည့်လို့ရပါတယ်။

Conclusion

ဒီ tutorial မှာ application ကို external ကနေ ဖွင့်ဖို့ စမ်းပြထားတာဖြစ်တယ်။နောက်တစ်ခုက Firebase dynamic link နဲ့လည်း ဖွင့်လို့ရတယ်။သူက application ကို ဖင့်ဖို့ install မလုပ်ထားခဲ့ရင်တောင် install လုပ်ဖို့ playstore ကို redirect လုပ်ခိုင်းလို့ရတယ်။အဆုံးထိ ဖတ်ပေးလို့ကျေးဇူးပါ။ source

--

--