Start a new topic

SocialError : The state parameters did not match (CSRF attack?).

Hey there,



Im trying to setup login with facebook on my Webapp.



If I call _Kinvey.Social.connect(null, 'facebook')_ and wait when the new page opens and connects to facebook, then when it closes and goes back to my app's page I get this error:

**debug: "The state parameters did not match (CSRF attack?)."

description: "The social identity cannot be obtained."

name: "SocialError"**



But if, as soon as the new page opens to connect to facebook, I change tabs back to my apps webpage then when connection with facebook is done, it is successful.



Hope this makes sense. Just to reiterate. If I wait for the automatic change back to my web app then it fails but it I change manually back to my web app before the automatic change happens then it succeeds.



Any idea why?



Thanks.

> @Mark said:

> The problem is the Angular router uses a `#` for its routing. So the URL after the redirect back cannot be read successfully. I think this is solvable by manually specifying the redirect URL:

>

> ```

> Kinvey.Social.connect(null, 'facebook', { redirect: 'http://localhost:8000/' });

> ```



Mark, do you have any official resolution to this? I'm running into the same issue and haven't been able to resolve it.
Ok. I don't really Angular that well. I hope you manage to figure it out :smile:
Ah, didn't realize that. Yes, using Angular and the Angular SDK.
No, sorry Im routing pages by changing location.href. Are you using angular js? Are you setting up a single page web and switching pages with ajax?
> @kueckermann said:

> Hey,

>

> I setup mine in such a way that, when the user clicks login with facebook I redirect the page to a blank page ( Redirect the current page, not opening a new tab ). On this blank page I run Kinvey's Social Login,

>

> var promise = Kinvey.Social.connect(null, "facebook");

> promise.then(function(user) {

> // Set logged in cookie or some alternative.

> // Redirect to what ever url is relevant.

> ...

> }, function(error) {

> // Show error.

> // Redirect back to signup.

> ...

> });

>

> On the success callback I do something that tells my server that the user is now logged in (In my case, set a cookie), and I redirect the page back to something. ( In my case I redirect to the root url [ www.somewebsitehere.com/ ] and since my server knows there is now a user logged in it serves the logged in page )

>

> It's a bit easier it this way since the redirects are very controlled. Since a set mine up in this way I haven't had that error at all.

>

> Let me know if I should elaborate on something. Hope it can help you solve your issue.



Thanks for the reply! Are you using ngRoute or ui-router? I'm using ui-router and when the popup comes up, it's pointing to localhost:3000/undefined and I can't seem to figure out why.
Hey,



I setup mine in such a way that, when the user clicks login with facebook I redirect the page to a blank page ( Redirect the current page, not opening a new tab ). On this blank page I run Kinvey's Social Login,



var promise = Kinvey.Social.connect(null, "facebook");

promise.then(function(user) {

// Set logged in cookie or some alternative.

// Redirect to what ever url is relevant.

...

}, function(error) {

// Show error.

// Redirect back to signup.

...

});



On the success callback I do something that tells my server that the user is now logged in (In my case, set a cookie), and I redirect the page back to something. ( In my case I redirect to the root url [ www.somewebsitehere.com/ ] and since my server knows there is now a user logged in it serves the logged in page )



It's a bit easier it this way since the redirects are very controlled. Since a set mine up in this way I haven't had that error at all.



Let me know if I should elaborate on something. Hope it can help you solve your issue.
> @kalvin said:

> That wasn't able to fix my problem. So, my page starts off as http://localhost:8080/#/discover. Click on sign-in, and I've tried setting the redirect to both http://localhost:8080 and localhost:8080/#/discover, but neither work. Going straight to localhost:8080 redirects to http://localhost:8080/#/discover.



Same scenario for me. Were you able to resolve this?
I did try the manual redirect, but had no luck.
> @kueckermann said:

> I solved this by opening a new window without rewriting any urls and once the login was complete, returned to the previous window. Probably the way I should have done it in the beginning anyway. Works great.



Hi, any chance you could elaborate on this? My sign in page is at localhost:3000/#/signin and when I attempt to login with facebook, it opens a new popup with the url of localhost:3000/undefined, closes the window, and returns to the same sign in page. Yet it does create a user in the users table.



Stuck.
I solved this by opening a new window without rewriting any urls and once the login was complete, returned to the previous window. Probably the way I should have done it in the beginning anyway. Works great.
Thanks. Will look in the AngularJS board. I noticed that when I run the demo using phonegap in iOS simulator, it doesn't redirect or pop up the facebook login screen. Does anyone know how to enable the redirect/popup?
The trick is to intercept the url and avoid the redirect somehow. This seems more an AngularJS routing problem though, so I’d recommend using the [AngularJS boards](https://groups.google.com/forum/#!forum/angular).
Me too. The manual redirect doesn't work. I also run the demo in iOS simulator, encountering the same error "The state parameters did not match (CSRF attack?).". But running the demo on localhost:8000, it can work sometimes.
Hey I am also still having problems. I did find the reason why but I am not sure how to solve it.



In my application, when the user loads the page I call history.replaceState to fix any bad URL's the user may have typed in. If I call replaceState to set the URL to the correct URL it causes the facebook login to stop working.



I have also tried making the state variable on replaceState set to null, like it is if I dont call replaceState, but this didn't help. It seems the only way to fix the issue is not to use replaceState or pushState? Does anyone knows a way around this?
That wasn't able to fix my problem. So, my page starts off as http://localhost:8080/#/discover. Click on sign-in, and I've tried setting the redirect to both http://localhost:8080 and localhost:8080/#/discover, but neither work. Going straight to localhost:8080 redirects to http://localhost:8080/#/discover.
Login or Signup to post a comment