In most cases, you need to use the persistent link technology to display data on a webpage in real time. The simplest implementation is ajax polling, that is, pulling. The following is a simple example: display the server time in real time on the webpage.
Backend WebService code:
/// <Summary>
/// Summary of ServerTime
/// </Summary>
[WebService (Namespace = "http://tempuri.org/")]
[WebServiceBinding (ConformsTo = WsiProfiles. BasicProfile1_1)]
[System. ComponentModel. ToolboxItem (false)]
[ScriptService]
Public class ServerTime: System. Web. Services. WebService
{
/// <Summary>
/// Obtain the server time
/// </Summary>
/// <Returns> </returns>
[WebMethod]
[ScriptMethod (UseHttpGet = true, ResponseFormat = ResponseFormat. Json)]
Public string GetTime ()
{
Return DateTime. Now. ToString ("yyyy-MM-dd hh-mm-ss ");
}
}
Previous html code:
<! DOCTYPE html PUBLIC "-// W3C // dtd xhtml 1.0 Transitional // EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<Html xmlns = "http://www.w3.org/1999/xhtml">
<Head>
<Title> </title>
<Script type = "text/javascript" src = "Scripts/jquery-1.4.1.js"> </script>
<Script type = "text/javascript">
Function callWebService (url, param, handler ){
$. Ajax ({
Url: url,
Data: param,
Type: "get ",
DataType: "json ",
ContentType: "application/json; charset = UTF-8 ",
Success: function (p ){
Handler (p. d );
}
});
};
</Script>
</Head>
<Body>
<Script language = "javascript" type = "text/javascript">
// Round-robin server refresh time
SetInterval (showTime, 1000 );
Function showTime (){
CallWebService ("ServerTime. asmx/GetTime", null, function (data ){
$ ("# ServerTime" ).html (data );
});
}
</Script>
<Div id = "serverTime"> </div>
</Body>
</Html>