How to redirect deep linking URL to the scripture web page

Scripture App Builder SAB Feature Requests
1

A deep linking URL to a reference in your SAB app uses a “fake” path that doesn’t really exist on the Web, such as https://kithaabulmuqaddhas.com/link?ref=JHN.3.16
But if this link is used on a device without that app, you’ll get a Page Not Found error.

While deferred deep linking will help to ensure that Android users will get the app, we don’t want all other users to end up stranded with a Page Not Found error. Rather, they should get to the web page with the scripture reference. In this example, that would mean https://kithaabulmuqaddhas.com/web/10-JHN-003.html

But how to get there? From what I’ve Googled, it seems that it should be possible to have a real page at https://kithaabulmuqaddhas.com/link that uses Javascript to take the querystring (ref=JHN.3.16) and do a redirect to the correct web page.

But how would one actually go about doing that?

2

OK, so I have the answer to my own question, and now it’s a feature request:

The index.html file generated by HTML Output should contain something like this:

<!DOCTYPE html>
<!-- Index page that permits locating a page by query string, such as ?ref=JHN.3.16 -->
<html>
<head>
  <title>Redirecting</title>
</head>
<body>
<script>
// SETTINGS: Adjust these for the current HTML Output, as hosted on a website.
var folder = "";                    // Relative path to the HTML files.  e.g. "../web/"
var redirPage = "01-GEN-000.html";  // Path to default page if reference not found. e.g. "../web/01-GEN-000.html"
var booksPresent =                  // Specify the books that are present
	['GEN', 'EXO', 'RUT', '1SA', '2SA', 'PRO', 'JON', 'MRK', 'LUK', 'JHN', 'ACT', 'GAL', 'EPH', 'PHP', 'COL', '1TH', '2TH', '1TI', '2TI', 'TIT', 'PHM', 'HEB', 'JAS', '1PE', '2PE'];
// End of settings

// Prefix for each book
var bookPrefix = {'GEN': '01', 'EXO': '02', 'LEV': '03', 'NUM': '04', 'DEU': '05', 'JOS': '06', 'JDG': '07', 'RUT': '08', '1SA': '09', '2SA': '10', '1KI': '11', '2KI': '12', '1CH': '13', '2CH': '14', 'EZR': '15', 'NEH': '16', 'EST': '17', 'JOB': '18', 'PSA': '19', 'PRO': '20', 'ECC': '21', 'SNG': '22', 'ISA': '23', 'JER': '24', 'LAM': '25', 'EZK': '26', 'DAN': '27', 'HOS': '28', 'JOL': '29', 'AMO': '30', 'OBA': '31', 'JON': '32', 'MIC': '33', 'NAM': '34', 'HAB': '35', 'ZEP': '36', 'HAG': '37', 'ZEC': '38', 'MAL': '39', 'MAT': '40', 'MRK': '41', 'LUK': '42', 'JHN': '43', 'ACT': '44', 'ROM': '45', '1CO': '46', '2CO': '47', 'GAL': '48', 'EPH': '49', 'PHP': '50', 'COL': '51', '1TH': '52', '2TH': '53', '1TI': '54', '2TI': '55', 'TIT': '56', 'PHM': '57', 'HEB': '58', 'JAS': '59', '1PE': '60', '2PE': '61', '1JN': '62', '2JN': '63', '3JN': '64', 'JUD': '65', 'REV': '66'}; 

var match = location.search.match(/\bref=([1-3A-Z]{3})\.(\d+)/i);  // extract book code and chapter number (e.g. from ref=JHN.3)
if (match) {
	var b = match[1].toUpperCase();  // book code
	var c = match[2];                // chapter
	if (booksPresent.includes(b)) {
		redirPage = folder + bookPrefix[b] + '-' + b + '-' + ('00' + c).slice(-3) + ".html"
	}
}
location.href=redirPage
</script>

</body>
</html>

The settings need to be adjusted to reflect the books included in the current HTML Output.
If your deep linking path is different from the path to where the HTML files are hosted online, then put this index.html in the folder that corresponds to that URL, and adjust the folder and redirPage settings to specify the correct path relative to this file.

1 Like
3

I have not played with this a lot but if you use a real URL for the deep link, then it will only take you to that link/page, it won’t take you to the app on the phone. So it will be okay if they don’t have the app but not if they do.

4

That does not match what I’m seeing.

