引言:本文用的是api4.6版本

方法一  拷贝api进去tomcat服务器用绝对地址引用

首先将下载好的api放入Tomcat服务中的Webapp下:

1  可以打开下载好的的 api46/arcgis_js_api/library/downloads/install-windows/index.html页面

注意:这里的www.example.com就是你的本机服务器 通常要加上端口 即是localhost:8080

2 官方的安装文档写的清楚  就是dojo.js和init.js文件里的baseurl的值的替换,目的是为了浏览器能够找到dojo文件夹 ,毕竟这套api是基于dojo框架写的 ,baseurl相当于入口吧

记住:3.x版本的是http而4.x版本的都变为https了,我们在修改4.x版本的baseUrl路径的时候,一定要把https改为http,不然会留下大坑的

根据自己本机api的位置的设置好。

3 引用api文件

当然,前提你要启动你的Tomcat服务器,要不然请求个毛线啊!

 <link rel="stylesheet" href="http://localhost:8080/api46/arcgis_js_api/library/4.6/esri/css/main.css">
<script type="text/javascript" src="http://localhost:8080/api46/arcgis_js_api/library/4.6/init.js"></script>

注意init.js文件也可以直接引用<script src="http:localhost:8080/arcgis_js_api/library/4.6/dojo/dojo.js"></script>,这起到相同的作用;

4 test文件测试是否成功

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no">
<title>Load a basic WebMap - 4.6</title> <style>
html,
body,
#viewDiv {
padding: 0;
margin: 0;
height: 100%;
width: 100%;
}
</style> <link rel="stylesheet" href="http://localhost:8080/api46/arcgis_js_api/library/4.6/esri/css/main.css">
<script type="text/javascript" src="http://localhost:8080/api46/arcgis_js_api/library/4.6/init.js"></script> <script>
require([
"esri/views/MapView",
"esri/WebMap",
"dojo/domReady!"
], function(
MapView, WebMap
) { var webmap = new WebMap({
portalItem: { // autocasts as new PortalItem()
id: "f2e9b762544945f390ca4ac3671cfa72"
}
}); var view = new MapView({
map: webmap,
container: "viewDiv"
});
});
</script>
</head> <body>
<div id="viewDiv"></div>
</body> </html>

如果出现以上的网页 恭喜你 部署成功!

5 当然 以我的失败经验得出 肯定会出错,比如左上角的控件符号没有显示 控制台会打印出以下错误:

Access to Font at 'http://localhost:8080/arcgis_js_api/library/4.6/esri/themes/base/icons/fonts/CalciteWebCoreIcons.woff?cu4poq' from origin 'null' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access.

这是显示你已经跨域请求资源导致资源请求失败 但是解决办法是有的 修改Tomcat的web.xml配置文件  打开config/web.xml文件,添加下面的代码

(如web.xml中有多个filter时要把下面配置放在最前端)

<filter>
 <filter-name>CorsFilter</filter-name>
 <filter-class>org.apache.catalina.filters.CorsFilter</filter-class>
 <init-param>
   <param-name>cors.allowed.methods</param-name>
   <param-value>GET,POST,HEAD,OPTIONS,PUT</param-value>
 </init-param>
 <init-param>
   <param-name>cors.allowed.headers</param-name>
   <param-value>Access-Control-Allow-Origin,Content-Type,X-Requested-With,accept,Origin,Access-Control-Request-Method,Access-Control-Request-Headers</param-value>
 </init-param>
 <async-supported>true</async-supported>
