User identification

See also: Identify Users

You can identify your users with Produktly to enable functionality such as:

• Store the user's progress on server-side
• For user-segmentation and custom filtering
• Track user journey (e.g. which product tours they have completed and when)

Providing exact instructions for user identication is difficult since the exact implementation always depends on your application/website, and where your user data is stored and/or fetched from. This guide is to help you understand the possible options, and some general guidance for the various options. It's by no means an exhaustive guide, and your software developer likely knows the best way to do this already.

Examples

Please note that this is by no means an exhaustive guide, and your software developer likely knows the best way to implement this already.

API endpoint

If your application has an API endpoint for returning current user's information you could implement user identification like this:

window.onload = async () => {
  const currentUser = await fetch("/users/current").then((res) => res.json());

  window.Produktly.identifyUser(currentUser.id, {
    name: currentUser.name,
    registeredAt: currentUser.registeredAt,
    plan: currentUser.plan,
  });
};

React hook

If you use React, and have already implemented some kind of useCurrentUser hook, you could implement user identification like this:

const ExampleReactComponent = () => {
  const currentUser = useCurrentUser();

  useEffect(() => {
    window.Produktly.identifyUser(currentUser.id, {
      name: currentUser.name,
      registeredAt: currentUser.registeredAt,
      plan: currentUser.plan,
    });
  }, [currentUser.id]);

  return ...;
};

User data from local storage

In case you store the current user's information on local storage, you could implement user identification this way:

window.onload = () => {
  const userData = JSON.parse(window.localStorage.getItem("current-user"));

  window.Produktly.identifyUser(userData.id, {
    name: userData.name,
    registeredAt: userData.registeredAt,
    plan: userData.plan,
  });
};

User data from a cookie

In case you store the current user's information on a cookie locally, you could implement user identification this way:

window.onload = () => {
  const cookieName = "current-user";
  const cookieValue = document.cookie
    .split("; ")
    .find((row) => row.startsWith(cookieName))
    ?.split("=")[1];

  const userData = JSON.parse(cookieName);

  window.Produktly.identifyUser(userData.id, {
    name: userData.name,
    registeredAt: userData.registeredAt,
    plan: userData.plan,
  });
};

User data from a JWT

If you use JWTs (JSON Web Tokens) and store them locally e.g. on local storage, you could implement user identification something like this:

window.onload = () => {
  const token = window.localStorage.getItem("token");
  // Many ways you can parse the token. You could use some external library. The simplest way is this though:
  const userData = JSON.parse(window.atob(token.split(".")[1]));

  window.Produktly.identifyUser(userData.id, {
    name: userData.name,
    registeredAt: userData.registeredAt,
    plan: userData.plan,
  });
};