{"id":2843,"date":"2012-05-06T17:10:48","date_gmt":"2012-05-06T11:40:48","guid":{"rendered":"http:\/\/JitendraZaa.com\/blog\/?p=2843"},"modified":"2012-05-06T17:10:48","modified_gmt":"2012-05-06T11:40:48","slug":"streaming-api-using-jquery-salesforce","status":"publish","type":"post","link":"https:\/\/www.jitendrazaa.com\/blog\/others\/tips\/streaming-api-using-jquery-salesforce\/","title":{"rendered":"Streaming API Using JQuery &#8211; Salesforce"},"content":{"rendered":"<p style=\"text-align: justify;\">Push technology is a model of Internet-based communication in which information transfer is initiated <strong>from a server to the client<\/strong>. Also called the publish\/subscribe model, this type of communication is the opposite of pull technology in which a request for information is made from a client to the server. The information that&#8217;s sent by the server is typically specified in advance. When using Streaming API, you specify the information the client receives by creating a PushTopic. The client then subscribes to the PushTopic channel to be notified of events that match the PushTopic criteria.<\/p>\n<p style=\"text-align: justify;\">In push technology, the server pushes out information to the client after the client has subscribed to a channel of information. In order for the client to receive the information, the client must maintain a connection to the server. <strong>Streaming API uses the Bayeux protocol and <a title=\"Wikipedia Tutorial\" href=\"http:\/\/en.wikipedia.org\/wiki\/Comet_(programming)\" rel=\"nofollow\">CometD<\/a><\/strong>, so the client to server connection is maintained through long polling.<\/p>\n<p>The Bayeux protocol and CometD both use long polling.<\/p>\n<ol>\n<li>Bayeux is a protocol for transporting asynchronous messages, primarily over HTTP.<\/li>\n<li>CometD is a scalable HTTP-based event routing bus that<strong> uses an AJAX push technology pattern known as Comet<\/strong>. It implements the Bayeux protocol.<\/li>\n<\/ol>\n<p>There is nice jQuery plugin available on web which implements Bayeux protocol and CometD.<\/p>\n<p><a title=\"Streaming API Documentation\" href=\"http:\/\/www.salesforce.com\/us\/developer\/docs\/api_streaming\/index_Left.htm#StartTopic=Content\/code_sample_java_add_source.htm\">Navigate here for Salesforce documentation for Streaming API.<\/a><\/p>\n<p><strong>Common Terms used in Streaming API:<\/strong><\/p>\n<ul>\n<li><strong>Event :<\/strong> Either the creation of a record or the update of a record. Each event may trigger a notification.<\/li>\n<li><strong>Notification :<\/strong> A message in response to an event. The notification is sent to a channel to which one or more clients are subscribed.<\/li>\n<li><strong>PushTopic :<\/strong> A record that you create. The essential element of a PushTopic is the SOQL query. The PushTopic defines a Streaming API channel.<\/li>\n<\/ul>\n<p><strong>Example used in this article : <\/strong><\/p>\n<p><strong><\/strong>I want notifications about all opportunity whose status is won.<br \/>\n<em>First step to implement any streaming API is to create the Push Topic, which is going to subscribed by all the clients.<\/em><br \/>\n<strong><\/strong><\/p>\n<p><strong>Create PushTopic:<\/strong><\/p>\n<p>To create PushTopic, we will need the developer console of the Salesforce and assume that the name of the topic is &#8220;WonOpportunity&#8221;.<\/p>\n<pre class=\"brush: csharp; title: ; notranslate\" title=\"\">\nPushTopic pushTopic = new PushTopic();\npushTopic.ApiVersion = 23.0;\npushTopic.Name = 'WonOpportunity';\npushTopic.Description = 'Notify if the Opportunity won';\npushTopic.NotifyForOperations = 'All';\npushTopic.NotifyForFields = 'Referenced';\npushtopic.Query = 'Select o.OwnerId, o.Name, o.IsWon, o.Id, o.Amount From Opportunity o WHERE o.IsWon = true';\ninsert pushTopic;\nSystem.debug('Created new PushTopic: '+ pushTopic.Id);\n<\/pre>\n<figure id=\"attachment_2845\" aria-describedby=\"caption-attachment-2845\" style=\"width: 645px\" class=\"wp-caption aligncenter\"><a href=\"https:\/\/i0.wp.com\/jitendrazaa.com\/blog\/wp-content\/uploads\/2012\/05\/Salesforce-Streaming-API-Create-Push-topic.png?ssl=1\"><img data-recalc-dims=\"1\" loading=\"lazy\" decoding=\"async\" class=\" wp-image-2845  \" title=\"Salesforce Streaming API - Create Push topic\" src=\"https:\/\/i0.wp.com\/jitendrazaa.com\/blog\/wp-content\/uploads\/2012\/05\/Salesforce-Streaming-API-Create-Push-topic-1024x332.png?resize=645%2C209&#038;ssl=1\" alt=\"Salesforce Streaming API - Create Push topic\" width=\"645\" height=\"209\" \/><\/a><figcaption id=\"caption-attachment-2845\" class=\"wp-caption-text\">Salesforce Streaming API - Create Push topic<\/figcaption><\/figure>\n<p><strong><!--more-->Step 2:<\/strong><br \/>\nDownload the CometD compressed archive (.tgz) file from<a title=\"cometd implementation\" href=\"http:\/\/download.cometd.org\/cometd-2.2.0-distribution.tar.gz\" rel=\"nofollow\"> http:\/\/download.cometd.org\/cometd-2.2.0-distribution.tar.gz<\/a><br \/>\n<strong><\/strong><\/p>\n<p><strong>Step 3:<\/strong><br \/>\nIn the extracted folder you will find the war file at location &#8220;cometd-2.2.0\/cometd-javascript\/common\/target&#8221;.<\/p>\n<p>Unpack that war file using below DOS command in Windows and same command will work on shell also<\/p>\n<pre class=\"brush: powershell; title: ; notranslate\" title=\"\">\ncd cometd-2.2.0\/cometd-javascript\/common\/target\njar xvf cometd-javascript-common-2.2.0.war org\/cometd.js\n<\/pre>\n<figure id=\"attachment_2846\" aria-describedby=\"caption-attachment-2846\" style=\"width: 627px\" class=\"wp-caption aligncenter\"><a href=\"https:\/\/i0.wp.com\/jitendrazaa.com\/blog\/wp-content\/uploads\/2012\/05\/Salesforce-UnPack-war-file-Streaming-API.png?ssl=1\"><img data-recalc-dims=\"1\" loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-2846\" title=\"Salesforce UnPack war file - Streaming API\" src=\"https:\/\/i0.wp.com\/jitendrazaa.com\/blog\/wp-content\/uploads\/2012\/05\/Salesforce-UnPack-war-file-Streaming-API.png?resize=627%2C150&#038;ssl=1\" alt=\"Salesforce UnPack war file - Streaming API\" width=\"627\" height=\"150\" \/><\/a><figcaption id=\"caption-attachment-2846\" class=\"wp-caption-text\">Salesforce UnPack war file - Streaming API<\/figcaption><\/figure>\n<p>If you will not follow the above step and if use different &#8220;cometd.js&#8221; file then you may get error <strong>&#8220;Uncaught ReferenceError: org is not defined&#8221;\u009d<\/strong><br \/>\n<strong><\/strong><\/p>\n<p><strong>Step 4:<\/strong><br \/>\nExtract the following JavaScript files from &#8220;<em>cometd-2.2.0-distribution.tar.gz<\/em>&#8221;<\/p>\n<ul>\n<li>cometd-2.2.0\/cometd-javascript\/common\/target\/org\/cometd.js <em>(This file must be from war file)<\/em><\/li>\n<li>cometd-2.2.0\/cometd-javascript\/jquery\/src\/main\/webapp\/jquery\/jquery-1.5.1.js<\/li>\n<li>cometd-2.2.0\/cometd-javascript\/jquery\/src\/main\/webapp\/jquery\/json2.js<\/li>\n<li>cometd-2.2.0\/cometd-javascript\/jquery\/src\/main\/webapp\/jquery\/jquery.cometd.js<\/li>\n<\/ul>\n<p><strong>Step 5:<\/strong><br \/>\nCreate a Visualforce page with following code :<\/p>\n<pre class=\"brush: xml; title: ; notranslate\" title=\"\">\n&lt;apex:page &gt;\n\n&lt;apex:includeScript value=&quot;{!URLFOR($Resource.SteamingAPI, 'StreaminAPI\/JQueryComet\/Cometd.js')}&quot;\/&gt;\n&lt;apex:includeScript value=&quot;{!URLFOR($Resource.SteamingAPI, 'StreaminAPI\/jquery_1.5.2.min.js')}&quot;\/&gt;\n&lt;apex:includeScript value=&quot;{!URLFOR($Resource.SteamingAPI, 'StreaminAPI\/JQueryComet\/json2.js')}&quot;\/&gt;\n&lt;apex:includeScript value=&quot;{!URLFOR($Resource.SteamingAPI, 'StreaminAPI\/JQueryComet\/jquery.cometd.js')}&quot;\/&gt;\n\n&lt;apex:includeScript value=&quot;{!URLFOR($Resource.SteamingAPI, 'StreaminAPI\/Style\/jquery-animate-css-rotate-scale.js')}&quot;\/&gt;\n&lt;apex:includeScript value=&quot;{!URLFOR($Resource.SteamingAPI, 'StreaminAPI\/Style\/jquery-css-transform.js')}&quot;\/&gt;\n\n&lt;apex:stylesheet value=&quot;{!URLFOR($Resource.SteamingAPI, 'StreaminAPI\/Style\/style.css')}&quot;\/&gt;\n\n&lt;div class=&quot;menu&quot;&gt;\n&lt;!-- Place holder for notifications --&gt;\n&lt;\/div&gt;\n\n\t &lt;script type=&quot;text\/javascript&quot;&gt;\n\t    var $jq = jQuery.noConflict();\n\n            $jq('.item').click(\n                function(){\n                    var $this = $jq(this);\n                    expand($this);\n                }\n            );\n            function expand($elem){\n                var angle = 0;\n                var t = setInterval(function () {\n                    if(angle == 1440){\n                        clearInterval(t);\n                        return;\n                    }\n                    angle += 40;\n                    $jq('.link',$elem).stop().animate({rotate: '+=-40deg'}, 0);\n                },10);\n                $elem.stop().animate({width:'500px'}, 1000)\n                .find('.item_content').fadeIn(400);\n            }\n\n           function createEle(data)\n           {\n\t           \tvar $itemDiv = $jq(document.createElement('div'));\n\t           \t$itemDiv.addClass('item');\n\n\t           \tvar $anch =  $jq(document.createElement('a'));\n\t           \t$anch.addClass('link');\n\t           \t$anch.addClass('icon_alert');\n\n\t           \tvar $contentDiv = $jq(document.createElement('div'));\n\t           \t$contentDiv.addClass('item_content');\n\n\t           \tvar $h2 = $jq(document.createElement('h2'));\n\t           \t$h2.html('Won New Opportunity');\n\t           \t$contentDiv.append($h2);\n\n\t           \t$contentDiv.append('&lt;br \/&gt;Name : '+data.Name+' &lt;br \/&gt;\tAmount : '+data.Amount+' &lt;br \/&gt;&lt;a href=&quot;#&quot;&gt; Navigate to Opportunity &lt;\/a&gt;');\n\n\t           \t$itemDiv.append($anch);\n\t           \t$itemDiv.append($contentDiv);\n\t           \t$jq(&quot;.menu&quot;).append($itemDiv);\n\t           \texpand($itemDiv);\n           }\n\n           $jq(function() {\n\t\t\t \t \/\/ Connect to the CometD endpoint\n\n\t            $jq.cometd.init({\n\t               url: window.location.protocol+'\/\/'+window.location.hostname+'\/cometd\/23.0\/',\n\t               requestHeaders: { Authorization: 'OAuth {!$Api.Session_ID}'}\n\t           });\n\n\t          $jq.cometd.subscribe('\/topic\/WonOpportunity', function(message) {\n\t          \t\tcreateEle(message.data.sobject);\n\t            });\n\n\t\t\t});\n\n        &lt;\/script&gt;\n&lt;\/apex:page&gt;\n<\/pre>\n<p>After saving this page, open same salesforce instance in other browser or tab and make change to any opportunity with status &#8220;won&#8221;, it will display an alert that opportunity is won.<br \/>\n<strong>Output:<\/strong><\/p>\n<figure id=\"attachment_2847\" aria-describedby=\"caption-attachment-2847\" style=\"width: 543px\" class=\"wp-caption aligncenter\"><a href=\"https:\/\/i0.wp.com\/jitendrazaa.com\/blog\/wp-content\/uploads\/2012\/05\/Salesforce-Streaming-API-Example.png?ssl=1\"><img data-recalc-dims=\"1\" loading=\"lazy\" decoding=\"async\" class=\" wp-image-2847 \" title=\"Salesforce Streaming API Example\" src=\"https:\/\/i0.wp.com\/jitendrazaa.com\/blog\/wp-content\/uploads\/2012\/05\/Salesforce-Streaming-API-Example.png?resize=543%2C340&#038;ssl=1\" alt=\"Salesforce Streaming API Example\" width=\"543\" height=\"340\" \/><\/a><figcaption id=\"caption-attachment-2847\" class=\"wp-caption-text\">Salesforce Streaming API Example<\/figcaption><\/figure>\n<p><strong>JSON Reponse:<\/strong><br \/>\nfollowing JSON response we gets from Streaming API. The Rows returned in Object depends upon the Push topic create earlier.<\/p>\n<pre class=\"brush: xml; title: ; notranslate\" title=\"\">\n&#x5B;\n   {\n      &quot;channel&quot;:&quot;\/topic\/WonOpportunity&quot;,\n      &quot;data&quot;:{\n         &quot;event&quot;:{\n            &quot;type&quot;:&quot;created&quot;,\n            &quot;createdDate&quot;:&quot;2012-05-05T10:06:45.000+0000&quot;\n         },\n         &quot;sobject&quot;:{\n            &quot;Name&quot;:&quot;om&quot;,\n            &quot;IsWon&quot;:true,\n            &quot;Amount&quot;:null,\n            &quot;OwnerId&quot;:&quot;00590000000Gl5VAAS&quot;,\n            &quot;Id&quot;:&quot;00690000006C8yFAAS&quot;\n         }\n      }\n   },\n   {\n      &quot;channel&quot;:&quot;\/meta\/connect&quot;,\n      &quot;advice&quot;:{\n         &quot;reconnect&quot;:&quot;retry&quot;,\n         &quot;interval&quot;:0,\n         &quot;timeout&quot;:110000\n      },\n      &quot;successful&quot;:true,\n      &quot;id&quot;:&quot;3&quot;\n   }\n]\n<\/pre>\n<p><strong>Debugging Streaming API:<\/strong><br \/>\nWe can use &#8220;<strong>firebug<\/strong>&#8221; plugin of Mozilla to check whether the http request is made or not from JQuery (comet). Following screen can give you little idea about the http (<a title=\"AJAX Introduction\" href=\"http:\/\/en.wikipedia.org\/wiki\/Ajax_(programming)\" rel=\"nofollow\">XHR<\/a>) requests made from JQuery .<\/p>\n<figure id=\"attachment_2849\" aria-describedby=\"caption-attachment-2849\" style=\"width: 574px\" class=\"wp-caption aligncenter\"><a href=\"https:\/\/i0.wp.com\/jitendrazaa.com\/blog\/wp-content\/uploads\/2012\/05\/Firebug-Tool-Debugging-Streaming-API-of-Salesforce.png?ssl=1\"><img data-recalc-dims=\"1\" loading=\"lazy\" decoding=\"async\" class=\" wp-image-2849   \" title=\"Firebug Tool - Debugging Streaming API of Salesforce\" src=\"https:\/\/i0.wp.com\/jitendrazaa.com\/blog\/wp-content\/uploads\/2012\/05\/Firebug-Tool-Debugging-Streaming-API-of-Salesforce-1024x310.png?resize=574%2C174&#038;ssl=1\" alt=\"Firebug Tool - Debugging Streaming API of Salesforce\" width=\"574\" height=\"174\" \/><\/a><figcaption id=\"caption-attachment-2849\" class=\"wp-caption-text\">Firebug Tool - Debugging Streaming API of Salesforce<\/figcaption><\/figure>\n<p><a href=\"https:\/\/jitendrazaa.com\/blog\/wp-content\/uploads\/2012\/05\/StreaminAPI.zip\">Download Static Resource used in this article for Streaming API example of salesforce<\/a><\/p>\n<p><strong>Output Video of Streaming API:<\/strong><\/p>\n<p><iframe loading=\"lazy\" src=\"http:\/\/www.youtube.com\/embed\/wDLdXLee43U\" frameborder=\"0\" width=\"560\" height=\"315\"><\/iframe><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Tutorial of Streaming API in Salesforce with Source code and Demo Video &#8211; Implementation of Bayeux protocol and CometD using JQuery and JSON<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"advanced_seo_description":"","jetpack_seo_html_title":"","jetpack_seo_noindex":false,"_jetpack_newsletter_access":"","_jetpack_dont_email_post_to_subs":false,"_jetpack_newsletter_tier_id":0,"_jetpack_memberships_contains_paywalled_content":false,"jz_research_post":"","_jetpack_memberships_contains_paid_content":false,"footnotes":"","jetpack_post_was_ever_published":false},"categories":[17],"tags":[134,331],"class_list":["post-2843","post","type-post","status-publish","format-standard","hentry","category-tips","tag-jquery","tag-salesforce"],"jetpack_featured_media_url":"","jetpack_sharing_enabled":true,"jetpack-related-posts":[{"id":31310,"url":"https:\/\/www.jitendrazaa.com\/blog\/salesforce\/salesforce-mcp-server-for-claude-code-mcp-clients-setup\/","url_meta":{"origin":2843,"position":0},"title":"Salesforce MCP Server for Claude Code &amp; MCP Clients: Setup Guide 2026","author":"Jitendra Zaa","date":"January 30, 2026","format":false,"excerpt":"Master Salesforce MCP Server setup for Claude Code and other MCP clients. Step-by-step guide covering DX MCP Server, OAuth setup, hosted servers, and mcp-remote configuration.","rel":"","context":"In &quot;AI&quot;","block_context":{"text":"AI","link":"https:\/\/www.jitendrazaa.com\/blog\/category\/ai\/"},"img":{"alt_text":"Salesforce MCP Server for Claude Code & MCP Clients - Complete Developer Guide 2026","src":"https:\/\/i0.wp.com\/www.jitendrazaa.com\/blog\/wp-content\/uploads\/2026\/01\/salesforce-mcp-server-claude-code-guide-featured.png?fit=1200%2C675&ssl=1&resize=350%2C200","width":350,"height":200,"srcset":"https:\/\/i0.wp.com\/www.jitendrazaa.com\/blog\/wp-content\/uploads\/2026\/01\/salesforce-mcp-server-claude-code-guide-featured.png?fit=1200%2C675&ssl=1&resize=350%2C200 1x, https:\/\/i0.wp.com\/www.jitendrazaa.com\/blog\/wp-content\/uploads\/2026\/01\/salesforce-mcp-server-claude-code-guide-featured.png?fit=1200%2C675&ssl=1&resize=525%2C300 1.5x, https:\/\/i0.wp.com\/www.jitendrazaa.com\/blog\/wp-content\/uploads\/2026\/01\/salesforce-mcp-server-claude-code-guide-featured.png?fit=1200%2C675&ssl=1&resize=700%2C400 2x, https:\/\/i0.wp.com\/www.jitendrazaa.com\/blog\/wp-content\/uploads\/2026\/01\/salesforce-mcp-server-claude-code-guide-featured.png?fit=1200%2C675&ssl=1&resize=1050%2C600 3x"},"classes":[]},{"id":3649,"url":"https:\/\/www.jitendrazaa.com\/blog\/salesforce\/client-side-templating-using-underscore-js-and-jquery\/","url_meta":{"origin":2843,"position":1},"title":"Client side Templating using Underscore.js and JQuery","author":"Jitendra","date":"January 2, 2014","format":false,"excerpt":"Recently, I ran into requirement where I was getting JSON response and needed to render it on my Mobile application. I had two Options, Server side processing and Client side Templating. I studied and checked both way ; came to conclusion on using Client side Templating. There are many plugins\u2026","rel":"","context":"In &quot;HTML&quot;","block_context":{"text":"HTML","link":"https:\/\/www.jitendrazaa.com\/blog\/category\/webtech\/web\/"},"img":{"alt_text":"Underscore.js","src":"https:\/\/i0.wp.com\/jitendrazaa.com\/blog\/wp-content\/uploads\/2014\/01\/Underscore-js.png?resize=350%2C200&ssl=1","width":350,"height":200},"classes":[]},{"id":3762,"url":"https:\/\/www.jitendrazaa.com\/blog\/salesforce\/salesforce-rest-api-playground\/","url_meta":{"origin":2843,"position":2},"title":"Salesforce REST API Playground","author":"Jitendra Zaa","date":"February 25, 2014","format":false,"excerpt":"What is REST API ? In my words, Getting data from Other System or Same System using HTTP request is known as REST API. If you know, how website works, you know REST API. Before REST API, there was SOAP request which needed lots of configuration and very tightly coupled.\u2026","rel":"","context":"In &quot;Salesforce&quot;","block_context":{"text":"Salesforce","link":"https:\/\/www.jitendrazaa.com\/blog\/category\/salesforce\/"},"img":{"alt_text":"REST API playground in Salesforce","src":"https:\/\/i0.wp.com\/www.jitendrazaa.com\/blog\/wp-content\/uploads\/2014\/02\/REST-API-playground-in-Salesforce-1024x362.png?resize=350%2C200&ssl=1","width":350,"height":200,"srcset":"https:\/\/i0.wp.com\/www.jitendrazaa.com\/blog\/wp-content\/uploads\/2014\/02\/REST-API-playground-in-Salesforce-1024x362.png?resize=350%2C200&ssl=1 1x, https:\/\/i0.wp.com\/www.jitendrazaa.com\/blog\/wp-content\/uploads\/2014\/02\/REST-API-playground-in-Salesforce-1024x362.png?resize=525%2C300&ssl=1 1.5x"},"classes":[]},{"id":2874,"url":"https:\/\/www.jitendrazaa.com\/blog\/salesforce\/introduction-to-view-state-in-visualforce\/","url_meta":{"origin":2843,"position":3},"title":"Introduction to View State in Visualforce","author":"Jitendra","date":"June 1, 2012","format":false,"excerpt":"Introduction to View State in Visualforce with example and code walk-through","rel":"","context":"In &quot;Apex&quot;","block_context":{"text":"Apex","link":"https:\/\/www.jitendrazaa.com\/blog\/category\/salesforce\/apex\/"},"img":{"alt_text":"View State in Salesforce before Postback","src":"https:\/\/i0.wp.com\/jitendrazaa.com\/blog\/wp-content\/uploads\/2012\/05\/View-State-in-Salesforce-before-Postback-1024x287.png?resize=350%2C200&ssl=1","width":350,"height":200,"srcset":"https:\/\/i0.wp.com\/jitendrazaa.com\/blog\/wp-content\/uploads\/2012\/05\/View-State-in-Salesforce-before-Postback-1024x287.png?resize=350%2C200&ssl=1 1x, https:\/\/i0.wp.com\/jitendrazaa.com\/blog\/wp-content\/uploads\/2012\/05\/View-State-in-Salesforce-before-Postback-1024x287.png?resize=525%2C300&ssl=1 1.5x"},"classes":[]},{"id":6048,"url":"https:\/\/www.jitendrazaa.com\/blog\/salesforce\/15-ways-to-improve-performance-of-lightning-components-in-salesforce\/","url_meta":{"origin":2843,"position":4},"title":"15 ways to improve performance of Lightning Components in Salesforce","author":"Jitendra","date":"May 12, 2018","format":false,"excerpt":"Improve Lightning Component performance using simple 15 rules like Storable Actions, avoiding server trips, Lightning Data Service, Unidirectional data binding, creating component APIs etc","rel":"","context":"In &quot;Salesforce&quot;","block_context":{"text":"Salesforce","link":"https:\/\/www.jitendrazaa.com\/blog\/category\/salesforce\/"},"img":{"alt_text":"15 ways to improve Performance of Lightning Component","src":"https:\/\/i0.wp.com\/www.jitendrazaa.com\/blog\/wp-content\/uploads\/2018\/05\/Screen-Shot-2018-05-12-at-1.31.43-PM.png?fit=1200%2C307&ssl=1&resize=350%2C200","width":350,"height":200,"srcset":"https:\/\/i0.wp.com\/www.jitendrazaa.com\/blog\/wp-content\/uploads\/2018\/05\/Screen-Shot-2018-05-12-at-1.31.43-PM.png?fit=1200%2C307&ssl=1&resize=350%2C200 1x, https:\/\/i0.wp.com\/www.jitendrazaa.com\/blog\/wp-content\/uploads\/2018\/05\/Screen-Shot-2018-05-12-at-1.31.43-PM.png?fit=1200%2C307&ssl=1&resize=525%2C300 1.5x, https:\/\/i0.wp.com\/www.jitendrazaa.com\/blog\/wp-content\/uploads\/2018\/05\/Screen-Shot-2018-05-12-at-1.31.43-PM.png?fit=1200%2C307&ssl=1&resize=700%2C400 2x, https:\/\/i0.wp.com\/www.jitendrazaa.com\/blog\/wp-content\/uploads\/2018\/05\/Screen-Shot-2018-05-12-at-1.31.43-PM.png?fit=1200%2C307&ssl=1&resize=1050%2C600 3x"},"classes":[]},{"id":31227,"url":"https:\/\/www.jitendrazaa.com\/blog\/salesforce\/ga4-tealium-implementation-for-salesforce-b2c-commerce-2\/","url_meta":{"origin":2843,"position":5},"title":"GA4 &amp; Tealium Implementation for Salesforce B2C Commerce: Complete Guide 2026","author":"Jitendra Zaa","date":"January 25, 2026","format":false,"excerpt":"Learn how to implement Google Analytics 4 (GA4) with Tealium on Salesforce B2C Commerce. This comprehensive guide covers data layer setup, server-side tracking, consent management, and real-world implementation patterns for ecommerce analytics.","rel":"","context":"In &quot;Experience&quot;","block_context":{"text":"Experience","link":"https:\/\/www.jitendrazaa.com\/blog\/category\/experience\/"},"img":{"alt_text":"GA4 & Tealium Implementation for Salesforce B2C Commerce Guide - Featured Image","src":"https:\/\/i0.wp.com\/www.jitendrazaa.com\/blog\/wp-content\/uploads\/2026\/01\/GA4-Tealium-Salesforce-B2C-Commerce-Guide-featured.png?fit=1200%2C675&ssl=1&resize=350%2C200","width":350,"height":200,"srcset":"https:\/\/i0.wp.com\/www.jitendrazaa.com\/blog\/wp-content\/uploads\/2026\/01\/GA4-Tealium-Salesforce-B2C-Commerce-Guide-featured.png?fit=1200%2C675&ssl=1&resize=350%2C200 1x, https:\/\/i0.wp.com\/www.jitendrazaa.com\/blog\/wp-content\/uploads\/2026\/01\/GA4-Tealium-Salesforce-B2C-Commerce-Guide-featured.png?fit=1200%2C675&ssl=1&resize=525%2C300 1.5x, https:\/\/i0.wp.com\/www.jitendrazaa.com\/blog\/wp-content\/uploads\/2026\/01\/GA4-Tealium-Salesforce-B2C-Commerce-Guide-featured.png?fit=1200%2C675&ssl=1&resize=700%2C400 2x, https:\/\/i0.wp.com\/www.jitendrazaa.com\/blog\/wp-content\/uploads\/2026\/01\/GA4-Tealium-Salesforce-B2C-Commerce-Guide-featured.png?fit=1200%2C675&ssl=1&resize=1050%2C600 3x"},"classes":[]}],"jetpack_likes_enabled":true,"_links":{"self":[{"href":"https:\/\/www.jitendrazaa.com\/blog\/wp-json\/wp\/v2\/posts\/2843","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.jitendrazaa.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.jitendrazaa.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.jitendrazaa.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.jitendrazaa.com\/blog\/wp-json\/wp\/v2\/comments?post=2843"}],"version-history":[{"count":0,"href":"https:\/\/www.jitendrazaa.com\/blog\/wp-json\/wp\/v2\/posts\/2843\/revisions"}],"wp:attachment":[{"href":"https:\/\/www.jitendrazaa.com\/blog\/wp-json\/wp\/v2\/media?parent=2843"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.jitendrazaa.com\/blog\/wp-json\/wp\/v2\/categories?post=2843"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.jitendrazaa.com\/blog\/wp-json\/wp\/v2\/tags?post=2843"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}