Search code examples
sveltevercelsveltekit

SvelteKit app sends plaintext file instead of HTML file on page refresh causing a file to download

I'm building a portfolio project using SvelteKit and hosting it on Vercel using serverless funcitons. I'm using SvelteKit for everything, from routing to serverless function implementation. The problem that I'm having is that everything works 100% when I test locally using npm run dev and even when I build the app locally using npm run build and test using npm run preview, but after it gets pushed to Vercel if you go to /dashboard and refresh it sends the file as a octet-stream file instead of an HTML file, causing the browser to download it.

If you register with the site and then get redirected to /dashboard everything works fine, but once you're there if you refresh the browser it will download a file. I've noticed that inside of the .vercel_build_output folder there is an index.html file and a dashboard file with no file extension.

What I've tried so far:

  • Updated all NPM packages
  • Hosted on Netlify with adapter-netlify to see if it was a Vercel specific problem, it does the same thing but instead of an octet-stream file it just sends a txt file
  • Disabled prerendering for all pages. There is no plaintext dashboard file in the .vercel_build_output folder anymore but on refresh it shows a page that says [Object object] instead of sending a HTML/octet-stream file
  • Removed load function inside dashboard __layout.svelte since it's the only page with a load function. It breaks the page since it can't fetch user data but it still sends a file on refresh
  • Changed filesystem structure inside of the project to try to get it to build correctly

Links:

SvelteKit is a pretty young tool so this whole issue could be a bug but I don't know enough to be able to tell if I'm being a goofball or if it's a bug! I've been getting beat up by this problem for a few days so any help is VERY appreciated!

Solution

  • Your hooks.js handle() method checks if the path starts with "dashboard" and tries to return a 303 redirect response. However, the Response object is missing the 'Redirect' body. If the body is added it no longer results in [Object object].

    This is definitely what is happening during prerendering, but I'm not sure why this would happen after registering. authToken would presumably be defined. Perhaps there is another bug in the auth/cookie code. (Ah, maybe the prerendered dashboard text file was being loaded from the static folder.)