Ajax介绍（下）

废话不多说，上代码

Ajax介绍（下）

1、jQuery 调用Ajax

$.ajax({
	type:'post',
	url:'test.php',
	data:'name = aaa & age = 8',
	dataType:'json',
	success:function(data){
		$('#mydiv').html('<h2>'+data+'<h2>');
	},
	error:functon(){
		alert('error');
	},
}) 

1、Ajax缓存

Ajax在发送的数据成功后，会把请求的URL和返回的响应结果保存在缓存内。当请求的地址和参数完全一样时，ajax直接从缓存中获取数据。
客户端对一些静态页面内容的请求变得更加快捷，提高了页面的响应速度，也节省了网络通信资源。
如果通过Ajax对一些后台数据进行更改的时候，虽然数据在后台已经发生改变，但是页面缓存中并没有改变，对于相同的URL，Ajax提交过去以后，浏览器还只是简单的从缓存中拿数据。
解决这个缓存：
1.在ajax发送请求前加上 xmlHttpRequest.setRequestHeader(“Cache-Control”,”no-cache”);
在服务端加 header(“Cache-Control: no-cache, must-revalidate”);

2、react Ajax框架

react有很多ajax框架，项目采用fetch

fetch(url, fetchOption).then(function (response) {
		return response.json();
	}).then(function (json) {
		try {
			dispatch({
				type: options.action,
				fetchStatus: 200,
				data: json,
				error: null,
				param: param
			});
		} catch (err) {
			console.log(err);
			console.log('fetch succ, dispatch error');
		}
		callback && callback(json);
		// 请求成功回调
	}).catch(function (err) {
		console.log(err);
		dispatch({
			type: options.action,
			fetchStatus: 1,
			msg: '网络不给力，请稍后再试',
			error: err,
			param: param
		});
	});

我们通过网络请求url资源，将服务器返回的Body解析，定义了以下方法解析并返回一个包含 response对象的promise对象，方法有
arrayBuffer()
blob()
json()
text()
formData()
获取解析数据后，我们可以继续操作。