Today I will discuss about how to create Android & Apple Deeplinking.
For Android
- You have
assetlinks.json
file . - Create "assetlinks.json" file. Include the file inside
public/.well-known
folder . - The route is -->
domainname/.well-known/assetlinks.json
.
For Apple
- Apple requires that your website has a file at the path
/.well-known/apple-app-site-association
on your URL. - Create an API route
- Create a file at this in your project location:
pages/api/.well-known/apple-app-site-association.ts
import type { NextApiRequest, NextApiResponse } from 'next'
const BUNDLE_ID = 'YOUR-APPLE-APP-BUNDLE-ID' // replace with your bundle ID
const association = {
applinks: {
apps: [],
details: [
{
appID: `${BUNDLE_ID}`,
paths: ['*', "/"],
},
],
},
}
export default (_: NextApiRequest, response: NextApiResponse) => {
return response.status(200).send(association)
}
Add a redirect
Finally, Apple expects this file to exist at the exact path yourdomain.com/.well-known/apple-app-site-association
.
Since the file we created above is an API route, we need to create a redirect in next.config.js:
const nextConfig = {
// ...
async redirects() {
return [
{
source: '/.well-known/:file',
destination: '/api/.well-known/:file',
permanent: false,
},
]
},
}
Test your app
First, you'll need to make sure you publish your website on the domain you used.
Thanks for reading
Top comments (0)