刷新页面后新的谷歌登录消失

Question

我遵循 google 提供的指南来集成新的 google 登录。我使用Google 提供的代码生成器创建了 HTML 。

这里我附上了完整的代码

 <svelte:head>
    <title>Home</title>
    <meta name="description" content="Svelte demo app" />
</svelte:head>

<section>
    <div class="h-screen">
        <div
            id="g_id_onload"
            data-client_id="534101779287-bm07dc8v4ln4kulqbql61nsglcku74vg.apps.googleusercontent.com"
            data-context="use"
            data-ux_mode="redirect"
            data-login_uri="http://localhost:5173/auth/callback"
        />
        <div class="bg-red-300 h-80">
            <div
                class="g_id_signin"
                data-type="standard"
                data-shape="rectangular"
                data-theme="outline"
                data-text="signin_with"
                data-size="medium"
                data-logo_alignment="left"
                data-width="180"
            />
        </div>
    </div>
</section>

第一次渲染页面时效果很好。

Command+R当我们使用或单击浏览器中的重新加载图标刷新页面时， “登录”按钮消失。

Answer 1

使用 SvelteKit 时，硬重载是在服务器端呈现的。代码可能与此不兼容或者执行顺序错误。

检查控制台是否有错误，并将必须在客户端上运行的代码移至onMount. 作为最后的手段，您还可以使用ssr页面选项关闭特定页面的服务器端呈现。