This is how my AjaxProxy.xml file the iWidget xml definition file looks like
<?xml version="1.0" encoding="UTF-8" ?>
<iw:iwidget id="AjaxProxy"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xmlns:iw="http://www.ibm.com/xmlns/prod/iWidget"
supportedModes="view" mode="view" lang="en" iScope="com.webspherenotes.ajaxproxy"
allowInstanceContent="true" >
<iw:resource uri="ajaxproxy.js" />
<iw:content mode="view">
<![CDATA[
<div>Ajax proxy</div>
<span id="replacecontent">Replace content</span>
]]>
</iw:content>
</iw:iwidget>
The ajaxproxy.xml declares ajaxproxy.js as a resource, which has all the JavaScript logic for the widget. The ajaxproxy widget displays a place holder div,
replacecontent
This is how my ajaxproxy.js file looks like
dojo.provide("com.webspherenotes.ajaxproxy");
dojo.declare("com.webspherenotes.ajaxproxy", [], {
onview: function(){
console.log("Inside the onView function()");
var currContext = this.iContext;
try{
dojo.xhrPost({
url: "/homepage/web/proxy/http/www.atech.com",
load: function(data, ioargs){
currContext.getElementById("replacecontent").innerHTML = data;
console.log(data);
},
error: function(error,ioargs){
alert("Error :" + data);
}
});
}catch(error){
console.log("Error in the dojo.xhrPost " + error );
}
}
});
The
onview()
method of the ajaxproxy widget will get called to generate the VIEW mode markup, in this method i am making HTTP POST
to /homepage/web/proxy/http/www.atech.com
which actually means http://www.atech.com, once the response is back i will get control in the load() method and i am using the response to display markup in the widget, which looks like thisThe markup looks unformatted because it does not include the necessary resources. When you deploy the widget on your server it will fail with 403 forbidden error at the time of making
xhrPost()
call unless your ajax proxy is configured to make POST request.