在我的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>

在有互联网情况下，地图能够加载出来，说明离线部署成功

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

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 离线部署的更多相关文章

  1. ArcGIS API for JavaScript 4.x 本地部署之Nginx法

    上篇ArcGIS API for JavaScript 4.x 离线配置之IIS法提到,如何用IIS配置ArcGIS jsAPI: 本篇则使用http下的Nginx配置,其原理基本一致.https的部 ...

  2. arcgis api 4.x for js 自定义 Draw 绘制手绘面以及手绘线，只针对二维视图（附源码下载）

    前言 关于本篇功能实现用到的 api 涉及类看不懂的,请参照 esri 官网的 arcgis api 4.x for js:esri 官网 api,里面详细的介绍 arcgis api 4.x 各个类 ...

  3. ArcGIS API for JavaScript 4.x 本地部署之Apache(含Apache官方下载方法)

    IIS.Nginx都说了,老牌的Apache和Tomcat也得说一说(如果喜欢用XAMPP另算) 本篇先说Apache. 安装Apache 这个...说实话,比Nginx难找,Apache最近的版本都 ...

  4. arcgis api 4.x for js 结合 react 入门开发系列初探篇（附源码下载）

    你还在使用 JQuery 或者 Dojo 框架开发 arcgis api 4.x for js 吗?想试试模块化开发吗?随着前端技术的发展,arcgis api 4.x for js 也有了结合 re ...

  5. arcgis api 3.x for js 地图加载多个 SHP 图层压缩以及 json 文件展示（附源码下载）

    前言 关于本篇功能实现用到的 api 涉及类看不懂的,请参照 esri 官网的 arcgis api 3.x for js:esri 官网 api,里面详细的介绍 arcgis api 3.x 各个类 ...

  6. arcgis api 3.x for js 入门开发系列批量叠加 zip 压缩 SHP 图层优化篇（附源码下载）

    前言 关于本篇功能实现用到的 api 涉及类看不懂的,请参照 esri 官网的 arcgis api 3.x for js:esri 官网 api,里面详细的介绍 arcgis api 3.x 各个类 ...

  7. arcgis api 3.x for js 入门开发系列二十二地图模态层（附源码下载）

    前言 关于本篇功能实现用到的 api 涉及类看不懂的,请参照 esri 官网的 arcgis api 3.x for js:esri 官网 api,里面详细的介绍 arcgis api 3.x 各个类 ...

  8. arcgis api 3.x for js 入门开发系列二十一气泡窗口信息动态配置模板

    前言 关于本篇功能实现用到的 api 涉及类看不懂的,请参照 esri 官网的 arcgis api 3.x for js:esri 官网 api,里面详细的介绍 arcgis api 3.x 各个类 ...

  9. arcgis api 3.x for js 入门开发系列十八风向流动图（附源码下载）

    前言 关于本篇功能实现用到的 api 涉及类看不懂的,请参照 esri 官网的 arcgis api 3.x for js:esri 官网 api,里面详细的介绍 arcgis api 3.x 各个类 ...

随机推荐

  1. linux基础和vim基本使用

    Liunx基础 1. 目录  /:根目录,一般根目录只存放目录,在linux下有且只有一个根目录.所有的东西都是从这里开始,例如:/home就是先从根目录/开始,再进入到home目录.  /bin ...

  2. PAT1047: Student List for Course

    1047. Student List for Course (25) 时间限制 400 ms 内存限制 64000 kB 代码长度限制 16000 B 判题程序 Standard 作者 CHEN, Y ...

  3. CAS 4.0 单点登录教程

    CAS 单点登录指导文档 1.概述 单点登录(Single Sign On),简称为 SSO,是目前比较流行的企业业务整合的解决方案之一.SSO的定义是在多个应用系统中,用户只需要登录一次就可以访问所 ...

  4. 关于Java泛型"擦除"的一点思考

    头次写博客,想说的东西不难,关于泛型的疑问,是前一阵在学习jackson中遇到的. 下面就把我所想到的.遇到的,分享出来. 泛型是JDK1.5后的一个特性,是一个参数类型的应用,可以将这个参数声明在类 ...

  5. aliyun oss操作汇总

    // endpoint以杭州为例,其它region请按实际情况填写 String endpoint = "http://oss-cn-hangzhou.aliyuncs.com"; ...

  6. [ Java面试题 ]算法篇

    1.堆和栈在内存中的区别是什么? 概念: 栈(stack)是为执行线程留出的内存空间.当函数被调用的时候,栈顶为局部变量和一些 bookkeeping 数据预留块.当函数执行完毕,块就没有用了,可能在 ...

  7. 某校高中生利用Python，巧妙获取考试成绩，看到成绩后无言以对！

    Python是非常有吸引力的编程语言,学习Python的不是帅哥就是美女.为什么这么说呢?因为我和我的女朋友都是学习Python认识的,小编肯定是帅哥,不用去怀疑,而且我眼光特高. 给大伙讲一个故事, ...

  8. 安卓---RedioButton(单选按钮)、CheckBox（复选按钮）

    <RadioGroup android:layout_width="fill_parent" android:layout_height="wrap_content ...

  9. Java同步简介

    Java同步 Java中同步一直都是很重要的问题,对于初学者来说也是不太容易能理解的问题.特在此记录一下有关Java中同步和锁的知识.主要涉及到同步的概念以及Java中解决的办法和简单的例子.有关锁L ...

  10. Git详解及github与gitlab使用

    第一章 关于版本控制 第二章 GIT简介 第三章 GIT安装 第四章 初次运行GIT前配置 第五章 初始化仓库 第六章 GIT命令操作 第七章 GIT分支结构