How To Add The Universal Link In Flutter?

The Universal Links in Flutter is an amazing way for the user to access the app by clicking the link on the website. It is quite a convenient option for the marketing campaign or even accessing the deep linking in specific content in the app.

It will be convenient for setting and using the Universal Links in Flutter. You can also easily hire Flutter developers to add the Universal link in Flutter. This gives better options for accessing the app using the website.

Quick Accessibility Option

Universal Links in the Flutter is also supported on iOS 9.0 and above. These give you ultimate support in accessing the universal links instantly through a simple process.

You can also easily use varied methods like the URL Scheme linking for accessing the older version of Android and iOS. The Flutter Plugin project helps gain accessibility with Deep Links or Android and Universal Links.

Normally, these links are quite an efficient option for web-browser-like links. So these could be extensively activating the complete web app development which contains the information.

These can be extensively used for loading the specific section in the app. It also assures continuing the user activity from the app or website. App Links and Universal Link involve the regular HTTP links and assure of giving you the ultimate results.

You can also easily load the browser even with setting it up exactly. These also extensively allow present web pages with quick accessibility, such as installing the app.

Also Read: Multi-Themes Using Riverpod in Flutter

Installation Procedure

For making the plugin, you could add the uni_links as a dependency with pubspec.yaml file. Migration for null safety is enabled with the APIs. These changes especially involve massive functions for the getters.

These are also becoming explicitly nullable when clicking the Universal link in the Flutter app development. These changes involve massive functions for changing more features in them.

Permission Required

Normally, Android must declare the links’ permission based on the configuration files. You can also examine the example directory for the Custom URL schemes (iOS) and Deep Links (Android).

The following step is only specified for Flutter but is also a suitable option for the specified platforms. Below is the in-depth guide for adding the Universal link with Custom URL schemas on iOS. These also can be added with the App Links or Deep Links for Android app development.

IOS (Universal Links)

Normally, there are 2 different kinks available in it, such as the “Universal Links” and “Custom URL schemes.”

1. Universal Link in Flutter:

Universal Links would work using the HTTP schemes, requiring the specified hosts. These also enable the proper entitlements and hosted files, such as the apple-app-site association.

2. Custom URL schemes:

The Custom URL schemes especially have the custom scheme, so these could be easily hosted specifically. They are not the hosted file or even entitlements. The downside is the app could claim any scheme. These are the perfect option to make sure the app is unique. For example, this involves myIncrediblyAwesomeScheme or even hst0000001.

Also Read: White Label App vs. Custom App Development: Which is Best for You?

Using The Advanced Xcode

You can also easily enable runner domains to be extensively done with XCode or even through Runner. entitlements file.

Creating entitlements file based on the Xcode are listed below:

