ArcGIS API For Javascript :如何解决跨网不能正常获取依赖项的问题?
一、前言
政企项目通常会在自组网以及保密网运行,有些单位甚至会有两个物理隔绝的网络存在。通常情况下我们会在两个网络中部署相同的地图服务和依赖项。但是也有其中一个网络密级很高没有服务器资源,不能单独部署依赖项的情况出现。
二、案例与原因初探
例如:现有 A、B 两张物理隔绝的网络。其中 A 网部署地图服务与依赖项, B 网密级很高,只进不出,且无法部署依赖项。
我们首先采用的是在前置机 C(双网卡,与 A 双向通信,与 B 单向通信)搭建转发服务,在此过程中就会出现依赖项加载失败的情况。根据对控制台网络请求查看,请求的 js 资源 IP 为 B 网配置项中的 IP 段,说明 A 网中依赖项中的 init.js 和 dojo.js 中配置写死,造成 B 通过 C 无法正常请求到相关资源。
三、解决方案
核心是使 init.js 和 dojo.js 动态获取主机 IP 更新配置项。基于此思路,我们进行了以下尝试:
1. 配置项 使用相对路径 —— 失败
2. 配置项 A 网代理 A 网(使用 ArcGIS 代理 + 原始 IP 端口 拼接路径) —— 失败
3. 配置项 使用 B 网配置 IP 端口 —— 失败
4. 配置项 C 机代理 A 网(使用前置机转发 + 原始 IP 端口 拼接路径)——失败
5. 配置项 C 机代理 B 网(使用前置机转发 + B 网配置 IP 端口 拼接路径)——失败
6. 配置项 获取当前请求的服务 IP 端口,更新至到配置项 —— 成功 10%
6.1 遇到的问题及解决思路
根据自动获取当前服务 IP 端口,在 B 网中可以正常调用 init.js ,但是 zh-cn.js 未能正常加载,说明在加载相关基础 js 时会重新拼接路径,而此时所获取的 baseurl 并非我们在头部修改的当前服务 IP 端口。
因此需要在源码中找到相对应拼接路径的位置,将其强行修改与头部的 baseurl 保持一致。
6.2 解决过程
6.2.1 获取当前服务 IP 端口
(function(exports) {
var doc = exports.document
, a = {}
, expose = +new Date()
, rExtractUri = /((?:http|https|file):\/\/.*?\/[^:]+)(?::\d+)?:\d+/
, isLtIE8 = ('' + doc.querySelector).indexOf('[native code]') === -1;
exports.getCurrAbsPath = function() {
// FF,Chrome
if (doc.currentScript) {
return doc.currentScript.src;
}
var stack;
try {
a.b();
} catch (e) {
stack = e.fileName || e.sourceURL || e.stack || e.stacktrace;
}
// IE10
if (stack) {
var absPath = rExtractUri.exec(stack)[1];
if (absPath) {
return absPath;
}
}
// IE5-9
for (var scripts = doc.scripts, i = scripts.length - 1, script; script = scripts[i--]; ) {
if (script.className !== expose && script.readyState === 'interactive') {
script.className = expose;
// if less than ie 8, must get abs path by getAttribute(src, 4)
return isLtIE8 ? script.getAttribute('src', 4) : script.src;
}
}
}();
}(window));
6.2.2 配置 baseUrl
将上述代码插入 init.js 最上部分,然后搜索 [HOSTNAME_AND_PATH_TO_JSAPI] ,将其更换为 getCurrAbsPath.replace("/"+getCurrAbsPath.split("/").pop(),"") + "/dojo" 。
6.2.3 找到二次拼接位置
根据 zh-cn 检索,找到以下位置。
"*now": function(q) {
q(['dojo/i18n!*preload*esri/nls/jsapi*["ar","az","ca","cs","da","de-de","el","en-gb","en-us","es-es","fi-fi","fr-fr","he-il","hu","it-it","ja-jp","ko-kr","nl-nl","nb","pl","pt-br","pt-pt","ro","ru","sk","sl","sv","th","tr","zh-tw","zh-cn","ROOT"]'])
},
在这里打断点,逐行执行,找到拼接处。
Wa = function(a, b, g, d, r, q, h, k, f, x) {
var t, y, w, m;
m = /^\./.test(a);
if (/(^\/)|(\:)|(\.js$)/.test(a) || m && !b)
return wa(0, a, 0, a);
a = Va(m ? b.mid + "/../" + a : a);
if (/^\./.test(a))
throw c("irrationalPath", a);
x || m || !q.star || (w = Aa(a, q.star[1]));
!w && b && (w = (w = Aa(b.mid, q)) && Aa(a, w[1]));
w && (a = w[1] + a.substring(w[3]));
b = (na = a.match(/^([^\/]+)(\/(.+))?$/)) ? na[1] : "";
(t = g[b]) ? a = b + "/" + (y = na[3] || t.main) : b = "";
var p = 0;
e(k, function(b) {
var c = a.match(b[0]);
c && 0 < c.length && (p = l(b[1]) ? a.replace(b[0], b[1]) : b[1])
});
if (p)
return Wa(p, 0, g, d, r, q, h, k, f);
if (g = d[a])
return f ? wa(g.pid, g.mid, g.pack, g.url) : d[a];
d = (w = Aa(a, h)) ? w[1] + a.substring(w[3]) : b ? ("/" === t.location.slice(-1) ? t.location.slice(0, -1) : t.location) + "/" + y : v("config-tlmSiblingOfDojo") ? "../" + a : a;
debugger
/(^\/)|(\:)/.test(d) || (d = r + d);
console.log(wa(b, a, t, Va(d + ".js")))
return wa(b, a, t, Va(d + ".js"))
}
发现 /(^\/)|(\:)/.test(d) || (d = r + d); 是拼接语句,r 是问题关键。我们只需要在 debugger 处将 r 重新赋值即可。
r=getCurrAbsPath.replace("/" + getCurrAbsPath.split("/").pop(), "") + "/dojo/";
6.3 测试
B 网成功地向 C 前置机转发服务请求,获得了 A 网的地图依赖项和地图服务。至此问题解决。
四、总结
以上就是困扰了很久的跨网未能正常获取地图资源的问题的解决过程与解决方法。
ArcGIS API For Javascript :如何解决跨网不能正常获取依赖项的问题?的更多相关文章
- arcgis api for JavaScript _跨域请求
arcgis api for JavaScript 中出现跨域请求是常见问题, 通常出现类似如下错误消息类似: XMLHttpRequest cannot load http://10.32.2.7 ...
- ArcGIS API for javascript开发笔记(二)——解决ArcGIS Service中的服务在内网环境下无法进行javascript预览问题
感谢一路走来默默支持和陪伴的你~~~ ----------------------------拒绝转载-------------------------------- 1.问题说明 在使用ArcGIS ...
- ArcGIS API for JavaScript 4.x 本地部署之跨域问题解决法:CORS
众所周知,在离线部署ArcGIS API for JavaScript时,有时候会产生微件上的字体.符号变成方框的问题.这是遇到了跨域,只需要对所在服务器进行配置即可. 本篇使用的环境是:API配置在 ...
- ArcGIS API for JavaScript 4.2学习笔记[5] 官方API大章节概述与内容转译
内容如上,截图自ESRI官网,连接:ArcGIS API for JavaScript 4.2 [Get Started] 类似于绪论一样的东西,抽取了最需要关注的几个例子.如:加载Map和View, ...
- 【1】ArcGIS API for JavaScript 4.5/4.6 本地部署
惭愧,和我的学弟比起来,我所开始接触前端开发,ArcGIS API for JavaScript的时间和深度远远不及于他. 一年之尾,亦是一年之始,我也将正式开始我的博客生涯.本人在校学习并且做项目, ...
- ArcGIS API for Javascript 使用缓冲区结果做query查询出现“esri.config.defaults.io.proxyUrl 尚未进行设置”错误
1.前言 在研究ArcGIS API for JavaScript时会遇到这样的问题,比如我们在做缓冲区分析时,用分析的范围作为空间查询query的参数,在执行结果中总是会看到“esri.config ...
- Arcgis api for javascript学习笔记(4.5版本) - 本地部署及代理配置
在开发过程中,由于api的文件比较多,没必要每个项目都将api加入到解决方案中.况且在VS中如果将api加入解决方案,在编写css或js代码时,由于智能提示需要扫描脚本等文件,会导致VS很卡.所以个人 ...
- 基于ArcGIS API for Javascript的地图编辑工具
最近工作上需要用ArcGIS API for Javascript来开发一个浏览器上使用的地图编辑工具,分享一下一些相关的开发经验. 我开发的地图编辑工具是根据ESRI提供的例子修改而来的,参考的例子 ...
- arcgis api for javascript 3.16开发(一)
原来一直都在用Flex开发arcgis的地图接口,用的时间很长,用的习惯也顺手,可Flex这个开发工具已经基本要淘汰了,并且地图借助flash的方式加载在浏览器里已经不能适应webgis的快速开发需求 ...
随机推荐
- 数据结构2_java---栈,括号匹配
package Main; import java.util.Scanner; import javax.swing.text.html.HTMLDocument.HTMLReader.Isindex ...
- Halcon安装注意事项
安装使用评估版本 下载并安装 在ihalcon中下载halcon,版本随意,因为我也不知道怎么选择适合自己的版本,那就下载一个比较新的版本,19.05版本. 安装目录默认在C:\Program Fil ...
- e.target与事件委托简例(原生和jQuery的区别)
target定义(英译:目标,目的): target 事件属性可返回事件的目标节点(触发该事件的节点),如生成事件的元素.文档或窗口. 语法: event.target event.target.no ...
- ThreadPoolExecutor使用方法
先看构造方法 ,ThreadPoolExecutor共4个构造方法: 直接看参数最多的7个参数分别代表: public ThreadPoolExecutor(int corePoolSize, int ...
- 云计算 docker 容器部署
什么是docker容器: 容器就是在隔离的环境中运行的一个进程,如果进程停止,容器就会退出.隔离的环境拥有自己的系统文件,ip地址,主机名等kvm虚拟机,linux,系统文件 容器和虚拟化的区别 : ...
- 从零开始把项目发布到maven仓库中心
sonatype准备操作 注册账号 https://issues.sonatype.org 1. 密码符号规范,并且工记住 新建项目 1. group id 如果你有com域名的所有权可以直接使用,如 ...
- markdown语法(转)
markdown语法 1.标题代码 # 一级标题 ## 二级标题 ### 三级标题 #### 四级标题 ##### 五级标题 ###### 六级标题 2.引用代码 >你好 >> 您好 ...
- Java基础(十八)集合(5)Queue集合
队列是只能在尾部添加元素,同时只能在头部删除元素的数据结构.队列的原则就是“先进先出”. Queue接口是Collection接口的最后一个子接口. Queue接口是队列接口,而Deque接口是Que ...
- AS报错:lambda expressions are not supported at this language level
AS报错:lambda expressions are not supported at this language level 解决方法 打开打开 File --> Project Stuct ...
- CSS盒子模型+box-sizing
当对文档进行布局时,浏览器渲染引擎会根据css-Box模型(CSS Basic Box model)将所有元素表示为一个矩形盒子.CSS决定这些盒子的大小,位置以及属性(颜色,背景,边框尺寸) 标准盒 ...