所谓简单请求,是指不包含任何参数的请求。这种请求通常用于自动刷新的应用,例如证券交易所的实时信息发送。这种请求通常用于公告性质的响应,公告性质的响应无需客户端的任何请求参数,而是由服务器根据业务数据自动生成。对于简单请求,因为无须发送请求参数,所以采用POST和GET方式并没有太大区别。不管发送怎样的请求,XMLHttpRequest都应该按如下步骤进行:

  • 初始化XMLHttpRequest对象
  • 打开与服务器的连接,打开连接时,指定发送请求的方法:采用GET或POST;指定是否采用异步方式
  • 设置监听XMLHttpRequest状态改变的事件处理函数
  • 发送请求,如采用POST方法发送请求,可发送带参数的请求。

下面的应用模拟了一个简单的证券价格公告牌,下面的代码是服务器的响应页面,该页面随机产生三个数字,假设这三个数字就是对应的三个股票的报价。将这三个数字以$符号隔开后发送到客户端。下面是服务器页面的代码。

程序清单:Ajax02request/simple/second.jsp

<%@ page contentType="text/html; charset=UTF-8" language="java" import="java.util.*" %>

<%

    //创建伪随机器,以系统时间作为随机器的种子

    Random rand = new Random(System.currentTimeMillis());

    //生成三个伪随机数字,并以$符号隔开后发送到客户端

    out.println(rand.nextInt(10) + "$" + rand.nextInt(10) + "$" + rand.nextInt(10));

 %>

服务器响应生成三个随机数字,三个数字以$符号隔开,因此客户端页面只需要定时向服务器发送简单请求即可,这种请求无须任何请求参数。客户端页面代码如下。

程序清单:Ajax02request/simple/first.html

<!DOCTYPE html>

<html>

<head>

    <meta name="author" content="silvan" />

    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

    <title> 发送简单请求 </title>

</head>

<body>

mysql的虚拟股票价格:<div id="mysql" style="color:red;font-weight:bold;"></div>

tomcat的虚拟股票价格:<div id="tomcat" style="color:red;font-weight:bold;"></div>

jetty的虚拟股票价格:<div id="jetty" style="color:red;font-weight:bold;"></div>

<script type="text/javascript">

// XMLHttpRequest对象

var xmlrequest;

// 创建XMLHttpRequest对象的初始化函数

function createXMLHttpRequest()

{

    if(window.XMLHttpRequest)

    {

       // DOM 2浏览器

       xmlrequest = new XMLHttpRequest();

    }

    else if (window.ActiveXObject)

    {

       // IE浏览器

       try

       {

           xmlrequest = new ActiveXObject("Msxml2.XMLHTTP");

       }

       catch (e)

       {

           try

           {

              xmlrequest = new ActiveXObject("Microsoft.XMLHTTP");

           }

           catch (e){}

       }

    }

}

// 用于发送简单请求的函数

function getPrice()

{

    // 初始化XMLHttpRequest对象

    createXMLHttpRequest();

    var uri = "second.jsp";

    // 打开与服务器的连接

    xmlrequest.open("POST", uri, true);

    // 指定当XMLHttpRequest状态改变时的事件处理函数

    xmlrequest.onreadystatechange = processResponse;

    // 发送请求

    xmlrequest.send(null);

}

// 当XMLHttpRequest状态改变时,该函数将被触发

function processResponse()

{

    if(xmlrequest.readyState == 4)

    {

       if(xmlrequest.status == 200)

       {

           // 将服务器响应以$符号分割成一个字符串数组

           var prices = xmlrequest.responseText.split("$");

           // 将服务器的响应通过页面显示。

           document.getElementById("mysql").innerHTML=prices[0];

           document.getElementById("tomcat").innerHTML=prices[1];

           document.getElementById("jetty").innerHTML=prices[2];

           // 设置1秒钟后再次发送请求

           //setTimeout() 方法用于在指定的毫秒数后调用函数或计算表达式

           setTimeout("getPrice()", 1000);

       }

    }

}

// 指定页面加载完成后指定getPrice()函数

document.body.onload = getPrice;

</script>

</body>

</html>

Open方法通常有三个参数:第一个参数指定发送请求的方式——只能是POST或GET,通常建议采用POST方式;第二个参数指定发送请求的服务器资源地址,虽然"second.jsp"在simple文件夹下,但是由于first.html也在simple文件夹下,所以访问地址直接写"second.jsp"就好了,如果处于不同文件夹下需要将地址写全;第三个参数只能为true或false,用于指定是否采用异步方式发送请求,一般默认true。上面的应用用于发送简单请求,请求不包含任何参数,发送请求时open()方法的第一个参数决定了发送请求的方式,例如本应用指定以POST方式发送请求。

项目概况:

将项目加入tomcat,运行tomcat。

在浏览器中访问:http://localhost:8081/Ajax02request/simple/first.html

大概每隔1秒钟页面的股票价格会刷新一次。

