arcgis api 4.x for js 离线部署

时间 2020-05-31

原文原文链接

在个人GIS之家群里，常常遇到 webgis 开发新手们提问 arcgis api for js 如何本地离线部署，而不是直接调用在线的，由于在线模式依赖互联网以及网速环境因素，受到的限制影响比较大。因此，本篇专门来说解 arcgis api for js 离线部署的详细步骤配置以及测试是否部署成功，以 IIS 部署为例，tomcat 部署配置也是同个道理，差异不大。css

本篇以 arcgis api 4.x for js 版本系列为测试用例，其实 arcgis api 3.x for js 版本系列的离线配置方法也是相似的，以前写过一篇，参照文章，这里再也不一一叙述。html

arcgis api 下载途径

esri官网下载，下载须要注册 arcgis 用户才行，版本本身选择，官网下载最新版本api的地址：
官网下载页面
git
共享已经下载好的 arcgis 3.x 以及arcgis 4.x 系列api版本地址：
arcgis api3.18 for js:下载
arcgis api3.19 for js:下载
arcgis api3.20 for js:下载
arcgis api3.23 for js:下载
arcgis api3.24 for js:下载
arcgis api3.25 for js:下载
arcgis api3.26 for js:下载
arcgis api3.27 for js(密码:qrwh):下载
arcgis api4.1 for js:下载
arcgis api4.2 for js:下载
arcgis api4.6 for js:下载
arcgis api4.7 for js:下载
arcgis api4.8 for js:下载
arcgis api4.9 for js:下载
arcgis api4.10 for js(密码:6agz):下载web

IIS部署配置方案

把下载的arcgis api 4.x 离线包解压拷贝到 C:\inetpub\wwwroot 目录下：
api
配置 init.js 文件，修改里面的路径，我本机的目录以下：
C:\inetpub\wwwroot\arcgis_js_api\library\4.10\init.js ；
init.js 文件里面，全局搜索 [HOSTNAME_AND_PATH_TO_JSAPI] ，而后替换成 api 在本地机器上的部署路径，个人配置以下：http://localhost/arcgis_js_api/library/4.10/dojo
跨域
同理，配置 dojo.js 文件

全局搜索 [HOSTNAME_AND_PATH_TO_JSAPI] ，而后替换成 api 在本地机器上的部署路径，个人配置以下：http://localhost/arcgis_js_api/library/4.10/dojo
tomcat

测试离线部署api是否成功

用html编写一个简单的加载在线地图显示例子，代码以下：markdown

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no">
<title>Intro to MapView - Create a 2D map - 4.10</title>
<style> html, body, #viewDiv { padding: 0; margin: 0; height: 100%; width: 100%;
}
</style>
 
<link rel="stylesheet" href="http://localhost/arcgis_js_api/library/4.10/esri/css/main.css">
<script src="http://localhost/arcgis_js_api/library/4.10/init.js"></script>
 
<script> require([ "esri/Map", "esri/views/MapView" ], function(Map, MapView) { var map = new Map({ basemap: "streets" }); var view = new MapView({ container: "viewDiv", map: map, zoom: 4, center: [15, 65] // longitude, latitude
}); }); </script>
</head>
 
<body>
<div id="viewDiv"></div>
</body>
</html>

在有互联网状况下，地图可以加载出来，说明离线部署成功
测试

窃喜之余，忽然发现网页f12模式下，控制台出现跨域错误：

arcgis api 3.x 版本离线部署没有出现这种问题，因此，还要解决IIS跨域问题，具体步骤以下：ui

打开IIS界面，点击HTTP响应标头
在右侧能够看到添加，而后添加以下标头便可
Access-Control-Allow-Headers：Content-Type, api_key, Authorization
Access-Control-Allow-Origin：*
刷新网页，控制台没报错了，解决跨域问题

更多的详情见：GIS之家小专栏

文章尾部提供源代码下载，对本专栏感兴趣的话，能够关注一波