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>
在有互联网情况下，地图能够加载出来，说明离线部署成功
窃喜之余，突然发现网页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 离线部署的更多相关文章
- ArcGIS API for JavaScript 4.x 本地部署之Nginx法
上篇ArcGIS API for JavaScript 4.x 离线配置之IIS法提到,如何用IIS配置ArcGIS jsAPI: 本篇则使用http下的Nginx配置,其原理基本一致.https的部 ...
- arcgis api 4.x for js 自定义 Draw 绘制手绘面以及手绘线，只针对二维视图（附源码下载）
前言 关于本篇功能实现用到的 api 涉及类看不懂的,请参照 esri 官网的 arcgis api 4.x for js:esri 官网 api,里面详细的介绍 arcgis api 4.x 各个类 ...
- ArcGIS API for JavaScript 4.x 本地部署之Apache(含Apache官方下载方法)
IIS.Nginx都说了,老牌的Apache和Tomcat也得说一说(如果喜欢用XAMPP另算) 本篇先说Apache. 安装Apache 这个...说实话,比Nginx难找,Apache最近的版本都 ...
- arcgis api 4.x for js 结合 react 入门开发系列初探篇（附源码下载）
你还在使用 JQuery 或者 Dojo 框架开发 arcgis api 4.x for js 吗?想试试模块化开发吗?随着前端技术的发展,arcgis api 4.x for js 也有了结合 re ...
- arcgis api 3.x for js 地图加载多个 SHP 图层压缩以及 json 文件展示（附源码下载）
前言 关于本篇功能实现用到的 api 涉及类看不懂的,请参照 esri 官网的 arcgis api 3.x for js:esri 官网 api,里面详细的介绍 arcgis api 3.x 各个类 ...
- arcgis api 3.x for js 入门开发系列批量叠加 zip 压缩 SHP 图层优化篇（附源码下载）
前言 关于本篇功能实现用到的 api 涉及类看不懂的,请参照 esri 官网的 arcgis api 3.x for js:esri 官网 api,里面详细的介绍 arcgis api 3.x 各个类 ...
- arcgis api 3.x for js 入门开发系列二十二地图模态层（附源码下载）
前言 关于本篇功能实现用到的 api 涉及类看不懂的,请参照 esri 官网的 arcgis api 3.x for js:esri 官网 api,里面详细的介绍 arcgis api 3.x 各个类 ...
- arcgis api 3.x for js 入门开发系列二十一气泡窗口信息动态配置模板
前言 关于本篇功能实现用到的 api 涉及类看不懂的,请参照 esri 官网的 arcgis api 3.x for js:esri 官网 api,里面详细的介绍 arcgis api 3.x 各个类 ...
- arcgis api 3.x for js 入门开发系列十八风向流动图（附源码下载）
前言 关于本篇功能实现用到的 api 涉及类看不懂的,请参照 esri 官网的 arcgis api 3.x for js:esri 官网 api,里面详细的介绍 arcgis api 3.x 各个类 ...
随机推荐
- （十分钟视频教程）nodejs基础实战教程3：react服务端渲染入门篇
视频截图如下: (具体视频见文末) 前言: 这是小猫的第三篇node教程,本篇内容是由公众号粉丝票选得出的,相信大家对这篇教程是抱有较大希望的,这篇教程由小猫和一位多年的好朋友合作完成(笔名:谷雨,博 ...
- 关于office在卸载了某一应用之后无法试图使用的功能所在的网络位置
我出现这个问题是在卸载了某一个微软的办公软件之后,所有的办公软件都会产生这个问题. 处理的方法是将之前的安装包解压,然后找到所出现的msi文件,点击确定就ok了. 所以说,安装文件最好还是放在一个地方 ...
- PAT1070:Mooncake
1070. Mooncake (25) 时间限制 100 ms 内存限制 65536 kB 代码长度限制 16000 B 判题程序 Standard 作者 CHEN, Yue Mooncake is ...
- PAT1132: Cut Integer
1132. Cut Integer (20) 时间限制 400 ms 内存限制 65536 kB 代码长度限制 16000 B 判题程序 Standard 作者 CHEN, Yue Cutting a ...
- nodejs-2.httpfuwu
一.使用nodejs的http服务:处理 "请求或响应" 数据 要使用 HTTP 服务器与客户端,需要 require('http'). Node.js 中的 HTTP 接口被设计 ...
- CSS布局十八般武艺都在这里了
CSS布局十八般武艺都在这里了 Shelley Lee 4 个月前 布局是CSS中一个重要部分,本文总结了CSS布局中的常用技巧,包括常用的水平居中.垂直居中方法,以及单列布局.多列布局的多种实现方式 ...
- app后端设计(9)-- 动态通知
在app中,例如在通知界面,当新通知的时候,需要显示有多少条通知,用户点击"获取新通知"后,就能看到新的通知. 那么在app端,怎么才能知道有多少条新通知? 实现的技术有两种: 1 ...
- 手机端实现fullPage——全屏滚动效果
封装了一个小插件模拟fullPage的全屏滚动效果,比较简单. 特点: 1. 纯js实现,小巧轻便. 2. 兼容性好.苹果.安卓都没问题,暂时没遇到问题机型. 缺点: 1. 仅封装了基础功能,H ...
- Day1----Python学习之路笔记（1）
学习路线 Day1 Day2 Day3 Day4 Day5 ...待续 一.了解开发语言 1.高级语言:Python,Java,C++,C#,PHP,JS,Go,Ruby,SQL,Swift,Perl ...
- j2ee 使用db.properties连接mysql数据库
转自: http://blog.csdn.net/u013815546/article/details/50808493 注: 下面的方法是未安装构架的写法,需要自己加载驱动并建立连接. 若引入了Ac ...