23

My sveltekit app has a form which sends a POST request to server. The app is working fine on dev server but when I build and run the app it fails to send the form data via POST request. It shows the following error in the browser:

Cross-site POST form submissions are forbidden

H.B.
  • 166,899
  • 29
  • 327
  • 400
Shakir
  • 270
  • 2
  • 11

4 Answers4

21

You have to set the the ORIGIN env var like this

ORIGIN=http://localhost:3000 node build/index.js

https://github.com/sveltejs/kit/tree/master/packages/adapter-node#origin-protocol_header-and-host_header

Evan
  • 225
  • 4
  • 2
    Thank you, this worked. Also for anyone who's setting enviroment variables in powershell, `$env:ORIGIN = "http://127.0.0.1"` and run `node build/index.js` on the next line, because for some reason, powershell does not notice the change in env var when the env var is changed and the build command is run on the same line. – Shakir Dec 03 '22 at 11:54
  • 2
    What about `import adapter from '@sveltejs/adapter-auto';` ? how to fix this error with adapter-auto.. – Paul Grei Jan 08 '23 at 23:29
  • You can also set an environment variable `ORIGIN` when you deploy your app (for example when using Docker). Note that it is important whether you use `https://example.com` or `https://www.example.com` when setting the origin. – Daniel Veihelmann Apr 10 '23 at 06:15
  • you may need to benefit from node-adaptor if you are using sveltekit with latest version https://kit.svelte.dev/docs/adapter-node – Bitfinicon Jul 03 '23 at 08:09
8

This is a built-in protection against cross-site request forgery attacks in Sveltekit. Set csrf to false in svelte.config.js to allow cross-site post requests.

See csrf in the Sveltekit configuration docs

import adapter from '@sveltejs/adapter-node'

const config = {
  kit: {
    adapter: adapter(),
    csrf: {
      checkOrigin: false,
    }
  },
}

export default config
twsdot
  • 131
  • 3
  • 7
    I would _not_ advise to do this! CSRF attacks are a real thing and its important to have a protection against them. See the answer below by evan for the correct way to do it - you have to tell the sveltekit server about the actual origin domain when you start your sveltekit application. – Christian Engel Nov 20 '22 at 09:52
3

If you are using PM2 as process manager, it is similar with:

ORIGIN=https://yourapp.com pm2 restart /var/www/build/index.js --name 'yourapp' --update-env
Mike Casan Ballester
  • 1,690
  • 19
  • 33
2

This works: node -r dotenv/config build after including your new variable in .env ORIGIN=https://yourwebsite.com (please install it with npm install dotenv command as pointed out here)

Bitfinicon
  • 1,045
  • 1
  • 8
  • 22
  • Now it doesn't after updating it. Something may go wrong and it doesn't restart the serever, thus not loading origin as your domain – Bitfinicon Jul 04 '23 at 14:08
  • After several days, checked .env variables if they are loaded correctly, seems origin is undefined: process.env.ORIGIN. Check all of them `console.log(process.env)` – Bitfinicon Jul 04 '23 at 16:52