issuing a goto('/route') to an internal svelte page that redirects to an external url throws an "Error: Not found: /api/user" error #9399

opensas · 2023-03-11T00:07:08Z

Describe the bug

When issuing a goto('/redirect) to an internal route handled by an +page.ts that redirects to an external url, throws external url throws an "Error: Not found: /api/user" error

Note: te docs says

goto
Returns a Promise that resolves when SvelteKit navigates (or fails to navigate, in which case the promise rejects) to the specified url. For external URLs, use window.location = url instead of calling goto(url).

But in this case I'm navigating to an internal url (/redirect). The problem is that /redirect redirect to an external url (https://www.google.com) but sveletkit tries to handle it like if it were an internal one. Sveltekit should recognize it's external and just redirect user.

Note: you need to have the inspector (F12) open to see the error

The debugger then stops in the following line

	async function server_fallback(url, route, error, status) {
		if (url.origin === location.origin && url.pathname === location.pathname && !hydrated) {
			// We would reload the same page we're currently on, which isn't hydrated,
			// which means no SSR, which means we would end up in an endless loop
			return await load_root_error_page({
				status,
				error,
				url,
				route
			});
		}

		if (__SVELTEKIT_DEV__) {
			console.error(
				'An error occurred while loading the page. This will cause a full page reload. (This message will only appear during development.)'
			);

			debugger; // --> stops here
		}

		return await native_navigation(url);
	}

It seems like svelkit can't recognize an external url (in thi case https://www.google.com) and tries to handle it using the defined routes, when it can't find it it throws an error

Expected behaviour

Sveltekit should recognize when an internal route (+page.ts, +page.server.ts, +server.ts) is redirecting user to an external url and stop trying to process it.

Note this is happening with the following version:

"@sveltejs/kit": "^1.5.0"
"svelte": "^3.54.0",

With version
"@sveltejs/kit": "^1.10.0",
"svelte": "^3.54.0",
it worked ok

Reproduction

this github repo has a complete example: https://github.com/opensas/goto-api-route-svelte-issue

you can open it in gitpod with: https://gitpod.io/#https://github.com/opensas/goto-api-route-svelte-issue

create a new project

put thin into src/routes/+page.svelte

<script lang="ts">
	import { goto } from "$app/navigation";
</script>

<button on:click={() => goto('/redirect')}>goto('/redirect') (debugger error!!!)</button>

<br />

<button on:click={() => window.location.href = '/redirect'}>window.location.href = '/redirect' (OK!!!)</button>

and this in /routes/redirect/+page.ts (same issue happens with a +page.server.ts or a +server.ts api route)

import { redirect } from '@sveltejs/kit';

export const load = (async () => {
	throw redirect(302, 'https://www.google.com/');
})

start the project
navigate to http://localhost:5173/
open debugger (F12)
click on the goto('/redirect') button

Error: Not found: /api/user
An error occurred while loading the page. This will cause a full page reload. (This message will only appear during development.)

Logs

Error: Not found: /
    update http://localhost:5173/node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@sveltejs/kit/src/runtime/client/client.js?v=dd245c85:283
    navigate http://localhost:5173/node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@sveltejs/kit/src/runtime/client/client.js?v=dd245c85:1152
    goto http://localhost:5173/node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@sveltejs/kit/src/runtime/client/client.js?v=dd245c85:210
    update http://localhost:5173/node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@sveltejs/kit/src/runtime/client/client.js?v=dd245c85:312
    navigate http://localhost:5173/node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@sveltejs/kit/src/runtime/client/client.js?v=dd245c85:1152
    goto http://localhost:5173/node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@sveltejs/kit/src/runtime/client/client.js?v=dd245c85:210
    goto http://localhost:5173/node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@sveltejs/kit/src/runtime/client/client.js?v=dd245c85:1367
    click_handler http://localhost:5173/src/routes/+page.svelte:120
    listen http://localhost:5173/node_modules/.vite/deps/chunk-FALHZI6R.js?v=dd245c85:360
    listen_dev http://localhost:5173/node_modules/.vite/deps/chunk-FALHZI6R.js?v=dd245c85:1987
    mount http://localhost:5173/src/routes/+page.svelte:79
    m http://localhost:5173/node_modules/.pnpm/[email protected][email protected]/node_modules/svelte-hmr/runtime/svelte-hooks.js?v=dd245c85:291
    mount_component http://localhost:5173/node_modules/.vite/deps/chunk-FALHZI6R.js?v=dd245c85:1781
    mount http://localhost:5173/.svelte-kit/generated/root.svelte:266
    mount http://localhost:5173/node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@sveltejs/kit/src/runtime/components/layout.svelte?v=dd245c85:32
    m http://localhost:5173/node_modules/.pnpm/[email protected][email protected]/node_modules/svelte-hmr/runtime/svelte-hooks.js?v=dd245c85:291
    mount_component http://localhost:5173/node_modules/.vite/deps/chunk-FALHZI6R.js?v=dd245c85:1781
    mount http://localhost:5173/.svelte-kit/generated/root.svelte:168
    mount http://localhost:5173/.svelte-kit/generated/root.svelte:466
    mount_component http://localhost:5173/node_modules/.vite/deps/chunk-FALHZI6R.js?v=dd245c85:1781
    init http://localhost:5173/node_modules/.vite/deps/chunk-FALHZI6R.js?v=dd245c85:1864
    Root http://localhost:5173/.svelte-kit/generated/root.svelte:688
    createProxiedComponent http://localhost:5173/node_modules/.pnpm/[email protected][email protected]/node_modules/svelte-hmr/runtime/svelte-hooks.js?v=dd245c85:341
    ProxyComponent http://localhost:5173/node_modules/.pnpm/[email protected][email protected]/node_modules/svelte-hmr/runtime/proxy.js?v=dd245c85:242
    Proxy<Root> http://localhost:5173/node_modules/.pnpm/[email protected][email protected]/node_modules/svelte-hmr/runtime/proxy.js?v=dd245c85:349
    initialize http://localhost:5173/node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@sveltejs/kit/src/runtime/client/client.js?v=dd245c85:442
    _hydrate http://localhost:5173/node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@sveltejs/kit/src/runtime/client/client.js?v=dd245c85:1784
    start http://localhost:5173/node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@sveltejs/kit/src/runtime/client/start.js:22
    <anonymous> http://localhost:5173/:35
    promise callback* http://localhost:5173/:34
[app.js:18:41](http://localhost:5173/home/sas/devel/apps/glas-it/apps/wingback/tmp/goto-api-route/.svelte-kit/generated/client/app.js)
    handleError http://localhost:5173/home/sas/devel/apps/glas-it/apps/wingback/tmp/goto-api-route/.svelte-kit/generated/client/app.js:18
    handle_error http://localhost:5173/node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@sveltejs/kit/src/runtime/client/client.js?v=dd245c85:1328
    update http://localhost:5173/node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@sveltejs/kit/src/runtime/client/client.js?v=dd245c85:283
    navigate http://localhost:5173/node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@sveltejs/kit/src/runtime/client/client.js?v=dd245c85:1152
    goto http://localhost:5173/node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@sveltejs/kit/src/runtime/client/client.js?v=dd245c85:210
    update http://localhost:5173/node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@sveltejs/kit/src/runtime/client/client.js?v=dd245c85:312
    navigate http://localhost:5173/node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@sveltejs/kit/src/runtime/client/client.js?v=dd245c85:1152
    goto http://localhost:5173/node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@sveltejs/kit/src/runtime/client/client.js?v=dd245c85:210
    goto http://localhost:5173/node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@sveltejs/kit/src/runtime/client/client.js?v=dd245c85:1367
    click_handler http://localhost:5173/src/routes/+page.svelte:120
    (Async: EventListener.handleEvent)
    listen http://localhost:5173/node_modules/.vite/deps/chunk-FALHZI6R.js?v=dd245c85:360
    listen_dev http://localhost:5173/node_modules/.vite/deps/chunk-FALHZI6R.js?v=dd245c85:1987
    mount http://localhost:5173/src/routes/+page.svelte:79
    m http://localhost:5173/node_modules/.pnpm/[email protected][email protected]/node_modules/svelte-hmr/runtime/svelte-hooks.js?v=dd245c85:291
    mount_component http://localhost:5173/node_modules/.vite/deps/chunk-FALHZI6R.js?v=dd245c85:1781
    mount http://localhost:5173/.svelte-kit/generated/root.svelte:266
    mount http://localhost:5173/node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@sveltejs/kit/src/runtime/components/layout.svelte?v=dd245c85:32
    m http://localhost:5173/node_modules/.pnpm/[email protected][email protected]/node_modules/svelte-hmr/runtime/svelte-hooks.js?v=dd245c85:291
    mount_component http://localhost:5173/node_modules/.vite/deps/chunk-FALHZI6R.js?v=dd245c85:1781
    mount http://localhost:5173/.svelte-kit/generated/root.svelte:168
    mount http://localhost:5173/.svelte-kit/generated/root.svelte:466
    mount_component http://localhost:5173/node_modules/.vite/deps/chunk-FALHZI6R.js?v=dd245c85:1781
    init http://localhost:5173/node_modules/.vite/deps/chunk-FALHZI6R.js?v=dd245c85:1864
    Root http://localhost:5173/.svelte-kit/generated/root.svelte:688
    createProxiedComponent http://localhost:5173/node_modules/.pnpm/[email protected][email protected]/node_modules/svelte-hmr/runtime/svelte-hooks.js?v=dd245c85:341
    ProxyComponent http://localhost:5173/node_modules/.pnpm/[email protected][email protected]/node_modules/svelte-hmr/runtime/proxy.js?v=dd245c85:242
    Proxy<Root> http://localhost:5173/node_modules/.pnpm/[email protected][email protected]/node_modules/svelte-hmr/runtime/proxy.js?v=dd245c85:349
    initialize http://localhost:5173/node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@sveltejs/kit/src/runtime/client/client.js?v=dd245c85:442
    _hydrate http://localhost:5173/node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@sveltejs/kit/src/runtime/client/client.js?v=dd245c85:1784
    start http://localhost:5173/node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@sveltejs/kit/src/runtime/client/start.js:22
    <anonymous> http://localhost:5173/:35
    (Async: promise callback)
    <anonymous> http://localhost:5173/:34
An error occurred while loading the page. This will cause a full page reload. (This message will only appear during development.)

System Info

System:
    OS: Linux 5.4 Ubuntu 18.04.6 LTS (Bionic Beaver)
    CPU: (8) x64 Intel(R) Core(TM) i7-8550U CPU @ 1.80GHz
    Memory: 983.89 MB / 15.08 GB
    Container: Yes
    Shell: 4.4.20 - /bin/bash
  Binaries:
    Node: 16.19.1 - /usr/bin/node
    npm: 8.19.3 - /usr/bin/npm
  Browsers:
    Brave Browser: 111.1.49.120
    Chrome: 111.0.5563.64
    Firefox: 110.0.1

Severity

there's a workaround (window.location.href = 'external_url'), but you have to be aware that an internal route ('/redirect') is redirecting to an external one to avoid using goto)

Additional Information

github repo: https://github.com/opensas/goto-api-route-svelte-issue

running example at https://gitpod.io/#https://github.com/opensas/goto-api-route-svelte-issue

The text was updated successfully, but these errors were encountered:

kylebuildsstuff · 2023-03-13T01:03:44Z

Just wanted to add I ran into the same error message while trying to call goto() to redirect to a stripe checkout:

Error: Not found: /c/pay/cs_test_a1qHzGd4H7...

The url I passed in looked like https://checkout.stripe.com/c/pay/cs_test_a1qHzGd4H7...

For me It broke on @sveltejs/kit": "1.11.0", and it was fixed when I downgraded to @sveltejs/kit": "1.10.0"

zyxd · 2023-03-13T13:05:41Z

I can confirm this problem even when using <a href="/hello"> instead of goto('/hello').

// routes/hello/server.js
export function GET() {
  return new Response('hello')
}

A temporary solution is to use window.location = '/hello' or downgrade to 1.10.0.
#9305

opensas · 2023-03-14T08:47:37Z

and as @zyxd suggested I'm using windows.location.href, I even defined my own goto function to leave the rest of the code unchanged:

	// see issue: https://github.com/sveltejs/kit/issues/9399#issuecomment-1466109848
	const goto = (url: string) => (window.location.href = url);

opensas · 2023-03-14T18:21:28Z

I found out that the problem arises given the following conditions:

uses goto to navigate to an internal route (or internal API)
the route (+page.ts, +page.server.ts or +server.ts) issues a redirect to an external site
sveltekit doesn't recognize it's an external site and tries to process it (and when it can't find it in their own routes if raises a Not found error)

using window.location.href = 'internal route' works as a workaround, but it forces you to be aware of the internal behavior of the svelte route (knowing if it redirects to an external route)

please have a look at the updated issue and sample project

opensas · 2023-03-14T18:25:12Z

Just wanted to add I ran into the same error message while trying to call goto() to redirect to a stripe checkout:

Error: Not found: /c/pay/cs_test_a1qHzGd4H7...

The url I passed in looked like https://checkout.stripe.com/c/pay/cs_test_a1qHzGd4H7...

For me It broke on @sveltejs/kit": "1.11.0", and it was fixed when I downgraded to @sveltejs/kit": "1.10.0"

In the docs it tells you to use goto only for internal routes, and use window.location.href for external one, the problem with my example is that it is an internal route that redirect to an external route, and sveltekit treats it as an internal one anyway is using goto.

closes #9399

opensas · 2023-03-15T21:05:18Z

I was thinking that perhaps an easier approach would be to make goto a bit more intelligent, so it can recognize when a route is not internal, skip SvelteKit processing and just issue the redirect. That way, we could tell users to always use goto for internal or external urls, and SvelteKit will be smart enough to know when it has to intervene and handle it.

opensas · 2023-03-17T17:58:04Z

I can confirm that this issue is solved in @sveltejs/[email protected] - #9391

wtachau · 2023-07-21T17:08:12Z

I believe I'm seeing this issue again, with Svelte version 4.0.5 and SvelteKit 1.22.3.

Calling goto with an API route (in this case, /api/login which begins an OAuth flow) causes a client error, which ends up getting logged to Sentry, etc.

Am I holding it wrong? Would it be helpful to create a reproduction or is the team aware? Let me know how I can be helpful, thanks!

CleanShot.2023-07-21.at.10.03.52.mp4

0cv · 2024-07-25T12:14:50Z

Having also this issue. My solution is simply to calculate the URL in the API but to not redirect from that API. Instead I just return the URL to the client with a fetch call and from the client side app I use window.location.href to eventually do the redirection

opensas changed the title ~~issuing a goto('/api/user') from client throws a "Error: Not found: /api/user" error~~ issuing a goto('/route') to an internal svelte page that redirects to an external url throws an "Error: Not found: /api/user" error Mar 14, 2023

dummdidumm added bug Something isn't working ready to implement please submit PRs for these issues! labels Mar 15, 2023

dummdidumm added this to the soon milestone Mar 15, 2023

dummdidumm added a commit that referenced this issue Mar 15, 2023

fix: don't start debugger on 404s

2948ed9

closes #9399

dummdidumm mentioned this issue Mar 15, 2023

fix: don't start debugger on 404s #9424

Merged

5 tasks

benmccann closed this as completed in #9424 Mar 15, 2023

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

issuing a goto('/route') to an internal svelte page that redirects to an external url throws an "Error: Not found: /api/user" error #9399

issuing a goto('/route') to an internal svelte page that redirects to an external url throws an "Error: Not found: /api/user" error #9399

opensas commented Mar 11, 2023 •

edited

Loading

kylebuildsstuff commented Mar 13, 2023 •

edited

Loading

zyxd commented Mar 13, 2023 •

edited

Loading

opensas commented Mar 14, 2023

opensas commented Mar 14, 2023 •

edited

Loading

opensas commented Mar 14, 2023

opensas commented Mar 15, 2023 •

edited

Loading

opensas commented Mar 17, 2023 •

edited

Loading

wtachau commented Jul 21, 2023

0cv commented Jul 25, 2024

issuing a goto('/route') to an internal svelte page that redirects to an external url throws an "Error: Not found: /api/user" error #9399

issuing a goto('/route') to an internal svelte page that redirects to an external url throws an "Error: Not found: /api/user" error #9399

Comments

opensas commented Mar 11, 2023 • edited Loading

Describe the bug

Expected behaviour

Reproduction

Logs

System Info

Severity

Additional Information

kylebuildsstuff commented Mar 13, 2023 • edited Loading

zyxd commented Mar 13, 2023 • edited Loading

opensas commented Mar 14, 2023

opensas commented Mar 14, 2023 • edited Loading

opensas commented Mar 14, 2023

opensas commented Mar 15, 2023 • edited Loading

opensas commented Mar 17, 2023 • edited Loading

wtachau commented Jul 21, 2023

0cv commented Jul 25, 2024

opensas commented Mar 11, 2023 •

edited

Loading

kylebuildsstuff commented Mar 13, 2023 •

edited

Loading

zyxd commented Mar 13, 2023 •

edited

Loading

opensas commented Mar 14, 2023 •

edited

Loading

opensas commented Mar 15, 2023 •

edited

Loading

opensas commented Mar 17, 2023 •

edited

Loading