arcgis api 4.x for js 离线部署

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

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

arcgis api 下载途径

esri官网下载，下载需要注册 arcgis 用户才行，版本自己选择，官网下载最新版本api的地址：
官网下载页面
共享已经下载好的 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):下载

IIS部署配置方案

把下载的arcgis api 4.x 离线包解压拷贝到 C:\inetpub\wwwroot 目录下：
配置 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

测试离线部署api是否成功

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

<!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>

在有互联网情况下，地图能够加载出来，说明离线部署成功
arcgis api 4.x for js 离线部署

窃喜之余，突然发现网页f12模式下，控制台出现跨域错误：
arcgis api 4.x for js 离线部署
arcgis api 3.x 版本离线部署没有出现这种问题，所以，还要解决IIS跨域问题，具体步骤如下：

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

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

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

秒客网

arcgis api 4.x for js 离线部署

arcgis api 下载途径

IIS部署配置方案

测试离线部署api是否成功

相关文章