Roteiro do App Helper

Nós criamos um arquivo de script JavaScript com um par de funções úteis de ajuda que simplificam a comunicação entre o seu site e seu aplicativo.

Uso

Você pode copiar o roteiro (ou partes dele) e hospedá-lo você mesmo, ou carregá-lo diretamente de nosso site.

<script src="https://webtoapp.design/static/js/app-helper.js"></script>

O script é reduzido, mas não ofuscado, então você pode usar um formatador javascript, caso queira dar uma olhada nas implementações das funções.

Funções

executeWhenAppReady

Após cada página carregada, o aplicativo precisa primeiro injetar algum javascript na página carregada. Isto é para permitir que seu site chame funções javascript como setNotificationTopicSubscriptionStatus. Infelizmente, isto não é instantâneo, então se você tentar chamar uma função javascript que interage com o aplicativo muito rapidamente após o carregamento da página, eles podem não estar definidos ainda.

Você pode evitar isso embrulhando o código que interage com seu aplicativo em uma chamada para executeWhenAppReady.

Quando seu site é carregado usando um navegador, o código dentro de executeWhenAppReady não será executado. Isso significa que você também pode usar essa função para detectar se o seu site foi carregado pelo aplicativo ou por um navegador. Outros métodos para isso são explicados aqui.

<script>
    // setNotificationTopicSubscriptionStatus interacts with the app, so it won't immediately be available after a new page was loaded
    executeWhenAppReady(function () {
        console.log("Website was loaded by the app and the app is ready for interaction");

        // by running inside a executeWhenAppReady call, we avoid potentially calling it while still undefined
        setNotificationTopicSubscriptionStatus(true, "new-games");
    });
        
    // remember to make the function async if you use await inside it!
    // getSubscribedNotificationTopics also interacts with the app and returns a result that needs to be awaited
    executeWhenAppReady(async function () {
        var topics = (await getSubscribedNotificationTopics())["topics"];
    });
</script>

getAppPlatform

Você pode usar esta função para descobrir em qual sistema operacional o usuário atual está usando o aplicativo.

Esta função não precisa ser envolvida dentro de executeWhenAppReady. Ela também pode ser usada para verificar se o usuário atual está usando o aplicativo (verifique se o valor retornado não é nulo). Isto não garante que o aplicativo esteja pronto para interação JavaScript ainda. Se você quiser chamar funções JavaScript que interagem com o aplicativo, você ainda deve envolvê-las em executeWhenAppReady.

<script>
    // possible return values are:
    // "android"
    // "ios"
    // null -> not using app, most likely a regular browser
    var platform = getAppPlatform();
</script>

isInCustomTab, getCustomTabData, closeCustomTab

Estas funções são usadas para gerenciando abas personalizadas.