Is it important to hide Stripe secret key in Javascript?

December 5, 2022

I would like to know if it’s important to hide my stripe key in my javascript.

In fact, in my Symfony website, I put this key in my javascript to allow users to pay their orders.
And this is how I made that:

    </footer>

    </body>
    <script src="https://kit.fontawesome.com/47f28c9d14.js" crossorigin="anonymous"></script>
        <script type="text/javascript">
        var stripe = Stripe("pk_live_....");
        var checkoutButton = document.getElementById("checkout-button");

        checkoutButton.addEventListener("click", function () { 
            fetch("/orders/create-session/154154154", {method: "POST"})
            .then(function (response) { return response.json(); })
            .then(function (session) { if (session.error == 'order') 
            { window.location.replace('/orders'); } else { return stripe.redirectToCheckout({sessionId: session.id}); } })
            .then(function (result) { if (result.error) { alert(result.error.message); } })
            .catch(function(error) { console.error("Error:", error); }); });
    </script>
</html>

But if you open console and check the source code you can see my stripe key…

Thanks