• Open up Xcode on ios/Runner.xcworkspace file
• Go to Project navigator
• Click Runner root item
• Click Runner Target
• Open the Signing and Capabilities Tab
• Click + Capability (plus) button
• Add new capability
• Enter ‘associated domains`
• Select item
• Double-click the first item in Domains
• Change from web credentials
• Enter file called Runner.entitlements
• Click ‘Done’

Code

	
<key>com.apple.developer.associated-domains</key>
           <array>
                       <string>applinks:[НАШ_ХОСТ]</string> // applinks:myapp.com
           </array>

You can also easily upload the apple-app-site association file and create them accordingly. Normally, the file uses the JSON structure, so these can be added without any extension. The output will be listed below

	
{   
"applinks": {       
"apps": [],
       
"details": [{           
"appID": "[TEAM_ID].[APP_BUNDLE_ID]",           
"paths": ["[PATH_FOR_REDIRECTION]"]
        		}]
 }
}

Now you can easily get the TEAM_ID for accessing the developer account. These can be easily accessed in the Account section mode and clicked in the Membership. The team ID field involves various aspects to be filled, such as UP******H, and the numbers 0–9 or even the letters A-Z.

Users can access the Universal link by entering the APP_BUNDLE_ID in the project. It is quite important for getting the standard attribute with important aspects. PATH_FOR_REDIRECTION indicates the page on the site for easily accessing the application without any hassle.

	
"paths": [
           "/your_path", // бwill be redirected if we go to <https://myapp.com/your_path>
           "/your_path/*", // will be redirected if we go to <https://myapp.com/your_path/[что_угодно_дальше]>
           "*", // will be redirected to any link <https://myapp.com/[anything_further]>
           "NOT /your_path", // will be redirected to any link other than <https://myapp.com/your_path>
           "NOT /your_path/*", // will be redirected to any link other than <https://myapp.com/your_path/[anything_further]>
]

iOS supports the apple-apple-site-association file, which gives you direct connectivity in the root folders. Users can also host the link or click the well-known/apple-apple-site association directory.

Also Read: Flutter Rendering Widgets Using JSON Data

Testing for iOS

If using the Simulator, test using the Xcode CLI :

	
xcrun simctl openurl booted https://<web domain>/details

Otherwise, type the URL in the Note app and click it.

If everything is set up correctly, the Flutter application launches and displays the screen.

For Android

The universal link also supports the 2 types of Android links. This includes the “Deep Links” and “App Links.”

• App Links can be easily enabled with the https scheme, so this requires the specified host. It gives you direct access to the hosted file like the assetlinks.json.
• Deep Links is another process for the custom scheme, so there is no need to host. The method is also quite an amazing option for saving time without using the hosted file.

The app also enabled the scheme + host combo. It makes sure the unique attribute to high excellence, such as HST0000001://host.com. The process involves at least or even 2 intent filters by enabling the android/app/src/main/AndroidManifest.xml:

	
<manifest ...>
 	 <!-- ... other tags --> 
<application ...>   
<activity ...>     
<!-- ... other tags →


   			<!-- AppLinks -->     
<intent-filter>       
<action android:name="android.intent.action.VIEW" />       
<category android:name="android.intent.category.DEFAULT" />
       				<category android:name="android.intent.category.BROWSABLE" />       
<!-- Accepts URIs that begin with YOUR_SCHEME://YOUR_HOST -->       
<data         
android:scheme="[YOUR_SCHEME]"         
android:host="[YOUR_HOST]" />     
</intent-filter>
</activity>
</application>
</manifest>

The Android:host attribute provides the complete optional for the Deep Links. It will give you complete accessibility to the maximum. You can add the Android:pathPrefix attribute for the specificity to the extent.

	
<!—Accepts URIs for enabling YOUR_SCHEME://YOUR_HOST/NAME/NAME... -->
<!-- Accepts URIs enabling https://YOUR_HOST/NAME/NAME... -->
<data 
android:scheme="[YOUR_SCHEME_OR_HTTPS]" 
android:host="[YOUR_HOST]" 
android:pathPrefix="/[NAME][/NAME...]" />

Test your deep links for android

You can use ADB (Android Debug Bridge) with AM (Activity Manager) tools to test your deep links. These tools will help you test the Intent filter URIs specified for deep linking in your correct app activity. To run this, you must use the command adb on a physical device or an emulator. To test an intent filter with adb the following syntax is used :

	
$ adb shell am start
        -W -a android.intent.action.VIEW
        -d <URI> <PACKAGE>

Conclusion

Enabling the Universal Links setup involves an app and website. It is convenient for handling the link within the Flutter App. You would also require enabling the uni_links package to high excellence. Getinitial Link gives you a better link-starting app with Stream that does not produce the link.

However, in this guide, you will also discover the installation process for an Android and iOS platform both with an example and also about the universal link. Hence, Flutter is an amazing choice for creating the apps for your business. By partnering with a leading mobile app development company that aids you in every manner. You can also read our blogs of Flutter that aids you to boost your knowledge of Flutter development.

Frequently Asked Questions (FAQs)

1. What is universal link in Flutter?

Universal Links is a deep linking protocol developed by Apple and was introduced in iOS versions 9+ to hugely replace a normal deep linking process. Universal links permit an app developer to make a two-way association between the website and the mobile app.

2. What is the difference between the universal link in flutter and the deep link?

A deep link is a link that leads users to a particular section of the app besides its home page or web page. A universal link is a deep link exclusive to Apple devices only. Hence, it is used in email campaigns to direct users to a certain section internally in the app.

3. What is a universal APK?

A universal APK consists of the code and resources for all ABIs in a single APK. It has a default value of false. This option is only available in splits.abi block. While creating the various APKs dependent on screen density, Gradle will always generate the universal APK that has the code and resources for all the multiple screen densities and sizes.

Book your appointment now