Send message from webviewer to app

Free Templates, Designs, and Block Combinations
1

@kartik14 had a question about how to send a message from an HTML file to the app. I created this sample app and HTML file to demonstrate sending basic form data to the app in a JSON object

https://x.thunkable.com/copy/7e75833491183b2c3256ee8547691870

<html>

<head>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <script src="https://thunkable.github.io/webviewer-extension/thunkableWebviewerExtension.js"
        type="text/javascript"></script>
</head>

<body>
    <span id="messageDisplay"></span>
    <br />
    <button type="button" id="messageButton">Click to send a message to the app</button>
    <input type="text" id="myText" name="myText"><br>
    <input type="text" id="other" name="myText"><br>
    <input type="text" id="third" name="myText"><br>
</body>
<script type="text/javascript">

    /* when the button is clicked, send a message to the app*/
    document.getElementById('messageButton').onclick = function () {

        //get values from input form
        var message = document.getElementById('myText').value
        var second = document.getElementById('other').value
        var third = document.getElementById('third').value

        /*create JSON object to neatly send data*/
        var obj = {
            "data1": message,
            "data2": second,
            "data3": third
        };

        /*send data to app*/
        ThunkableWebviewerExtension.postMessage(obj);
    }

</script>

</html>
5 Likes
2

Do you still have this by chance? It’s expired now

3

Can you tell me a little bit more about what you’re actually trying to do?

I don’t have this project anymore but I have several other examples that demonstrate how to use this code. In fact that’s why I shared the HTML code so that you could install this into your own apps.

4

This is for the post about getting someone’s OS to direct them to the proper App Store.

I’m using whatsmyos.com but I’m not sure how to convert that information into useable info for the app

5

I didn’t think I should connect the 2 posts so I just replied to this one, idk if that was the right thing to do or not

1 Like