Flutter: Deep links and opening applications by QR code.

Mobile or web applications can sometimes have functionalities, which can be good, but in the end, users don't know how to use them. This happened to one of our clients. At first , login to the Flutter application by QR code was a good idea, but users tried to scan the QR code from a system reader instead of a reader in the client’s application. Our client ordered an update of the application from us, where we resolved the problem with scanning the QR code.

How to set up deep links in Flutter apps?

Setting up deep links consists of several steps. One of the steps is a universal link, which we describe next. Open your Apple developer account and find the application's identifier. Enable Associated Domains.

Open Xcode with your project. In the tab Signing & Capabilities add the Capability called Associated Domains. Set a link to your application in the format applinks:domain.com. The domain.com is coded in QR code and the domain has to use the HTTPS protocol. This setting generates the file Runner.entitlements.

Set value FlutterDeepLinkingEnable to YES in file Runner/Info

We have to move now to the server part of the mobile application. Create a file named apple-app-site-association in the root folder of your web server or the hidden folder well-known. The file is in JSON format but without the .json suffix and looks like this:

{
  "applinks": {
      "apps": [],
      "details": [
      {
        "appID": "<TEAM_ID>.<BUNDLE_ID>",
        "paths": ["*"]
      }
    ]
  }
}

Verify if the file is available from a link in the browser. The file does not start working immediately. It usually takes a few hours for it to start working. 

If you are thinking about development of a mobile application, please contact us.