#Forms in SvelteLab

To use HTML Forms and SvelteKit Form Actions inside WebContainers (like we are using in SvelteLab), you will need to disable SvelteKit’s build in protection against cross-site request forgery (CSRF) attacks. Read more about it in the SvelteKit Docs.

You should probably never turn this setting off for production, but if you want to experiment with Forms inside WebContainers, disabling is currently the easiest workaround.

#Turn off SvelteKit CSRF Protection

Inside your SvelteLab project, open up the svelte.config.js. Inside the config object there should be a kit object. We need to add another key inside kit called csrf with its value set to false.

#Example svelte.config.js:

import adapter from '@sveltejs/adapter-auto';

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

export default config;