描述:
需要ajax跨域请求,用cors跨域方案。
服务端设置:header('Access-Control-Allow-Origin: http://front.ls-la.me');header('Access-Control-Allow-Headers: X-Requested-With');
设置了:
后端需要的头信息,原生ajax以表单方式post提交数据,json数据data转换成key1=val1&key2=val2 的字符串格式
1 var ajaxHdFn = function(uri, data, cb) { 2 var getXmlHttpRequest = function() { 3 if (window.XMLHttpRequest) { 4 //主流浏览器提供了XMLHttpRequest对象 5 return new XMLHttpRequest(); 6 } else if (window.ActiveXObject) { 7 //低版本的IE浏览器没有提供XMLHttpRequest对象 8 //所以必须使用IE浏览器的特定实现ActiveXObject 9 return new ActiveXObject("Microsoft.XMLHttpRequest");10 }11 12 };13 var xhr = getXmlHttpRequest();14 xhr.onreadystatechange = function() {15 console.log(xhr.readyState);16 if (xhr.readyState === 4 && xhr.status === 200) {17 //获取成功后执行操作18 //数据在xhr.responseText19 var resJson = JSON.parse(xhr.responseText)20 cb(resJson);21 }22 };23 xhr.open("post", uri, true);24 xhr.setRequestHeader("DeviceCode", "56");25 xhr.setRequestHeader("Source", "API");26 xhr.setRequestHeader("Authentication", "72b32a1f754ba1c09b3695e0cb6cde7f");27 xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded;charset=UTF-8");28 var dataStr = '';29 for (var i in data) {30 if (dataStr) {31 dataStr += '&';32 }33 dataStr += i + '=' + data[i];34 }35 xhr.send(dataStr);36 };
跨域相关内容
CORS跨域的常见问题以及前后端的设置:
data = JSON.stringify(data);xhr.setRequestHeader("Content-Type","application/json");
这样设置,可以直接传json字符串给后端。后端也要做相应处理。