CSRF

[moshetanzer]

Hi,

Thanks again for your great library.

Having this issue wonder if you could point me in the right direction.

I have CSRF protection enabled for my login page. My app is hosted on Vercel.

Seems to be that the first time out customer comes back to app, the CSRF always fails and requires a page reload for it to work.

It is an internal app only used I would say weekly. Could it be something with vercel's Serverless architecture. Seems strange.

Any suggestions?

Latest version
nuxt-security:
nuxt:

[Baroshem]

That is an interesting question @Morgbn would you have some ideas about it?

[moshetanzer]

Have disabled for now... would love a solution

[moshetanzer]

Also been a pain since when you disable csurf in nuxt config. Whole app breaks since car is not found...

[christie-hill-za]

I also just noticed this issue with a form. I am hosting our Nuxt site on Azure Static Web Apps.

Not sure what the cause could be, but if I have more info, I will share here.

[Baroshem]

Don't have answer now. I would love to get feedback from @Morgbn about it as he knows the stuff :)

[moshetanzer]

Hi,

I think that maybe a warning should be put on the website (even thought it is by default disabled) that CSRF doesnt work properly with serverless functions.

[Morgbn]

Hello, I recently noticed the same thing on a project hosted on Cloudfare
I need to investigate,
I'll get back to you as soon as I know more!

[moshetanzer]

Issue is simple. Functions should be considered starless due to their cold state nature. Which means any solution using the same method cannot work. We have to change this CSRF to the Double submit cookie pattern.

UPDATE: Think it will be better and easier to just go with the Origin method. @Baroshem should we get the host from a ENV? Or Host or X-forwards host. Issue is that I think x forwarded is disabled by default?

If I have a bit of time 😇 will open a PR.

[Baroshem]

Hey @Morgbn any findings in your testing? :)

[moshetanzer]

Hey @Baroshem,

Sorry i havent managed to do a PR, might be quicker if you want just to add this as csrfOrigin so that the token can still be used for those not hosting on serverless.

Found this the other day it is from the oslo/request package. It use a safe header. Only issue with it is one of the version of internet explorer which i am not convinced is such a big issue.

This method is suggested also in the owasp in defence in deep" - https://cheatsheetseries.owasp.org/cheatsheets/Cross-Site_Request_Forgery_Prevention_Cheat_Sheet.html#using-standard-headers-to-verify-origin

export function verifyRequestOrigin(origin: string, allowedDomains: string[]): boolean {
	if (!origin || allowedDomains.length === 0) return false;
	const originHost = safeURL(origin)?.host ?? null;
	if (!originHost) return false;
	for (const domain of allowedDomains) {
		let host: string | null;
		if (domain.startsWith("http://") || domain.startsWith("https://")) {
			host = safeURL(domain)?.host ?? null;
		} else {
			host = safeURL("https://" + domain)?.host ?? null;
		}
		if (originHost === host) return true;
	}
	return false;
}

function safeURL(url: URL | string): URL | null {
	try {
		return new URL(url);
	} catch {
		return null;
	}
}

[moshetanzer]

Any updates on this?

[Baroshem]

Still waiting for the feedback from @Morgbn :)

[moshetanzer]

Wasn't suggesting to remove his package. Rather just add a this as 'corsOrigin'

[Baroshem]

@moshetanzer yeah, I understand. I am just asking for the opinion and guidance from the author of the nuxt-csurf package as this technically could be implemented there :)

@Morgbn let me know if you found something

[moshetanzer]

Congrats on major!

Hey @Baroshem seems like a pity to ship major security package without a working CSRF protection. Why don’t we just add in the meantime my above suggestion as csrf-origin or as a type on csrf.

[Baroshem]

Tagging @Morgbn for opinion :)