</filter>
<filter-mapping>
 <filter-name>CorsFilter</filter-name>
 <url-pattern>/*</url-pattern>

</filter-mapping>

这样应该就可以了的

方法二  拷贝api进去进去项目用用相对引用地址

1 将你下载好的api文件全部复制到你新建的jsapi4.6文件夹里  (注意重要:api所在文件夹和html文件应该放在同一文件之下,即是同级)否则会发生错误 ,也可能是有别的方法吧

2   同样修改init.js和dojo.js文件

这里是相对于你html文件的地址

3 引用

<link rel="stylesheet" href="jsapi4.6/dijit/themes/claro/claro.css" />
<link rel="stylesheet" href="jsapi4.6/esri/css/main.css" />
<script src="jsapi4.6/dojo/dojo.js"></script>

这里是相对地址;

4 成功

两种方法各有优略  第一次花时间写着东西也是想给自己留个笔记

如果有更好的方法 希望各位不吝赐教

Arcgis 离线部署api 4.x的两种本地部署方法!的更多相关文章

  1. Jenkins持续集成企业实战系列之两种网站部署的流程-----01

    注:原创作品,允许转载,转载时请务必以超链接形式标明文章 原始出处 .作者信息和本声明.否则将追究法律责任.    最初接触Jenkins也是由于公司需求,根据公司需求Java代码项目升级的.(公司是 ...

  2. Idea集成SpringBoot实现两种热部署方式(亲测有效)

    即将介绍的两种热部署方式: 1.SpringLoaded 2.DevTools 区别: SpringLoader:SpringLoader 在部署项目时使用的是热部署的方式. DevTools:Dev ...

  3. Tomcat下载安装并部署到IDEA(附带idea两种热部署设置方法)

    目录 Tomcat下载教程 Tomcat安装教程 Tomcat热部署到IDEA idea两种热部署设置方法 使用Idea的时候,修改了代码,需要反复的重启Tomcat,查看效果,是不是贼烦?还记得刚上 ...

  4. 两种HTTP请求方法:GET和POST的区别

    之前在一些开发者平台使用网页调用API时,一再提到两种请求方法GET和POST,所以就去了解了下.那么这又不得不提到HTTP了! 一.什么是 HTTP? 超文本传输协议(HTTP)的设计目的是保证客户 ...

  5. GET和POST两种基本请求方法(转自博主--在途中#)

    GET和POST两种基本请求方法的区别 GET和POST是HTTP请求的两种基本方法,要说它们的区别,接触过WEB开发的人都能说出一二. 最直观的区别就是GET把参数包含在URL中,POST通过req ...

  6. 转:GET和POST两种基本请求方法的区别

    原文地址:GET和POST两种基本请求方法的区别 原文如下: GET和POST是HTTP请求的两种基本方法,要说它们的区别,接触过WEB开发的人都能说出一二. 最直观的区别就是GET把参数包含在URL ...

  7. 表格细边框的两种CSS实现方法

    在网页制作中,细边框这个制作方法是必不可少的.这里介绍2种常见的表格细边框制作方法,均通过XHTML验证. <!DOCTYPE html PUBLIC "-//W3C//DTD XHT ...

  8. 修改linux 两种时间的方法

    1,整理了一下怎么修改linux 两种时间的方法. 硬件时间:hwclock 或者clock,设置的方法是 hwclock --set --date="05/12/2018 12:30:50 ...

  9. arcis api for js 值 3.17 本地部署

    1. 引言 在学习 ArcGIS API 的过程中,如果我们引用在线的 API,在没有网络或者网络差的情况下,会影响到我们的学习效率,本篇文章就是为了解决这个问题.下载 ArcGIS API 之后,部 ...

随机推荐

  1. 简述redis特点及其应用场景

    1. Redis八大特点 1.1. 速度快 说到Redis的速度快,大家的第一反应一定是内存读取,那是肯定的,但如果面试的时候仅仅说到这点,那还是远远不够的,至少还有以下三点要补充: Redis是用C ...

  2. 1python基础语法_11模块

    http://www.runoob.com/python3/python3-module.html 模块是一个包含所有你定义的函数和变量的文件,其后缀名是.py.模块可以被别的程序引入,以使用该模块中 ...

  3. 13、Linux基础--grep、sed、awk三剑客综合运用

    考试 1.找出/proc/meminfo文件中以s开头的行,至少用三种方式忽略大小写 [root@localhost ~]# grep -E '^[sS]' /proc/meminfo [root@l ...

  4. 04.python语法入门--基本数据类型

    # python是一门解释型的.强类型的.动态语言​​# 一:数字类型# 1.1 整型int:记录人的年龄.等级.号码.个数# age = 18# print(type(age))​# 1.2 浮点数 ...

  5. Solution -「APIO 2016」「洛谷 P3643」划艇

    \(\mathcal{Description}\)   Link & 双倍经验.   给定 \(n\) 个区间 \([a_i,b_i)\)(注意原题是闭区间,这里只为方便后文描述),求 \(\ ...

  6. LibOpenCM3(五) 基础功能: 系统时钟, GPIO, 定时器

    目录 LibOpenCM3(一) Linux下命令行开发环境配置 LibOpenCM3(二) 项目模板 Makefile分析 LibOpenCM3(三) .ld文件(连接器脚本)和startup代码说 ...

  7. 【Kotlin】初识Kotlin之面向对象

    [Kotlin]初识Kotlin之面向对象 1.类 在Kotlin中,类用关键字class来定义 如果一个类具有类体,那么需要使用{ }来写类体内容,如果不需要类体,那么只需要定义类名就可以了 // ...

  8. RENIX流量发送模式——网络测试仪实操

    信而泰的RENIX平台支持5种传输模式, 如下图所示. 模式一: continuous Continuous:连续发送流 持续发送方式是默认的发送模式,  它不会自动的停止, 会一直发送, 直到用户手 ...

  9. FPGA+x86构建高性能国产网络测试仪竞技之道

    众所周知,以太网已经深入我们的生活无处不在,企业.校园.大数据中心和家庭等都离不开网络,否则我们的生活将受到严重的影响. 以太网的接口速率也是迅速发展:10M.100M.GE.10GE.40GE.10 ...

  10. 安装好的pycharm修改代码存储路径

    安装好pycharm的时候,第一次点开pycharm没有配置好,导致代码存放的路径是默认的.但是现在想把路径改成自己的路径怎么办? 首先,pycharm->file->settings-& ...