Flutter Web how to serve file assetlinks.json for Android App Links verification

Question

I am deploying a Flutter Web App on Firebase Hosting.

And a Flutter App on Android.

To use App Links that redirect to my Android application, I need to verify the App Links serving the file assetlinks.json on the web at https://example.com/.well-known/assetlinks.json

How can I make the file available, without 3XX redirects, from my domain, that is Flutter deployed on the web with firebase hosting?

Finegrained

Answer 1

It is enough to add the .well-known folder and the file to the web folder of your Flutter project.

And to change the firebase.json adding headers and rewrites entries.

{
  "hosting": {
    "public": "build/web",
    "appAssociation": "NONE",
    "ignore": ["firebase.json", "**/.*", "**/node_modules/**"],
    "headers": [
      {
        "source": "/.well-known/assetlinks.json",
        "headers": [
          {
            "key": "Content-Type",
            "value": "application/json"
          }
        ]
      }
    ],
    "rewrites": [
      {
        "source": "/.well-known/assetlinks.json",
        "destination": "/.well-known/assetlinks.json"
      },
      {
        "source": "**",
        "destination": "/index.html"
      }
    ]
  }
}

build and deploy again and the file is now accessible!

Thanks for the easy guide to https://blog.bam.tech/developer-news/universal-links-firebase-hosting-and-flutter-web

Finegrained

How would it be for another server? like for example Amazon amplify? I cant find a solution – Maddocks

This doesn't work if you only add your .well-known/assetlinks.json in the web directory alone, after building and deployment, it throws a 404 when you try to access it – Nereen

it's work, and to be sure after run flutter build ... go and check your build/web to see if that folder is generated. – Calorific

Answer 2

Firebase Hosting automatically generates assetlinks.json and apple-app-site-association files when they are requested. It doesn't require any extra configuration.

You just need to make sure that your app details (package, SHA256 certificate fingerprints, etc.) are correctly setup in the Project Settings and make sure that in your firebase.json the property appAssociation is set to "AUTO" (or omitted, as AUTO is the default value).

Example firebase.json:

{
  "hosting": {
    "public": "build/web",
    "ignore": [
      "firebase.json",
      "**/.*",
      "**/node_modules/**"
    ],
    "appAssociation": "AUTO",
    "rewrites": [
      {
        "source": "**",
        "destination": "/index.html"
      }
    ]
  }
}

Ref: https://firebase.google.com/docs/hosting/full-config#rewrite-dynamic-links

Konikow

Answer 3

Don't mess up the path of your well-known folder.

It should be placed in: build/web and not just in web.

Abohm

Answer 4

If I am not mistaken, Firebase stores files in a so called bucket. The bucket can be directly exposed to the internet or you can use the API to pull the file you need and put it somewhere public on your domain:

https://firebase.google.com/docs/storage/web/list-files

To see how to publish files in a gloud bucket, here is a good answer:

How do you make many files public in Google Cloud Storage?

Be aware the method described provides public access, so make sure you only expose what you want.

Swingle

The problem is not to store the file, but to make it public from your domain, without redirections, when the domain is serving a Flutter Web application. – Finegrained

If you change the DNS Records to point to cloud storage, then the website is no longer accessible. – Finegrained

I linked to how to expose it, it does not redirect like that. One can server the website from the same bucket with some limitations. Maybe I misunderstood your questions, it is not totally clear to me. seems you got a good answer. – Swingle

You can only serve a static website and you have to reserve the domain to it. Flutter Web is not static and the domain where it is running is the one that needs to be verified, so it cannot be used for cloud storage. But thanks. – Finegrained