Ajax发送简单请求案例的更多相关文章

  1. Ajax发送XML请求案例

    Ajax发送XML请求需求: 根据输入的国家,输出这些国家下面的城市. 如果请求参数较多,而且请求参数的结构关系复杂,则可以考虑发送XML请求.XML请求的实质还是POST请求,只是在发送请求的客户端 ...

  2. Ajax的简单请求案例

    $.ajax({ url : rootPath +'/jasframework/choosepilecontrol/querySubsytem.do', type : "POST" ...

  3. AJAX发送异步请求教程详解

    AJAX 一.AJAX简介 什么是 AJAX ? AJAX = 异步 JavaScript 和 XML. AJAX 是一种用于创建快速动态网页的技术. 通过在后台与服务器进行少量数据交换,AJAX 可 ...

  4. IT兄弟连 JavaWeb教程 使用AJAX发送GET请求并获取响应

    GET请求用于获取数据,有时候我们需要获取的数据需要通过"查询参数"进行定位,在这种情况下,我们会将查询参数追加到URL的末尾,令服务器解析. 使用Ajax发送GET请求非常简单, ...

  5. Django中ajax发送post请求,报403错误CSRF验证失败解决办法

    今天学习Django框架,用ajax向后台发送post请求,直接报了403错误,说CSRF验证失败:先前用模板的话都是在里面加一个 {% csrf_token %} 就直接搞定了CSRF的问题了:很显 ...

  6. Ajax发送Post请求

    Ajax发送post请求与发送get请求大致类似.以下看详细实例.首先看JSP显示页面: <form action="servlet/LoginServlet" method ...

  7. 使用Ajax发送http请求(get&post请求)

    本文最初发表于博客园,并在GitHub上持续更新前端的系列文章.欢迎在GitHub上关注我,一起入门和进阶前端. 以下是正文. 同步和异步 同步和异步的概念 同步:必须等待前面的任务完成,才能继续后面 ...

  8. AJAX发送PUT请求引发的血案

    如果直接发送ajax=put形式的请求      是拿不到请求体中的数据的.           Tomcat:              1.将请求体中的数据,封装一个map             ...

  9. AJAX的来龙去脉(由来)-如何被封装出来的--ajax发送异步请求(四步操作)

    <黑马程序员_超全面的JavaWeb视频教程vedio\JavaWeb视频教程_day23_ajax> \JavaWeb视频教程_day23_ajax\day23ajax_avi\14.打 ...

随机推荐

  1. 贪吃蛇c++实现

    近期没事翻了一下曾经写的程序.真是不堪入目.曾经真是什么都不懂.只是有一个程序倒是挺有意思的,大二的时候写的一个贪吃蛇游戏.尽管程序非常难看,还有非常多漏洞.但也是这个程序让我真正開始喜欢上了编程.不 ...

  2. JavaScript和Java的区别

    一个是编译型语言(客户端平台必须有仿真器或解释器),一个是解析型语言(不经过编译,直接将文本格式的字符代码发送给浏览器解释执行). 虽然JavaScript与Java有紧密的联系,但却是两个公司开发的 ...

  3. Epos消费管理系统复制迁移SQL SERVER 2005数据库

    先脱机 原来要关闭Epos消费管理系统软件才可以让对应的数据库脱机

  4. [JavaEE] Hibernate连接池配置测试

    转载自51CTO http://developer.51cto.com/art/200906/129914.htm Hibernate支持第三方的连接池,官方推荐的连接池是C3P0,Proxool,以 ...

  5. ubantu安装jdk

    环境:ubantu16.04下安装jdk1.8 1,在当前用户根目录下创建目录,本人所用的用户为bruce: mkdir /home/bruce/jdk 2,官网下载jdk1.8,网址为http:// ...

  6. markdown 计算器

    计算器 分四种运算(加减乘除).括号.去除最后括号.验证等式是否计算完成 bracket = re.compile(r'\([^()]+\)') # 找括号 multiplys = re.compil ...

  7. SDAutoLayout的使用

    ## 简介- IOS布局的三个阶段:MagicNumber -> AutoResizingMask -> AutoLayout- 自动布局三大框架:UILayoutConstraint(原 ...

  8. python 模块导入详解

    本文不讨论 Python 的导入机制(底层实现细节),仅讨论模块与包,以及导入语句相关的概念.通常,导入模块都是使用如下语句: import ... import ... as ... from .. ...

  9. App Store兼容性问题

    app下载出现兼容性问题  项目支持9.0以上的系统 但是10.3的iphone5下载的一直是老版本app  下载时提示不兼容 导致无法正常使用 解决办法: 修改Build-Settings-> ...

  10. JQuery学习笔记系列(一)----选择器详解

    笔者好长时间没有更新过博客园的笔记了,一部分原因是去年刚刚开始工作一段时间忙碌的加班,体会了一种每天加班到凌晨的充实感,之后闲暇时间了也因为自己懒惰没有坚持记笔记的习惯,现在重新拾起来. 借用古人的一 ...