Trouble adding support for associated domains

Support
1

Hi there,

I’m trying to add support for for a website I’m hosting with Netlify. For those that don’t know what means, I’m bascially trying to make Safari on iOS display banners with the ability to open my app on top of my Netlify hosted website. Right now, I’m just trying to get any link at all to work , so this is my apple-app-site-association file for those who are curious:

{
  "applinks": {
    "details": [
      {
        "appIDs": [ "MY_TEAM_ID.MY_APP_BUNDLE_IDENTIFIER" ],
        "paths": ["*"]
      }
    ]
  }
}

In order for deeplinking into the app to work, the apple-app-site-association file needs to be accessible at either /apple-app-site-association or /.well-known/apple-app-site-association. How do I make sure this is the case for the website I’m hosting with Netlify (aka have the apple-app-site-association file accessible at https://magenta-caramel-c4153b.netlify.app/apple-app-site-association)? I’ve tried doing what this blog post says I should do, and lots of variations on it, but without any success so far.

I have, in accordance with the blog post, also added a netlify.toml file to my root in an effort to get it working. It currently looks like this:

[[headers]]
  for = "/apple-app-site-association"
  [headers.values]
  Cache-Control = '''
      public,
      max-age=0'''
  Content-Type = "application/json"
  X-Content-Type-Options = "nosniff"

[[headers]]
  for = "/.well-known/apple-app-site-association"
  [headers.values]
  Cache-Control = '''
      public,
      max-age=0'''
  Content-Type = "application/json"
  X-Content-Type-Options = "nosniff"

[[redirects]]
  from = "/apple-app-site-association"
  to = "/.well-known/apple-app-site-association"
  status = 200
  force = true

[[redirects]]
  from = "/.well-known/apple-app-site-association"
  to = "/.well-known/apple-app-site-association"
  status = 200
  force = true

The website is built using the Publish framework (build command “swift run”), and the Swift code is processed into a folder called Output, where all the html content used to display the website is stored. Considering this, is it possible at all to get this to work? Where should I store the apple-app-site-association file and the netlify.toml file in my repository in order for the former to be accessible at https://magenta-caramel-c4153b.netlify.app/apple-app-site-association? Currently, both the apple-app-site-association file and the netlify.toml file are located in the root of my repository.

Site name: magenta-caramel-c4153b.netlify.app

2

I believe all you need is:

[[redirects]]
  from = "/.well-known/apple-app-site-association"
  to = "/apple-app-site-association.json"
  status = 200
  force = true

Then, you can save the file with the JSON extension so you would not require the headers.

3

Thanks for the advice! Unfortunately it didn’t yield much in terms of results. With the .well-known folder and the netlify.toml file in the root of the repository and your suggestion within the .toml file, I just get the generic Netlify “Page Not Found: Looks like you’ve followed a broken link or entered a URL that doesn’t exist on this site.” page when visiting both https://magenta-caramel-c4153b.netlify.app/.well-known/apple-app-site-association and https://magenta-caramel-c4153b.netlify.app/apple-app-site-association.

Could the placement of the files be the issue, or should they both be in the root of the repository? I’ve played around a bit with the placement before writing my initial question, but without success. My “Publish directory” in the deploy settings is called Output, is it possible one or both of them needs to be in that directory (or any other) rather than the root of the Github repo it builds the website from?

4

Hi @antonmartinsson

.well-known won’t exist in the deploy as dot files are ignored. As explained in this post the workaround (as you have tried) is to create a rewrite. However this rewrite

[[redirects]]
  from = "/.well-known/apple-app-site-association"
  to = "/.well-known/apple-app-site-association"
  status = 200
  force = true

as from the blog you linked won’t work because it is writing to a non-existent dot file (directory).

The rewrite Hrishikesh has demonstrated will work if the file exists at the site root. If the apple-app-site-association/apple-app-site-association.json file exists in another location, change the path accordingly. If it is inside a .well-known directory, rename the directory (to anything you desire, but ensure it doesn’t start with a .) to ensure it is published.

5

Thanks for the suggestions and the explanation @coelmay. When you say “site root”, what exact location are we talking about? Do you mean the root of the repository the site is built from, or the root of the Output folder (aka where the index.html file is located once Netlify has deployed the site), or someplace else?

Currently, I have the netlify.toml file as well as the apple-app-site-association.json file in the root of the repository (and the .toml file contains exactly what @hrishikesh suggested), and it’s still not working. I’ve also tried the Output folder as mentioned above, with no luck. Still get a “Page Not Found” error when accessing https://magenta-caramel-c4153b.netlify.app/.well-known/apple-app-site-association and https://magenta-caramel-c4153b.netlify.app/apple-app-site-association.

6

This. The site root is / e.g. https://example.com/.

If you cannot access either path (with or without the dot) then the path does not exist.

Can you share the repository you are working with?

7

@coelmay, this is their repo:

@antonmartinsson, you’ve set the publish path of this site as Output, which I believe you’re generating when your site’s build command runs. You need to find a way to copy this file: cryptoverviewDotApp/apple-app-site-association.json at main · antonmartinsson/cryptoverviewDotApp · GitHub, from the root of the repo to the Output folder during the build time - then the rewrite I shared above would work.

1 Like
8

Okay, makes sense. Thanks! Will try to come up with a solition for that when I have the time!

1 Like
9

Just wanted to update for anyone who might be looking at this thread in the future. I did figure this out, and the Publish README as well as this file was the key, as it shows you how you can move a file into the Output folder during the build process. This ended up being my generation code for my website, if that helps anyone.

try Cryptoverview().publish(using: [
  .copyFiles(at: "/Resources"),
  .copyFile(at: "/apple-app-site-association.json"),
  .generateHTML(withTheme: .cryptoverviewTheme)
])