Jump to content

How do I pull email address from a member area using javascript?

Recommended Posts

This comment has been very helpful to retrieve first name and userID using javascript and cookies in a member area. However it doesn't work for email address and I can't figure out how to get email address from a member area after a user has registered. Can anyone help please? 

 

Link to comment
  • Replies 1
  • Created
  • Last Reply

Top Posters In This Topic

Popular Days

Top Posters In This Topic

Posted Images

OK, I'm going to start by saying you probably shouldn't be doing this. I don't know what you're trying to do with the email on the client side, but there are probably other places to deal with this sort of information. That said, I don't know your use-case, so I'm putting this here for information / educational use. (which is basically what I did for the comment you referenced).

As I said in the comment, once you've injected javascript you're working within the page, that means you can access the cookie, which in turn means that you can access the cross-site request forgery tokens and make calls to the squarespace api.

so, what you need to do is grab the cookie, pull out the xsrf tokens and then call squarespaces profile api which will return you a json object of the logged in user. you can then deconstruct that to get the things that you want. but like I said, this is probably a bad thing to do as you will be returning the users first name, last name and email address into the browser network logs. this method does also return information about their addresses and orders if you've added anything like that.

anyway, once that's done it's all relatively easy. this is the javascript that reads the cookie, finds the tokens, makes the call. note that the call is asynchronous so you have to do whatever work you want in the function. you won't be able to access the email until its returned.

const cookieObject = document.cookie.split(';')
    .map(kv => kv.split('='))
    .map(kv => [ kv[0].trim(), decodeURIComponent(kv[1]) ])
    .reduce((o,kv) => { o[kv[0]] = kv[1]; return o; },{})
    ;

const userSiteInfo = JSON.parse(cookieObject["SiteUserInfo"]);
const userFirstName = userSiteInfo["firstName"];
const userId = userSiteInfo["siteUserId"];
const xsrf1 = cookieObject["crumb"];
const xsrf2 = cookieObject["siteUserCrumb"];
const profileURL = "/api/site-users/account/profile";
const headers = { "x-csrf-token": xsrf1, "x-siteuser-xsrf-token": xsrf2 };
fetch(profileURL, { headers })
	.then(r => r.json())
	.then(j => {
  		const userEmailAddress = j.email;
  		const userLastName = j.name.lastName;
  		console.log(userId, userFirstName, userLastName, userEmailAddress);  
  		// do whatever you want with your data here
  		// but be very careful with peoples personal data!!!
	});

 so you could - for example - create a code block which declares a span and then inside the response set that span to be the email address. Again: I don't know why you want to do this, but I would think very hard as to whether you did this for anything other than sh*ts and giggles. they can already access this information in the account frame and that is retrieved using a server side post not a client side one so is more secure.

 

As you can see this returns the address book as well. (don't worry, I don't live in the Houses of Parliament), which could include a phone number. I mean, it's not *that* much of a worry in that you can only do this because they've already logged in, but still, I would question why you need to be making this API call and using this sort of data

You'll also note that it returns a Payment Cards array. Did I mention that I don't think you should be mucking around with this sort of stuff?! I don't have any fake cards on this site (it's squarespaces yoga site)

image.thumb.png.a2010eaa4b0a4eab22f8984ea515b817.png

 

Edited by iamdavehart
added picture to show output with more WTF are you doing comments

Dave Hart. Software/Technology Consultant living in London

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.