Vanilla 2.8.1 - Clicking on notifications gives 'invalid CRSF token' error [RESOLVED]

whu606

I've upgraded a Vanilla install to 2.8.1 and everything seems to work as expected, with the exception of notifications.

When clicking on the notifications I get the following pop-up

I've run utility/update successfully, but no change.

Users can change notification preferences, they just can't access notifications.

Anyone got an idea where I should start looking?

Thanks.

Shadowdare

Does anything show up in your browser's console?

whu606

@Shadowdare

Thanks for the response.

Nothing that I can obviously see, although I am not really sure I know what I'm looking for.

I've PM'd you a test user account if you have the time or inclination to look, but no worries if you don't.

Kaspar

https://pactsafe.freshdesk.com/support/solutions/articles/12000044430-invalid-csrf-token-error-message

Tl:dr

Ad or script blocker ?

Clear cookies

Browser allows cookies?

Kaspar

Similar/same

https://get.todoist.help/hc/en-us/articles/208951085-CSRF-token-error-messages

Kaspar

Sry, a little bit spam posting

https://community.nodebb.org/topic/5874/invalid-csrf-token-failed-login-attempt-errors

whu606

@Kaspar

Thanks for responding.

I have a live site with an earlier version of Vanilla that works as expected, and the error on the 2.8.1 text site occurs on various devices/browsers, so I don't think it is a browser issue. I suspect it is an error in the DB, but can't think where or why.

I'll do a clean install tomorrow and see if that has the same error.

Kaspar

Np :-)

It was just potential plausible results from a mere google for csrf token.

Have just checked notifications on my 2.8.1 test site (not a clean install but an upgrade on a clone of live site).

No issue.

Kaspar

"Use Gdn::request()->isAuthenticatedPostback() to check that the current user sent a POST request along with their TransientKey to protect against CSRF attacks. All forms built with Vanilla include a TransientKey."

https://docs.vanillaforums.com/developer/framework/requests/

Maybe an issue with how transientkey is stored.

You ran utility/update - what about utility/structure ?

whu606

Thanks.

Yes, utility/structure as well...

Even stranger:

Notifications on the live site do not have this issue.

However, if I use a copy of the live database for the testing server, the error appears, so it doesn't seem to be a DB issue after all...

Kaspar

Mkay...

Clone live site forum, upgrade to 2.8.1 - still same?

whu606

OK

So I've worked out it is an error relating to my custom theme and Vanilla 2.8.1.

All I have to do now is find out what is causing it...

Kaspar

Test with the base of your theme :-)

whu606

Thank you both for your help.

The issue was caused by a modified me.php module.

Removing that resolves the issue.

Shadowdare

Nice find, @whu606! Looks like the transient key has been required in the notifications popin action and the MeModule view since March 15, 2018, so your theme was missing that change.

charrondev

This is why I’m generally not in favour of view overrides. Styling with CSS is generally preferable when possible.

The views just aren’t granular enough right now.

whu606

@charrondev

I agree, although in my use case I wanted to add some items to the cog dropdown in the me module.

I suspect if I knew more I might be able to achieve the same effect with a plugin, but sometimes you have to settle for 'that works'.

donshakespeare

@whu606 I made my own Me cog dropdown more useful by adding a few links (My Discussions/Questions/Accepted Answers/Participated) in there with JavaScript. Since JS is required anyways to reveal the menu, I thought it no qualms to make my alterations JS-dependent.

To make it a bit respecting of user role, I generated some JS variables with Smarty from my default.master.tpl.

So my script knows for whom to inject dashboard-like links.

Sample code to target the flyout wherein to use insertBefore and so forth

$('.MeMenu >span').filter(':nth-child(4)').addClass('my-cog-wheel').find('.Flyout').addClass('my-cog-wheel-flyout');
//or
$('.MeMenu').find('.MeButton-user').parent().addClass('my-cog-wheel').find('.Flyout').addClass('my-cog-wheel-flyout');

Hope this helps.

whu606

@donshakespeare

Thanks very much for posting that.

I shall give it a go when I have a bit more time, and am feeling a bit more adventurous.