1. Go to User Interface.

2. Enable “Streaming API”.

3. Check whether your profile has API Enabled permission.

4. Go to this site and download the file – http://download.cometd.org/cometd-2.2.0-distribution.tar.gz
5. Extract the downloaded file.
6. Open Command Prompt and execute the below commands;
cd cometd-2.2.0/cometd-javascript/common/target
jar xvf cometd-javascript-common-2.2.0.war org/cometd.js
Note:
In command Prompt, make sure you navigate to the drive where it has been extracted.
7. Go to D:cometd-2.2.0cometd-javascriptcommontargetorg path. You will be able to find cometd.js file.
8. Go to D:cometd-2.2.0cometd-javascriptjquerysrcmainwebappjquery path. In my case I extracted the file to D drive. You will be able to see the files as below:

9. Go Static Resources and create new Static Resources as below in Salesforce
File Name Static Resource Name
cometd.js cometd
jquery-1.5.1.js jquery
json2.js json2
jquery.cometd.js jquery_cometd

10. Code for Visualforce and Apex.
Visualforce Page:
<apex:page controller="StreamingAPIController">
<apex:includeScript value="{!$Resource.cometd}"/>
<apex:includeScript value="{!$Resource.jquery}"/>
<apex:includeScript value="{!$Resource.json2}"/>
<apex:includeScript value="{!$Resource.jquery_cometd}"/>
<script type="text/javascript">
(function($){
$(document).ready(function() {
// Connect to the CometD endpoint
$.cometd.init({
url: window.location.protocol+'//'+window.location.hostname+'/cometd/24.0/',
requestHeaders: { Authorization: 'OAuth {!$Api.Session_ID}'}
});
// Subscribe to a topic. JSON-encoded update will be returned
// in the callback
$.cometd.subscribe('/topic/AccountUpdates', function(message) {
callRefresh();
});
});
})(jQuery)
function disconnect() {
$.cometd.disconnect();
}
window.onbeforeunload = disconnect;
</script>
<apex:form >
<apex:actionFunction name="callRefresh" action="{!refresh}"/>
<apex:pageBlock >
<apex:pageBlockTable value="{!listAccount}" var="a">
<apex:column value="{!a.Name}"/>
<apex:column value="{!a.AccountNumber}"/>
</apex:pageBlockTable>
</apex:pageBlock>
</apex:form>
</apex:page>
Apex Controller:
public class StreamingAPIController {
public StreamingAPIController() {
}
public List<Account> getlistAccount() {
return [SELECT Id, Name, AccountNumber FROM Account WHERE Active__c = true];
}
public PageReference refresh() {
getlistAccount();
return null;
}
}
11. Create a PushTopic using the below code in Developer Console.
PushTopic pushTopic = new PushTopic();
pushTopic.Name = 'AccountUpdates';
pushTopic.Query = 'SELECT Id, Name, AccountNumber FROM Account WHERE Active__c = true';
pushTopic.ApiVersion = 36.0;
pushTopic.NotifyForOperationCreate = true;
pushTopic.NotifyForOperationUpdate = true;
pushTopic.NotifyForOperationUndelete = true;
pushTopic.NotifyForOperationDelete = true;
pushTopic.NotifyForFields = 'Referenced';
insert pushTopic;
12. To test it, open the visualforce page. Open Accounts tab and create a new account with Active check box true. If you go back to the Visualforce page, the account created will be displayed there.
