'How to make my firebase dynamic link redirect to my website on desktop and to my instant app on mobile

I have an instant app and a Firebase dynamic link which redirects to this instant app.

But when I click the dynamic link on a computer, the link leads to a non existant page of my website.

According to Google doc : https://firebase.google.com/docs/dynamic-links/android/create

When users open a Dynamic Link on a desktop web browser, they will load this URL (unless the ofl parameter is specified). If you don't have a web equivalent to the linked content, the URL doesn't need to point to a valid web resource. In this situation, you should set up a redirect from this URL to, for example, your home page.

So I created a redirection for my dynamic link which redirects /share/** to /

And it works, when I click the link on a computer I land on the homepage of my website. But my Dynamic links also leads on my homepage and do not open my instant app anymore.

So my question is : how to configure a redirection which redirects desktop users from /share/** to / without breaking my instant app ?



Solution 1:[1]

Add the "ofl" parameter to the url to make the FDL redirects another URL on desktop.

Unfortunately, it is not possible to add this parameter with the Android builder.

So you have to manually create the link, and use the "setLongLink" method as you can see here at the bottom of the page : https://firebase.google.com/docs/dynamic-links/android/create#shorten-a-long-dynamic-link

Task<ShortDynamicLink> shortLinkTask = FirebaseDynamicLinks.getInstance().createDynamicLink()
        .setLongLink(Uri.parse("https://example.page.link/?link=https://www.example.com/&apn=com.example.android&ibn=com.example.ios"))
        .buildShortDynamicLink()
        .addOnCompleteListener(this, new OnCompleteListener<ShortDynamicLink>() {
            @Override
            public void onComplete(@NonNull Task<ShortDynamicLink> task) {
                if (task.isSuccessful()) {
                    // Short link created
                    Uri shortLink = task.getResult().getShortLink();
                    Uri flowchartLink = task.getResult().getPreviewLink();
                } else {
                    // Error
                    // ...
                }
            }
        });

I created my own builder to include the ofl parameter. If it can helps :

public class DynamicLinkBuilder {

    private String dynamicLink = "https://example.com/foo"

    public DynamicLinkBuilder(String link) {
        this.dynamicLink += "?link=" + link;
    }

    public DynamicLinkBuilder addMinVersion(int minVersion){
        dynamicLink += "&amv=" + minVersion;
        return this;
    }

    public DynamicLinkBuilder addIosUrl(String iosUrl){
        dynamicLink += "&ifl=" + iosUrl;
        return this;
    }

    public DynamicLinkBuilder addDesktopUrl(String desktopUrl){
        dynamicLink += "&ofl=" + desktopUrl;
        return this;
    }

    public DynamicLinkBuilder addFallbackUrl(String fallbackUrl){
        dynamicLink += "&afl=" + fallbackUrl;
        return this;
    }

    public DynamicLinkBuilder addPackageName(String packageName){
        dynamicLink += "&apn=" + packageName;
        return this;
    }

    public DynamicLinkBuilder addSocialMediaLogo(String logoUrl){
        dynamicLink += "&si=" + logoUrl;
        return this;
    }

    public DynamicLinkBuilder addSocialMediaTitle(String title){
        dynamicLink += "&st=" + Uri.encode(title);
        return this;
    }

    public DynamicLinkBuilder addSocialMediaDescription(String description){
        dynamicLink += "&sd=" + Uri.encode(description);
        return this;
    }

    public String build(){
        return dynamicLink;
    }
}

Solution 2:[2]

@Simon,

it is possible to achieve it without manual link construction, just use the same builder

private static final String OTHER_PLATFORM_LINK_KEY = "ofl";

public static Task<ShortDynamicLink> createShortDynamicLink(Uri deepLink, Uri imageUrl, String title, String description) {
    DynamicLink dynamicLink = createDynamicLink(deepLink, imageUrl, title, description);
    return FirebaseDynamicLinks.getInstance().createDynamicLink()
            .setLongLink(dynamicLink.getUri())
            .buildShortDynamicLink();
}

public static DynamicLink createDynamicLink(Uri deepLink, Uri imageUrl, String title, String description) {
    DynamicLink dynamicLink = getDynamicLinkBuilder(deepLink, imageUrl, title, description)
            .buildDynamicLink();
    String longDynamicLink = String.valueOf(dynamicLink.getUri());
    longDynamicLink += '&' + OTHER_PLATFORM_LINK_KEY + '=' + DomainConstants.OTHER_PLATFORM_LINK;
    return FirebaseDynamicLinks.getInstance().createDynamicLink()
            .setLongLink(Uri.parse(longDynamicLink))
            .buildDynamicLink();
}

public static DynamicLink.Builder getDynamicLinkBuilder(Uri deepLink, Uri imageUrl, String title, String description) {
    return FirebaseDynamicLinks.getInstance().createDynamicLink()
            .setLink(deepLink)
            .setDomainUriPrefix(DomainConstants.DYNAMIC_LINK_DOMAIN_URI_PREFIX)
            .setAndroidParameters(new DynamicLink.AndroidParameters.Builder().build())
            .setIosParameters(new DynamicLink.IosParameters.Builder(DomainConstants.IOS_BUNDLE_ID)
                    .setAppStoreId(DomainConstants.APP_STORE_ID)
                    .setMinimumVersion(DomainConstants.IOS_MINIMUM_VERSION)
                    .build())
            .setSocialMetaTagParameters(
                    new DynamicLink.SocialMetaTagParameters.Builder()
                            .setTitle(title)
                            .setDescription(description)
                            .setImageUrl(imageUrl)
                            .build())
            .setNavigationInfoParameters(new DynamicLink.NavigationInfoParameters.Builder()
                    .setForcedRedirectEnabled(true)
                    .build());
}

Solution 3:[3]

I solved this in a similar way but with shorter code: As other have mentioned, you must manually add an 'ofl' parameter to the link. My method was:

// Grab link from Firebase builder
guard var longDynamicLink = shareLink.url else { return }
// Parse URL to string
var urlStr = longDynamicLink.absoluteString
// Append the ofl fallback (ofl param specifies a device other than ios or android)
urlStr = urlStr + "&ofl=https://www.meetmaro.com/"
// Convert back to a URL
var urlFinal = URL(string: urlStr)!

// Shorten the url & check for errors
DynamicLinkComponents.shortenURL(urlFinal, options: nil, completion:{ [weak self] url,warnings,error in
        if let _ = error{
            return
        }
        if let warnings = warnings{
            for warning in warnings{
                print("Shorten URL warnings: ", warning)
            }
        }
        guard let shortUrl = url else {return}
        // prompt the user with UIActivityViewController
        self?.showShareSheet(url: shortUrl)
    })

The final URL can then be used to present the shareable panel with another function like: self.showShareSheet(url: finalUrl) which triggers the UIActivityViewController

Credit to http://ostack.cn/?qa=168161/ for the original idea

More about ofl: https://firebase.google.com/docs/dynamic-links/create-manually?authuser=3#general-params

Solution 4:[4]

Based on @Ivan Karpiuk answer:

Documentation:

ofl The link to open on platforms beside Android and iOS. This is useful to specify a different behavior on desktop, like displaying a full web page of the app content/payload (as specified by param link) with another dynamic link to install the app.

Add this DynamicLink.Builder extension:

private fun DynamicLink.Builder.otherPlatformParameters(): DynamicLink.Builder {
    var longDynamicLink = this.buildDynamicLink().uri.toString()
    longDynamicLink += "&ofl=" + YOUR_URL

    longLink = Uri.parse(longDynamicLink)

    return this
}

Replace YOUR_URL with yours and then:

FirebaseDynamicLinks.getInstance().createDynamicLink()
        .setLink(...)
        .setDomainUriPrefix(...)
        .setAndroidParameters(...)
        .setIosParameters(...)
        .setSocialMetaTagParameters(...)
        .otherPlatformParameters()
        .buildShortDynamicLink()

So we create a long link via createDynamicLink(), add ofl with otherPlatformParameters() and then convert it to a short link buildShortDynamicLink()

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Simon
Solution 2 Vadim Kotov
Solution 3
Solution 4 ch13mob