Last active
October 18, 2023 02:35
-
-
Save rsevil/377690cef7bde5fe6825e3d248af035d to your computer and use it in GitHub Desktop.
Dynamic links - Applinks integration
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// server.js | |
const express = require('express'); | |
const app = express(); | |
const path = require('path'); | |
const http = require('http'); | |
const https = require('https'); | |
const forceSSL = function () { | |
return function (req, res, next) { | |
if (req.headers['x-forwarded-proto'] !== 'https') { | |
return res.redirect( | |
['https://', req.get('Host'), req.url].join('') | |
); | |
} | |
next(); | |
}; | |
}; | |
// Instruct the app | |
// to use the forceSSL | |
// middleware | |
app.use(forceSSL()); | |
// Run the app by serving the static files | |
// in the dist directory | |
app.use(express.static(__dirname + '/dist')); | |
app.get('/link', (req, res) => { | |
// you have to options: | |
// - if you use dl, then you must send the entire deeplink: https://your.page.link/<trashid> | |
// - if you use id, then you must send only the shortlink id: <trashid> | |
const deeplink = req.query.dl || ('https://your.page.link/' + req.query.id); | |
const imageUrl = 'https://www.google.com.ar/images/branding/googlelogo/2x/googlelogo_color_272x92dp.png'; | |
// here you can use more query string variables to add more info to metadata attributes, | |
// doing some requests or appending them directly | |
shareOther(res, deeplink, imageUrl); | |
}); | |
// Start the app by listening on the default | |
// Heroku port | |
app.listen(process.env.PORT || 8080); | |
function shareOther(res, deeplink, imageUrl) { | |
res.send(buildShareContent({ | |
deeplink: deeplink, | |
title: 'Some title', | |
description: 'Some description', | |
image_url: imageUrl | |
})); | |
} | |
const buildShareContent = function(data) { | |
return ('<!DOCTYPE html>' + | |
'<html>' + | |
'<head>' + | |
'<meta property="fb:app_id" content="your_facebook_app_id" />' + | |
'<meta property="al:android:package" content="your_app_package" />' + | |
'<meta property="al:android:app_name" content="your_app_name" />' + | |
'<meta property="al:android:url" content="'+ data.deeplink +'" />' + | |
'<meta property="al:ios:url" content="'+ data.deeplink +'" />' + | |
'<meta property="al:ios:app_store_id" content="your_app_store_id" />' + | |
'<meta property="al:ios:app_name" content="your_app_name" />' + | |
'<meta property="al:web:should_fallback" content="true" />' + | |
'<meta property="al:web:url" content="some_url_to_view_when_fallback_is_needed" />' + // dont know if this is required | |
'<meta property="og:title" content="'+ data.title + '" />' + | |
'<meta property="og:description" content="'+ data.description +'" />' + | |
'<meta property="og:image" content="'+ data.image_url + '" />' + | |
'<meta property="og:image:width" content="'+(data.width || 640)+'" />' + // this is for the preview image to load on first share | |
'<meta property="og:image:height" content="'+(data.height || 640)+'" />' + // this is for the preview image to load on first share | |
'<meta name="twitter:card" content="summary" />' + | |
'<meta name="twitter:site" content="@yourtag" />' + | |
'<meta name="twitter:creator" content="@yourtag" />' + | |
'<meta name="twitter:title" content="'+ data.title +'" />' + | |
'</head>' + | |
'<body>' + | |
'<script>' + | |
'window.location = "'+ data.deeplink +'"' + | |
'</script>' + | |
'</body>' + | |
'</html>') | |
} | |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import { Injectable } from '@angular/core' | |
import { BaseService } from './base.service' | |
import { HttpClient } from '@angular/common/http'; | |
import { map } from 'rxjs/operators'; | |
import { Observable } from 'rxjs'; | |
const config = require('./../../../../config.json'); | |
@Injectable() | |
export class DynamicLinksService extends BaseService { | |
constructor( | |
private nativehttp: HttpClient) | |
{ | |
super(); | |
} | |
createShortLink(data: any) : Observable<string> { | |
var firebaseApiKey = "<your_api_key>"; | |
return this.nativehttp.post<any>(`https://firebasedynamiclinks.googleapis.com/v1/shortLinks?key=${firebaseApiKey}`, { | |
dynamicLinkInfo: { | |
domainUriPrefix: "https://your.page.link", | |
link: "your_url_to_link" + "?data=" + encodeURIComponent(JSON.stringify(data)), | |
androidInfo: { androidPackageName: "your_android_package_name" }, | |
iosInfo: { | |
iosBundleId: "your_iOS_bundle_id", | |
iosAppStoreId: "your_iOS_appstore_id" //this is very important for dynamiclinks to show the appstore when app is not installed | |
} | |
} | |
}) | |
.pipe(map(link => link.shortLink)) | |
.pipe(map(shortLink => { | |
var id = shortLink.substring(shortLink.lastIndexOf('/') + 1); | |
return "https://www.your_applinks_dynamiclinks_proxy_domain.com/link?id={id}".replace("{id}", id) + '&' + data.query; | |
})) | |
.catch(this.handleError); | |
} | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
What steps do I need to do in order for this to work? I am not a react/angular/JS dev. As in I need create an html and paste this code etc?