How can I find customer ID in custom pixels code?

Store Design
1

Hello,

I need authenticated customer id in pixels code.

analytics.subscribe("product_added_to_cart", async (event) => {
  // I need customer id here
});

Do you know any way to get customer id?

Thanks

2

Hi @serkanersan ,

First , you add a custom function to find customerID

  var getCustomerId = function() {
    try {
      let curr = window.ShopifyAnalytics.meta.page.customerId;
      if (curr !== undefined && curr !== null && curr !== "") {
        return curr;
      }
    } catch(e) { }
    try {
      let curr = window.meta.page.customerId;
      if (curr !== undefined && curr !== null && curr !== "") {
        return curr;
      }
    } catch (e) { }    
    try {
      let curr = _st.cid;
      if (curr !== undefined && curr !== null && curr !== "") {
        return curr;
      }
    } catch (e) { }
    try {
      let curr = ShopifyAnalytics.lib.user().traits().uniqToken;
      if (curr !== undefined && curr !== null && curr !== "") {
        return curr;
      }
    } catch (e) { }
    return null;
  }

Step 2 : In your function , call it ,example

analytics.subscribe("product_added_to_cart", async (event) => {
  // I need customer id here
   let customerId = getCustomerId();
});

Good luck!

3

Hi @BSS-Commerce ,

Thanks for your answer.

I tried but it always return null.

4

Hi @serkanersan ,

As a developer, I apologize for the inconvenience you’ve encountered. However, due to Shopify’s security measures, direct access to customer information from the client-side using JavaScript can be restricted.

You can try it by using shopify API

First : You include Jquery in html file

After:

analytics.subscribe("product_added_to_cart", async (event) => {
  // I need customer id here
  $.ajax({
    url: "https://your-development-store.myshopify.com/admin/api/2023-04/users/current.json",
    method: 'GET',
    headers: {
      'X-Shopify-Access-Token': 'YOUR_ACCESS_TOKEN',
    },
    success: function(response) {
      if (response.customers.length > 0) {
        var customerId = response.customers[0].id;
      //  customer id here
        console.log("Customer ID:", customerId);
      } else {
        console.log("NoCustomer ID ");
      }
    },
    error: function(xhr, status, error) {
      console.log("error:", error);
    }
  });
});

Please note that querying customer information from the server-side requires proper access permissions and valid authentication. You need to provide the authentication details of your Shopify store and handle authentication securely within your server-side application.

Hope it’s useful to you @serkanersan !

5

Have you found any solutions?

  • I am currently thinking you can get the customer id on theme.liquid then save it to localStorage and get it from there.

you can get customer id with : {{ customer.id }}

6

You can resolve this by creating a custom event.

In the frontend, publish the custom event as follows:

const customer_id = "{{ customer.id }}";
Shopify.analytics.publish("custom_product_add_to_cart", {product_id: "xxx", customer_id });

In this way, the custom event can send any data you want.

Next, subscribe to the custom event:

register(({analytics}) => {
  analytics.subscribe('custom_product_add_to_cart', (event) => {
    /*
      event = {
        id: "123",
        clientId: "2cabc5d8-e728-4359-9173-4b31265cbac0",
        name: "custom_product_add_to_cart",
        timestamp: "2011-10-05T14:48:00.000Z",
        context: { ... },
        customData: {
          product_id: "xxx",
          customer_id: "xxxx"
        }
      }
    */
  });
});

By doing this, you can obtain the customer ID using Web Pixel.

7

Hi @serkanersan , thank you for posting here!

You can follow my instruction below:

In the register function, you can access the .init object, then you can access all of the customer’s information once they have logged in.

register(({ analytics, browser, init, settings }) => {
  analytics.subscribe('product_added_to_cart', event => {
    console.log('product_added_to_cart', event);
    console.log('Customer', init.data.customer);
  });
});

console.log('Customer', init.data.customer);

If my answer is working for your store, please let me know by accepting Solution and giving Like !!!

8

Hi! Do you know if this field is restricted for sending to 3rd party vendors? Like GA4. All I’ve got is undefined, despite seeing it properly in the dataLayer(); object.