Using Blockstack Connect as a script

Support
#1

I posted this in the huge connect thread but I was lost in the replies.

My code isn’t working so far. This is what I have so far in the body of my document. Feedback is useful.

<script src="https://unpkg.com/@blockstack/connect"/></script>
<script>
           const authOptions = {
           redirectTo: /home.html;
           manifestPath?: /manifest.json;
           finished?: (payload: FinishedData) => void;
           authOrigin?: string;
           sendToSignIn?: false;
           userSession?: UserSession;
           appDetails: {
           name: "GENDEREV";
           icon: /icon.png;
         };
        }

    

            document.getElementById("signup-button").addEventListener("click", showLogin);
            document.getElementById("login-button").addEventListener("click", showLogin);


            function showLogin() {
              blockstackConnect.showBlockstackConnect(authOptions);
            }

</script>
#2

Your code is not valid javascript. Try something like the one below and compare it to your code. What is the difference that will make your code work?

<html>
<body>
<button id="signup-button">Sign Up</button>
<button id="login-button">Login</button>
<script src="https://unpkg.com/@blockstack/connect" />
</script>
<script>
    const authOptions = {
        redirectTo: "/home.html",
        manifestPath: "/manifest.json",
        authOrigin: "string",
        sendToSignIn: false,
        appDetails: {
            name: "GENDEREV",
            icon: "/icon.png"
        }
    }


    document.getElementById("signup-button").addEventListener("click", showLogin);
    document.getElementById("login-button").addEventListener("click", showLogin);


    function showLogin() {
        console.log(blockstackConnect)
        blockstackConnect.showBlockstackConnect(authOptions);
    }


</script>
</body>

</html>
#3

const authOptions did not contain proper syntax, which I was concerned about. Thanks for pointing me in the right direction there.

#4

Currently, my issue is that clicking “Get Started” on the first popup does not lead to a new login step. The login process does not continue.

I know that the React test-app for Connect requires Blockstack UI but I’m unsure how to find a hosted version of that package or if I need it.

#5

There seems to be a bug that requires you to install blockstack-ui (https://github.com/blockstack/connect/issues/81)