Sveltekit - OAuth -端点重定向不能正常工作

Question

我正试图在一个sveltekit应用程序中实现oauth认证。我目前正试图与Github进行身份验证。

项目架构如下：

.src
├── app.css
├── app.html
├── node_modules
│   └── ...
├── components
│   └── ...
├── global.d.ts
├── hooks.ts
├── lib
│   └── ...
└── routes
    ├── index.svelte
    ├── __error.svelte
    ├── __layout.svelte 
    └── oauth
       └── github
           ├── callback.ts
           ├── login.ts
           └── logout.ts

index.svelte包含调用login.ts端点的UI元素。然后，login.ts重定向到Github页面。

这是index.svelte

<script context="module">
    export async function load({ session }) {
        return {
            props: {
                user: session.user
            }
        };
    }
</script>

<script lang="ts">
    export let user;
    console.log('Welcome', user);
</script>

<a href="/oauth/github/login">Connect with Github</a>

这是端点./src/routes/oauth/github/login.ts

export async function get(): Promise<{ status: number, headers: { location: string } }> {

    const ghAuthURL = 'https://github.com/login/oauth/authorize';
    const clientId = import.meta.env.VITE_GITHUB_CLIENT_ID;
    const sessionId = '1234';

    return {
        status: 302,
        headers: {
            location: `${ghAuthURL}?client_id=${clientId}&state=${sessionId}`
        }
    };
}

当我点击“”链接时，我会在我的应用程序的错误页面上找到一个404错误。这是我在404上看到的错误：

Error: Not found: /oauth/github/login
    at Renderer._get_navigation_result (http://127.0.0.1:3000/.svelte-kit/dev/runtime/internal/start.js:807:11)
    at Renderer.update (http://127.0.0.1:3000/.svelte-kit/dev/runtime/internal/start.js:626:38)
    at Renderer.handle_navigation (http://127.0.0.1:3000/.svelte-kit/dev/runtime/internal/start.js:615:14)
    at Router._navigate (http://127.0.0.1:3000/.svelte-kit/dev/runtime/internal/start.js:292:23)
    at http://127.0.0.1:3000/.svelte-kit/dev/runtime/internal/start.js:175:9

如果我重新加载这个错误页面，我会登陆github的auth页面，并且我可以连接。

我在这里错过了什么？谢谢你的帮助。

Answer 1

解决方案是将属性rel="external"传递给锚点：

<a href="/oauth/github/login" rel="external">Connect with Github</a>

在文件中找到了解决办法：

默认情况下，

运行时拦截对元素的单击，并绕过相对(相同来源)URL的正常浏览器导航，这些URL与页面路由之一相匹配。我们有时需要告诉SvelteKit，某些链接需要通过正常的浏览器导航来处理。这方面的例子可能是链接到您域上另一个不属于您的SvelteKit应用程序的页面，或者链接到端点。

https://kit.svelte.dev/docs/a-options#rel-external