原生ajax

ajax:请求后端数据创建快速动态网页的一个过程；

传统ajax同步更新，请求后台数据，重新返回一个html网页；

目前：异步更新，反应速度快；

实现方法：XMLHTTPRequest对象

五步法：

1.创建对象

var http=new XMLHTTPRequest();

2.向服务器发送请求 ；

方法	描述
open(method,url,async)	规定请求的类型、URL 以及是否异步处理请求。 method：请求的类型；GET 或 POST url：文件在服务器上的位置 async：true（异步）或 false（同步）如果不写默认异步
send(string)	将请求发送到服务器。 string：仅用于 POST 请求

（1）打开服务器链接；

http.open(method,url,async) ；

（2）发送请求

http.send();

3注册事件：

属性	描述
onreadystatechange	存储函数（或函数名），每当 readyState 属性改变时，就会调用该函数。
readyState	存有 XMLHttpRequest 的状态。从 0 到 4 发生变化。 0: 请求未初始化 1: 服务器连接已建立 2: 请求已接收 3: 请求处理中 4: 请求已完成，且响应已就绪
status	200: "OK" 404: 未找到页面

Http.onreadystatechange=function(){

             if(this.status==200&&this.readtstate==4){

            4.更新界面

             console.log(this);

             5.读取成功后，返回数据

            document.write(this.response);

             }

} 

跨域问题 

1.什么情况下才会跨域？

协议不同：如http/https

端口不同：如com,com81

主机名不同：如store/news

如何解决跨域问题

一般ajax跨域解决就是通过JSONP解决或者CORS解决,如以下:

PHP后台配置

PHP后台得配置几乎是所有后台中最为简单的,遵循如下步骤即可:

第一步:配置Php 后台允许跨域

<?php header('Access-Control-Allow-Origin: *');

header('Access-Control-Allow-Headers: Origin, X-Requested-With, Content-Type, Accept');

//主要为跨域CORS配置的两大基本信息,Origin和headers

   

第二步:配置Apache web服务器跨域(httpd.conf中)

原始代码：

<Directory />

    AllowOverride none

    Require all denied

</Directory>

修改代码：

<Directory />

    Options FollowSymLinks

    AllowOverride none

    Order deny,allow

    Allow from all

</Directory>

JAVA后台配置

JAVA后台配置只需要遵循如下步骤即可:

第一步:获取依赖jar包下载 cors-filter-1.7.jar, java-property-utils-1.9.jar 这两个库文件放到lib目录下。(放到对应项目的webcontent/WEB-INF/lib/下)

第二步:如果项目用了Maven构建的,请添加如下依赖到pom.xml中:

<dependency>

    <groupId>com.thetransactioncompany</groupId>

    <artifactId>cors-filter</artifactId>

    <version>[ version ]</version>

</dependency>