Nuxt•12mo ago

Nuxt UI Button redirect to server route

The issue I'm having is that when I'm pressing the button I'm getting 404 Page not found: /auth/discord

but this route does exist on the server side. so if I refresh the page it then works.

<UButton to="/auth/discord">login with discord</UButton>

how can I fix it?

kapa.ai•12/29/24, 4:04 PM

Hi @kitten. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base.

kapa.ai•12/29/24, 4:04 PM

----------------------
Based on the information provided in the knowledge sources, it appears that you're encountering an issue with client-side navigation to a server route in Nuxt. To address this problem, you can try the following solution:

Instead of using the

to

to

prop on the component, you can use the event handler with the

navigateTo

navigateTo

function. This approach should properly handle the navigation to your server route. Here's how you can modify your code:

The option in the

navigateTo

navigateTo

function is crucial here. As explained in the navigateTo documentation (https://nuxt.com/docs/api/utils/navigate-to#external-url):

With :
Internal URLs navigate with a full-page reload.
External URLs navigate as expected.

This should ensure that your server route is properly accessed, even if it's not recognized as part of the client-side routing.

If you're still experiencing issues after implementing this solution, you may want to double-check your server route configuration to ensure it's properly set up in the

server/routes

server/routes

directory, as described in the Server Routes documentation (https://nuxt.com/docs/guide/directory-structure/server#server-routes).

Remember that server routes should be placed in the

server/routes

server/routes

directory if you don't want them to have the

/api

/api

prefix. For example:

This file should export a default function defined with

defineEventHandler()

defineEventHandler()

or .

kapa.ai•12/29/24, 4:04 PM

If the problem persists, you might need to investigate your Nuxt configuration and server setup further to ensure that the route is properly registered and accessible.
----------------------
Note: you can ask me a follow up question by @ mentioning me again

----------------------

kapa.ai•12/29/24, 4:04 PM

@1265695120725119036 Kapa.ai is still learning and improving, please let me know how I did by reacting below.