On a device with my app (which registers a deep linking URL scheme of https://kithaabulmuqaddhas.com/km/read), if you click on a link to https://kithaabulmuqaddhas.com/km/read?ref=JHN.3.16, the device asks what you’d like to open that with—the app or the browser—and whether to do this response “Just once” or “Always”. It has no way of knowing whether that’s a “real” URL.

On a device without the app (e.g. desktop), you’ll just get the web page. Try clicking here: https://kithaabulmuqaddhas.com/km/read?ref=JHN.3.16

Branch.io can take advantage of this, too. So in the comic app we can use the same link in both Android and iOS: https://kithaabul.app.link?ref=JHN.3.16. On iOS, where we have no scripture app yet, the user will get the passage on the website.

5

This probably doesn’t have anything to do with the root problem but I’ll go ahead and throw it out there for all to see. I think I remember seeing/reading somewhere where the website address had to be http: and not https:. Okay, there it is for all to laugh about. Cheers!

6

Welcome to the community, and thanks for posting!

Actually, I’m using https in my deep linking URL and it works fine for both deep linking and getting to the same content on the web. I wonder if what you read meant that whichever protocol you use in setting up deep linking, http or https, you have to use the same when calling it? Anyway, there isn’t a problem to solve here any more; it’s just a feature request now:

Currently, the Export to HTML process produces an index.html file that simply redirects to the start of the first book. If this page is called with a query string, it ignores it.

What I’m proposing is enhancing that file so that it can handle query strings, if provided, and otherwise do the same redirect as before. In this way, app developers can use deep linking URLs that provide access to the same content, whatever platform a user is on. So you could be in the Facebook app where someone has referenced a verse using the deep linking URL, and you’ll be able to jump to that same passage on the web even if you don’t have the app. The idea of deep linking with a URL is that it’s providing a way to get at the same content in an app that you could otherwise get to on the Web.

Thanks again!

2 Likes
7

I am looking into the same issue with my SAB app. It currently produces this deep link when I share a verse
https://pertukekem.com/?ref=C01/JHN.3.16
This works in terms of opening the app to the correct verse, but I would like it to also work on a computer and take someone to the verse (or at least the chapter) of the html on my website. My friend helping me with it says it would be much easier to redirect it if the deep link the app produced had something in between ‘.com/’ and ‘?ref’.
I tried that in SAB, for the URL scheme i entered:
https://pertukekem.com/kitebipiroz/
but the deep links do not include the ‘kitebipiroz’.
In the example above, how did you get the ‘km’ into the deep link?
(I am using WordPress so for the time being I just created 66 different redirects so a link will take you to the correct book.)

2 Likes
8

Sorry, @CraigN, I didn’t see your question sooner.

That’s there as part of the URL Scheme I specified:

image

9

I used your code and made it suitable also for collections (or languages). It is below

<script>

        // SETTINGS: Adjust these for the current HTML Output, as hosted on a website.
        var folder = "";                    // Relative path to the HTML files.  e.g. "../web/"

        var redirPage = "tri-01-GEN-003.html";  // Path to default page if reference not found. e.g. "../web/01-GEN-000.html"

        var collectionPresent =                 // Specify the collection that are present
            ['tri', 'eni'];
        var booksPresent =                  // Specify the books that are present

            ['GEN', 'EXO', 'RUT', '1SA', '2SA', 'PRO', 'JON', 'MRK', 'LUK', 'JHN', 'ACT', 'GAL', 'EPH', 'PHP', 'COL', '1TH', '2TH', '1TI', '2TI', 'TIT', 'PHM', 'HEB', 'JAS', '1PE', '2PE'];

        // End of settings

        // Prefix for each book

        var bookPrefix = {'GEN': '01', 'EXO': '02', 'LEV': '03', 'NUM': '04', 'DEU': '05', 'JOS': '06', 'JDG': '07', 'RUT': '08', '1SA': '09', '2SA': '10', '1KI': '11', '2KI': '12', '1CH': '13', '2CH': '14', 'EZR': '15', 'NEH': '16', 'EST': '17', 'JOB': '18', 'PSA': '19', 'PRO': '20', 'ECC': '21', 'SNG': '22', 'ISA': '23', 'JER': '24', 'LAM': '25', 'EZK': '26', 'DAN': '27', 'HOS': '28', 'JOL': '29', 'AMO': '30', 'OBA': '31', 'JON': '32', 'MIC': '33', 'NAM': '34', 'HAB': '35', 'ZEP': '36', 'HAG': '37', 'ZEC': '38', 'MAL': '39', 'MAT': '40', 'MRK': '41', 'LUK': '42', 'JHN': '43', 'ACT': '44', 'ROM': '45', '1CO': '46', '2CO': '47', 'GAL': '48', 'EPH': '49', 'PHP': '50', 'COL': '51', '1TH': '52', '2TH': '53', '1TI': '54', '2TI': '55', 'TIT': '56', 'PHM': '57', 'HEB': '58', 'JAS': '59', '1PE': '60', '2PE': '61', '1JN': '62', '2JN': '63', '3JN': '64', 'JUD': '65', 'REV': '66'}; 

        var match = location.search.match(/\bref=([1-3A-Z]{3})\/([1-3A-Z]{3})\.(\d+)/i);  // extract book code and chapter number (e.g. from ref=JHN.3)

        if (match) {
            var a = match[1].toLowerCase();  // collection code
            var b = match[2].toUpperCase();  // book code
            var c = match[3];                // chapter
            if (booksPresent.includes(b)) {
                redirPage = folder + a + '-' + bookPrefix[b] + '-' + b + '-' + ('00' + c).slice(-3) + ".html"
            }
        }
        location.href=redirPage
        </script>
10

Great! Thanks for contributing this improvement! :slight_smile: