EPCM Proxy

Portal applications that are rendered in their own IFrame, such as ITS-based and BSP applications, do not have direct access to the EPCM object. To solve this problem, the EPCF provides a proxy object, EPCMPROXY, through which such applications can access the EPCF APIs.

Subscribing to Events

The EPCF event subscription methods are called with function references. Since the references are kept across the IFrame borders, the references become invalid whenever the IFrame content is reloaded. To solve this problem, use the signature of the EPCM.subscribeEvent method that references the current window object:

EPCM.subscribeEvent(nameSpace, name, window_reference, method_name)

For external applications that are rendered in their own IFrame, the EPCM object can convert the event handler subscription from window_reference, method_name to IFrame_name, method_name. As a result of this conversion, the method keeps the name rather than the object-method reference.

Using EPCM Proxy

The EPCMPROXY object is defined in the JavaScript epcfproxy.js file that has to be included into your portal application.

The following example demonstrates how to call the EPCF methods through EPCMPROXY.

Sample Code

                  <HTML> 
<HEAD> 
<TITLE>EPCMProxy test example</TITLE> 
<!--This is a general proxy to delegate all EPCM calls to the upper frame --> 
<SCRIPT src="epcfproxy.js"></SCRIPT> 
<SCRIPT>// 
  var lnDotPos = document.domain.indexOf( "." ); 
  if(lnDotPos>=0)document.domain = document.domain.substr( lnDotPos + 1 ); 

  function run() { 
   // call EPCF method via proxy (transparent for End-User 
   EPCMPROXY.subscribeEvent( "urn:com.sapportals.portal.epcmdemo.animals",
         "onAnimalSelect", window, "handleEvent"); 
   showCurrentAnimal(); 
  } 

  function showCurrentAnimal() { 
   var lsAnimal = 
   EPCMPROXY.loadClientData("urn:com.sapportals.portal.epcmdemo.animals",
                            "animalstored" ); 
   if (lsAnimal == null){ lsAnimal = "unknown"; } 
   document.getElementById( "infoBox" ).innerHTML = lsAnimal; 
  } 
 
  function handleEvent( evt ) {
    showCurrentAnimal(); 
  } 
  
  function showEPCMdata(){ 
   var data = "" 
   data+= "\n EPCMPROXY.getUAType="+EPCMPROXY.getUAType()</STRONG>; 
   data+= "\n EPCMPROXY.getUAVersion="+EPCMPROXY.getUAVersion()</STRONG>;
   data+= "\n EPCMPROXY.getUAPlatform="+EPCMPROXY.getUAPlatform()</STRONG>;
   data+= "\n EPCMPROXY.getUAVersion="+EPCMPROXY.getVersion()</STRONG>; 
   data+= "\n EPCMPROXY.getInstanceId="+EPCMPROXY.getInstanceId()</STRONG>;
   data+= "\n EPCMPROXY.getUniqueWindowId="+EPCMPROXY.getUniqueWindowId()
              </STRONG>; 
   alert(data); 
  } 
</SCRIPT>

</HEAD> 
<BODY onLoad="run()"> 
<DIV class="header"> EPCMProxy test component </DIV> 
<P> 
<BUTTONonClick="location.reload()">reload</BUTTON> 
<BUTTONonClick="showEPCMdata()">show EPCM Data</BUTTON> 
<DIVid="infoBox"></DIV> 
</BODY> 
</HTML>