Jump to content

Read member name and info using Javascript in Member Area

Recommended Posts

  • 3 weeks later...

If you inject javascript code into the page then it executes within your domain / origin, which will mean that you can access the cookies within that origin. I haven't done much looking into this, but a quick inspection of the data in the developer tools make it look like you can get to some of this.

This is demo code, you'd definitely want to do better than this but this might get you started.


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 userEmailAddress = cookieObject["iterableEndUserId"];
const userFirstName = userSiteInfo["firstName"];
const userId = userSiteInfo["siteUserId"];

console.log(userId, userFirstName, userEmailAddress);

I don't have member areas on my site to test it properly but ran this in the console on the align/flow yoga demo site Squarespace put up and seemed ok. Not sure what you'll do with the Id, but I guess you could call Squarespace's internal client libraries with it. 

let me know if this helps

 

Dave Hart. Software/Technology Consultant living in London

Link to comment

Thanks Dave! Im not a pro with JS, but know almost every other language. Im just trying to call the members first name as part of a welcome message. In this case if I'm doing a code embed (After injecting this code above into the page), do I just call userFirstName within script tags?

Link to comment

@anonymous1

Sorry, I had conflated the original poster with you and assumed you knew a bit more javascript. Essentially all you need to do is have an element that you can put the variables into. document.write will work, but you might want to do it in a more robust manner by finding the element you'd created (or elements if you want to use it in multiple places).

so take out the console.log (which was just there for test purposes to show you the values) and replace it with some code that finds an element and updates its value. there's a million ways to do this, and how you implement it might depend on whether you're using a code block, or injecting the code in the page.

Here's an example with a code block. You add some HTML in to define where to put the firstname (I've done this with a class so that you could have multiple replacements) and then add a script block after it using the method I posted before. (I've added some more defensively written code so that it's less likely to error). so the code block contents would look like this:

<div>
  Hey <span class="customUsername">Friend</span>! 
  It's a beautiful day to have a beautiful day!
  Goodbye <span class="customUsername"></span>
</div>

<script>
  if (document.cookie) {
    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 info = cookieObject["SiteUserInfo"];
    const userSiteInfo = info ? JSON.parse(info) : {};
    const userFirstName = userSiteInfo["firstName"] || "";
    const usernamePlaces = document.querySelectorAll(".customUsername");
    usernamePlaces.forEach(function (u) {
    	while(u.firstChild) { u.removeChild(u.firstChild); }
		u.appendChild(document.createTextNode(userFirstName));
    });
  }
</script>

 

Dave Hart. Software/Technology Consultant living in London

Link to comment
  • 3 weeks later...
  • 1 year later...
On 10/31/2021 at 12:46 AM, tantrum said:

Thanks Dave.   I tried this on a Member Area and was able to get the first name and the userid, which is what I was looking for.   iterableEndUserId was not in the Cookie, but not an issue as I didn't need the email address.  Thanks again.

Has anyone had success getting the email address from the member area after a sign up? I also got first name and userID by using Dave's code above but email address wasn't available anywhere on that cookie and I couldn't find it elsewhere in the developer tools either. Thanks!

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.