发表于: 2017-04-16 21:59:08

1 1251


今天完成的事情:今天周日,看了一下书。然后看了一下如何用apache配置反向代理服务器。
明天计划的事情:把任务5完成。
遇到的问题:关于ajax xhr方面的问题。
收获:了解 什么是反向代理服务器:

通常的代理服务器,只用于代理内部网络对Internet的连接请求,客户机必须指定代理服务器,并将本来要直接发送到Web服务器上的http请求发送到代理服务器中。由于外部网络上的主机并不会配置并使用这个代理服务器,普通代理服务器也被设计为在Internet上搜寻多个不确定的服务器,而不是针对Internet上多个客户机的请求访问某一个固定的服务器,因此普通的Web代理服务器不支持外部对内部网络的访问请求。当一个代理服务器能够代理外部网络上的主机,访问内部网络时,这种代理服务的方式称为反向代理服务。此时代理服务器对外就表现为一个Web服务器,外部网络就可以简单把它当作一个标准的Web服务器而不需要特定的配置。不同之处在于,这个服务器没有保存任何网页的真实数据,所有的静态网页或者CGI程序,都保存在内部的Web服务器上。因此对反向代理服务器的攻击并不会使得网页信息遭到破坏,这样就增强了Web服务器的安全性。

反向代理方式和包过滤方式或普通代理方式并无冲突,因此可以在防火墙设备中同时使用这两种方式,其中反向代理用于外部网络访问内部网络时使用,正向代理或包过滤方式用于拒绝其他外部访问方式并提供内部网络对外部网络的访问能力。因此可以结合这些方式提供最佳的安全访问方式。

创建Ajax:
 
要创建Ajax,主角是XMLHttpRequest(下简称XHR)对象。
第一步:创建XHR对象
var xhr = new XMLHttpRequest();

第二步:向服务器发送请求
方法:open(method,url,async) 和 send(string)
open()方法传入三参数
  • method:请求的类型(GET/POST)
  • url:文件在服务器上的位置
  • async:布尔值,true表示异步,false表示同步(可选,默认为true)
send()方法将请求发送到服务器,有一个可选的参数string,仅用于POST类型的请求。
 
这里主要讨论一下async参数,XMLHttpRequest对象如果要用于AJAX的话,其open()方法的async参数必须设置为true。那如果参数设置为false会有什么样的后果呢?同步请求的后果是:JavaScript会等到服务器响应就绪才继续执行。如果是比较大型的请求或者服务器处于繁忙状态,应用程序会挂起或停止。简单点说就是页面会一直卡到响应内容回来才继续运行。
 
在发送GET请求的时候,可能得到缓存的信息(IE中),导致我们发送的异步请求不能正确的返回我们想要的最新的数据。
 
方法一:在url中添加一个唯一的ID:(随机数)
1 xhr.open("GET","demo.asp?t=" + Math.random(),true);2 xhr.send();
这种方式可以避免拿到缓存中的旧消息,但它的每次请求仍然会被浏览器缓存起来,占用浏览器资源。
 
方法二:用setRequestHeader(header,value)方法向请求添加HTTP头。(关于setRequestHeader在后面讨论)
1 xhr.open("GET","demo.asp",true);2 xhr.setRequestHeader("If-Modified-Since","0");  //设置浏览器不使用缓存3 xhr.send();
GET中的url可以拼接字符串从而达到传参,而传送数据一般用POST。
如果我们用POST方法向服务器发送数据,应该这样设置http头。
1 xhr.open("POST","postdemo.asp",true);2 xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");  //否则数据无法被正常接收3 xhr.send("name=amie");  //send里写要发送的数据
 
第三步:服务器响应
XMLHttpRequest对象的responseText和responseXML属性分别获得字符串形式的响应数据和XML形式的响应数据
可以在控制台里输出响应
console.log(xhr.responseText);
还有三个关于响应状态的属性也经常用到:
  • readyState:存有XMLHttpRequest的状态。XHR对象会经历5种不同的状态
    • 0:请求未初始化(new完后);
    • 1:服务器连接已建立(对象已创建并初始化,尚未调用send方法);
    • 2:请求已接收;
    • 3:请求处理中;
    • 4:请求已完成,响应就绪;
  • status:(HTTP状态码很多,请自行了解,举例常见的)
    • 200:请求成功
    • 404:未找到页面
  • onreadystatechange:存储函数(或函数名),每当readyState属性改变时,就会调用该函数。
因此上面那行代码可以改为:
1 xhr.onreadystatechange = function () {2     if (xhr.readyState == 4 && xhr.status == 200) {3     console.log(xhr.responseText);




返回列表 返回列表
评论

    分享到