​
Overview

Userpilot provides two key functions for managing user sessions and content targeting: userpilot.identify and userpilot.reload. Understanding when and how to use each is essential for accurate user tracking and seamless content delivery, especially in modern web applications and Single Page Apps (SPAs).

​
userpilot.identify

The userpilot.identify function is used to uniquely identify a user and set their properties. This is typically called on the first page load after authentication, but can also be called whenever user properties change. When to use:
  • On initial page load after user authentication.
  • Whenever user properties (such as name, plan, or preferences) change during a session.
Example: Initial identification 
userpilot.identify("443", // Unique user ID
  { 
    name: "James",
    created_at: "2019-10-17", // ISO8601 Date
    plan: "Trial"
    // Additional user properties
    // projectId: "1"
    // trialEnds: "2019-10-31" // ISO8601 Date
  }
);
Example: Updating user properties If a user changes a property (e.g., their app color), you can call identify again with the new property: 
userpilot.identify("443", { color: "blue" });
You can call userpilot.identify multiple times on the same page as user properties change.

​
userpilot.reload

The userpilot.reload function refreshes Userpilot content based on the current page state or URL. This is especially important in Single Page Applications (SPAs), where the URL or page content can change without a full page reload. When to use:
  • After calling userpilot.identify (never before).
  • On every route or URL change in SPAs (e.g., React, Angular, Vue).
  • When you want Userpilot to re-evaluate which content to show based on the new page state.
Example: React route change 
import { useLocation } from "react-router-dom";

const location = useLocation();

React.useEffect(() => {
  if (isAuthenticated) {
    userpilot.reload();
  }
}, [location]);
Example: Angular route guard 
canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): boolean {
  const token = localStorage.getItem('token');
  if (token) {
    userpilot.reload();
    return true;
  } else {
    this.router.navigate(['/login']);
  }
}
Example: Vue router 
router.afterEach((route) => {
  userpilot.reload();
});
Note: Calling userpilot.reload before identifying the user will have no effect. Always ensure the user is identified first.

​
Summary Table

FunctionWhen to UseExample Use Case
userpilot.identifyOn first load after login, or when user properties changeUser logs in, updates profile info
userpilot.reloadAfter identify, on SPA route changes, or to refresh Userpilot UIUser navigates to a new page in an SPA
For more details, see the JavaScript SDK Reference or contact support@userpilot.com.