CODEWITHSUNDEEP
nginxsveltesveltekit
dankobgd
dankobgd

Reputation: 416

sveltekit static adapter nginx deploy configuration

i have a go api that's also serving static files and a separate svelte-kit static site that i am serving with nginx.

There is a problem with the configuration with try_files i assume. with try_files line #1, site works perfectly fine but i can't view static files since nothing is being redirected to go api which is serving those...

try_files #2 fixes static files but then the problem is that few pages are broken after i hard refresh the page, i end up with nginx 403 or 404 error.

I can't have static files working and pages working normally after refresh. I tried something like that #3 example but it's the same... Basically i want to access those static files at mysite.co/public/images.logo.png for example. Do i need a separate nginx block, i can't figure it out.

nginx conf

upstream backend {
        server 127.0.0.1:3001;
}

server {
        server_name mysite.co www.mysite.co;

        location / {
                root /var/www/mysite.co;
                index index.html;
                #1 try_files $uri $uri/ /index.html;
                #2 try_files $uri $uri/ @go-api;
                #3 try_files $uri $uri.html /index.html @go-api;
        }

        location @go-api {
                proxy_pass http://backend;
                proxy_http_version 1.1;
                proxy_set_header Host $host;
                proxy_set_header X-Real-IP $remote_addr;
                proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
                proxy_set_header X-Forwarded-Host $server_name;
                proxy_set_header X-Forwarded-Port $server_port;
                proxy_set_header x-forwarded-proto $scheme;
                proxy_set_header Upgrade $http_upgrade;
                proxy_set_header Connection 'upgrade';
                proxy_cache_bypass $http_upgrade;
        }

        location /api/ {
                proxy_pass http://backend;
                proxy_http_version 1.1;
                proxy_set_header Host $host;
                proxy_set_header X-Real-IP $remote_addr;
                proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
                proxy_set_header X-Forwarded-Host $server_name;
                proxy_set_header X-Forwarded-Port $server_port;
                proxy_set_header x-forwarded-proto $scheme;
                proxy_set_header Upgrade $http_upgrade;
                proxy_set_header Connection 'upgrade';
                proxy_cache_bypass $http_upgrade;
        }
}

svelte.config.js

import adapter from '@sveltejs/adapter-static';
import preprocess from 'svelte-preprocess';

const config = {
  preprocess: preprocess(),

  kit: {
    adapter: adapter({
      pages: 'build',
      assets: 'build',
      fallback: 'index.html',
      precompress: false,
    }),
    prerender: {
      default: true,
    },
  },
};

export default config;

i am serving static files at /public with this code (using chi router)

subFS, err := fs.Sub(a.PublicFS(), "public")
if err != nil {
    panic("failed to serve static files: " + err.Error())
}
r.Handle("/public/*", http.StripPrefix("/public/", http.FileServer(http.FS(subFS))))

Upvotes: 0

Views: 1901

Answers (1)

Omar Siddiqui
Omar Siddiqui

Reputation: 1655

If all your static files will be available at the mysite.co/public path, add this block to your config:

location /public/ {
    include proxy_params;
    try_files $uri $uri/ @go.api;
}

It will redirect the traffic for paths that contain the public substring in them to the go api, instead of searching for those files on the svelte static site

Upvotes: 3

Related Questions