自己构建Ajax请求进行模拟QueryTask进行查询

ArcGIS JS API中用Query和QueryTask进行查询的时候其实是进行的Ajax请求,只不过是将该Ajax请求进行了封装,更好的方便二次开发人员调用而已。有时候我们用QueryTask进行查询的时候,传的参数的数据可能比较大,比如query.geometry经过序列化后超过了2KB,那么就需要执行post请求,这样就会造成ajax的跨域访问问题。一般的解决办法是使用ArcGIS所提供的代理文件proxy.jsp、proxy.ashx、proxy.PHP,使用的时候配置如下esri.config.defaults.io.proxyUrl = "http://samedomain:sameport/proxy/proxy.jsp",这样在用各种Task进行ajax请求的时候,如果数据量超过2KB,就会自动使用代理,但是使用的前提是要将你进行查询的地图服务的url写到proxy.jsp的serverUrls中(目的是为了进行检验要进行查询的服务是否能够使用代理),由于某些原因,我在使用的过程中不能将要查询的服务地址放到代理文件中,这样就不能使用代理了。

如果不能使用代理,还可以通过jsonp的接口实现跨域访问,首先我要获取QueryTask在执行execute方法时所发送的数据信息,通过Chrome Developer Tools中的NetWork一项可以查看详细信息,如下图所示:



上图中的红色线框内的数据表示的就是所传递的数据,通过dojo.io.script可以用script标签的形式访问jsonp接口,将需要进行查询的参数信息手动进行设置,代码如下:

var xhrArgs = {
                url:queryUrl+"/query",handleAs:"json",callbackParamName:"callback",content:{
                    f:"json",where:"",returnGeometry:false,spatialRel:"esriSpatialRelIntersects",geometry:dojo.toJson(bufferGeometry.toJson()),geometryType:"esriGeometryPolygon",inSR:102100,outFields:"乡镇名称,乡镇人口",outSR:102100
                }
            };

            //用dojo.io.script使用JSONP构建ajax请求
            var def = dojo.io.script.get(xhrArgs);

            def.then(dojo.hitch(this,function(featureSet){
                    alert("查询完成!");
                }
            }),dojo.hitch(this,function(error){
                    alert("查询完成!")
            }));
需要注意的是,使用服务端在封装jsonp接口的时候,会使用不同的识别回调函数名称,Esri使用的名称是callback,所以在前端需要协商callbackParamName为callback,这样在ArcGS的Server端才会正确调用客户端的回调函数。以上就是用原生的dojo模拟ArcGIS JS API中QueryTask的功能

相关文章

JS原生Ajax操作(XMLHttpRequest) GET请求 POST请求 兼容性问题 利用iframe模拟ajax 实现表单提交的返回...
AJAX 每日更新前端基础,如果觉得不错,点个star吧 😃 https://github.com/WindrunnerMax/E...
踩坑Axios提交form表单几种格式 前后端分离的开发前后端, 前端使用的vue,后端的安全模块使用的SpringSe...
很早就听闻ajax的名声,但是却一直不知道怎么用,今天自己捣鼓了一下,竟然会用了,哈哈哈哈。 为了防止...
需要在服务器上进行哈 jquery的ajax方法: // jquery请求 $.ajax({ url: "./server/slider.js...
Ajax函数封装ajax.js // Get / Post // 参数 get post // 是否异步 // 如何处理响应数据 // URL // var...