Flutter ile Firebase Dynamic Links Kullanımı
Herkese selamlar. Firebase Dynamic Link nedir, Flutter ile nasıl kullanabiliriz? Bu yazımda bu konulara değineceğim. Lafı uzatmadan başlayalım.
Dynamic Link Nedir?
Dinamik Bağlantılar ile kullanıcılarınız, bağlantınızı açtıkları platform için mevcut en iyi deneyimi elde eder. Bir kullanıcı iOS veya Android’de bir Dinamik Bağlantı açarsa, doğrudan yerel uygulamanızdaki bağlantılı içeriğe götürülebilir. Bir kullanıcı aynı Dinamik Bağlantıyı bir masaüstü tarayıcısında açarsa, web sitenizdeki eşdeğer içeriğe götürülebilir.
Ek olarak, Dinamik Bağlantılar uygulama yüklemelerinde çalışır: Bir kullanıcı iOS veya Android’de bir Dinamik Bağlantı açarsa ve uygulamanız yüklü değilse, kullanıcıdan uygulamayı yüklemesi istenebilir; daha sonra, kurulumdan sonra uygulamanız başlar ve bağlantıya erişebilir.
Flutter ile Dynamic Link Kullanımı
Öncelikle projenizde firebase_core paketinin kurulu olması ve firebase ile bağlantılı olması gerekmektedir. Firebase projesi oluştururken SHA-1 kodunu eklediğinizden emin olun, eğer atladıysanız proje ayarlarından ekleyip yeniden google-services.json/ dosyasını indirmeniz gerekmektedir.
https://pub.dev/packages/firebase_core
Bağlantıdaki adımların yapıldığını varsayarak ilerleyeceğim.
Firebase proje panelinden Engage sekmesi altında bulunan Dynamic Links alanında bir domain adı seçmemiz gerekiyor. Ben Firebase’in ücretsiz sağladığı .page.link uzantılı domain üzerinden devam edeceğim. İsterseniz kendi domaininiz üzerinde de aksiyon alabilirsiniz.
Domain adına ‘dinamiklinkproje.page.link’ ismini verdim.
Dynamic link domain kurulumundan sonra “New Dynamic Link” butonuna basarak bir dinamik link oluşturalım. Burada oluşturacağımız link sadece ilgili marketlere yönlendirme yapacak ise isim verirken istediğiniz isimlendirmeyi yapabilirsiniz. Fakat uygulama içi bir sayfa yönlendirmesi, referans yönetimi gibi bir şey için kullanılacak ise buradaki isimlendirmeye dikkat edilmesi gerekmektedir.
Ben bu örnekte referans ile uygulamaya üye olma işlemini yöneteceğim. Siz de farklı senaryolar için düzenlemeler yapabilirsiniz.
Bu aşamada uygulama web tarayıcısından açılırsa hangi bağlantıya yönlendirmesi gerektiğini ve ileride bu linkin ne işe yaradığını hatırlamak için açıklamasını(sadece biz görüyoruz) giriyoruz. Linke referans kodu olarak “sametka” ekledim. Sonrasında oluşturacağımız dinamik linkler için de bu şablonu kullanabilirsiniz.
Devamında linkin Android ve iOS cihazlardaki davranışılarını belirteceğiz. Şuan iOS uygulaması oluşturmadığım için “iOS cihazda tarayıcıda aç” seçeneğini işaretleyip geçiyorum.
Android ayarlarımı da bu şekilde tamamladıktan sonra linki oluşturuyorum.
Artık kodlama zamanı. DynamicLinksApi isminde bir class oluşturuyorum.
Burada 3 farklı metodum var. initDynamicLinks, handleSuccessLinking, createReferralLink.
initDynamicLinks ile uygulamada dinamik link yakalandığında alınacak aksiyonları bu metota yazıyoruz. onSucess metodunda handleSuccessLinking metodumu çağırdım. Burada referans kodu var mı yok mu onu kontrol ediyorum eğer var ise register sayfasına yönlendirme yapıyorum.
createRefferalLink metodunda ise uygulama içinde referans linki oluşturmak istersek kullanacağımız yapıyı oluşturdum.
import 'package:firebase_dynamic_link_example/view/register.dart';
import 'package:firebase_dynamic_links/firebase_dynamic_links.dart';
import 'package:flutter/material.dart';
class DynamicLinksApi {
final dynamicLink = FirebaseDynamicLinks.instance;
Future<void> initDynamicLinks(BuildContext context) async {
FirebaseDynamicLinks.instance.onLink(
onSuccess: (PendingDynamicLinkData? dynamicLink) async {
handleSuccessLinking(data: dynamicLink, context: context);
},
onError: (OnLinkErrorException e) async {
debugPrint('onLinkError');
debugPrint(e.message);
},
);
}
void handleSuccessLinking(
{PendingDynamicLinkData? data, BuildContext? context}) {
final Uri? deepLink = data?.link;
if (deepLink != null) {
var isRefer = deepLink.pathSegments.contains('referans');
if (isRefer) {
var code = deepLink.queryParameters['code'];
debugPrint(code.toString());
if (code != null) {
Navigator.push(
context!,
MaterialPageRoute(
builder: (context) => RegisterView(
refCode: code.toString(),
),
),
);
}
}
}
}
//dinamik link oluşturma
Future<String> createReferralLink(String referralCode) async {
final DynamicLinkParameters dynamicLinkParameters = DynamicLinkParameters(
uriPrefix: 'https://dinamiklinkproje.page.link/referans',
link: Uri.parse('https://www.berkut.tech/referans?code=$referralCode'),
androidParameters: AndroidParameters(
packageName: 'com.example.firebase_dynamic_link_example',
),
socialMetaTagParameters: SocialMetaTagParameters(
title: 'Davet et',
description: 'Davet oluştur',
imageUrl: Uri.parse(
'https://freeiconshop.com/wp-content/uploads/edd/share-flat.png'),
),
);
final ShortDynamicLink shortLink =
await dynamicLinkParameters.buildShortLink();
final Uri dynamicUrl = shortLink.shortUrl;
debugPrint(dynamicUrl.toString());
return dynamicUrl.toString();
}
}Main, splash ve register kodları da bu şekilde.
Artık projenizde bu şekilde yapıyı kullanmak isterseniz core/dynamic_links altındaki DynamicLinksApi sınıfını istediğiniz projenize eklemeniz kendinize göre düzenleme yapıp splash ekranında yaptığımız gibi init etmeniz yeterli olacaktır.
Kaynak kodları; https://github.com/sametkaravaizoglu/flutter-firebase-dynamic-links
Bir sonraki yazımda görüşmek üzere, sağlıcakla kalın.
Github: https://github.com/sametkaravaizoglu
Linkedin: https://www.linkedin.com/in/sametka/
