Arcgis 离线部署api 4.x的两种本地部署方法!
引言:本文用的是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的两种本地部署方法!的更多相关文章
- Jenkins持续集成企业实战系列之两种网站部署的流程-----01
注:原创作品,允许转载,转载时请务必以超链接形式标明文章 原始出处 .作者信息和本声明.否则将追究法律责任. 最初接触Jenkins也是由于公司需求,根据公司需求Java代码项目升级的.(公司是 ...
- Idea集成SpringBoot实现两种热部署方式(亲测有效)
即将介绍的两种热部署方式: 1.SpringLoaded 2.DevTools 区别: SpringLoader:SpringLoader 在部署项目时使用的是热部署的方式. DevTools:Dev ...
- Tomcat下载安装并部署到IDEA(附带idea两种热部署设置方法)
目录 Tomcat下载教程 Tomcat安装教程 Tomcat热部署到IDEA idea两种热部署设置方法 使用Idea的时候,修改了代码,需要反复的重启Tomcat,查看效果,是不是贼烦?还记得刚上 ...
- 两种HTTP请求方法:GET和POST的区别
之前在一些开发者平台使用网页调用API时,一再提到两种请求方法GET和POST,所以就去了解了下.那么这又不得不提到HTTP了! 一.什么是 HTTP? 超文本传输协议(HTTP)的设计目的是保证客户 ...
- GET和POST两种基本请求方法(转自博主--在途中#)
GET和POST两种基本请求方法的区别 GET和POST是HTTP请求的两种基本方法,要说它们的区别,接触过WEB开发的人都能说出一二. 最直观的区别就是GET把参数包含在URL中,POST通过req ...
- 转:GET和POST两种基本请求方法的区别
原文地址:GET和POST两种基本请求方法的区别 原文如下: GET和POST是HTTP请求的两种基本方法,要说它们的区别,接触过WEB开发的人都能说出一二. 最直观的区别就是GET把参数包含在URL ...
- 表格细边框的两种CSS实现方法
在网页制作中,细边框这个制作方法是必不可少的.这里介绍2种常见的表格细边框制作方法,均通过XHTML验证. <!DOCTYPE html PUBLIC "-//W3C//DTD XHT ...
- 修改linux 两种时间的方法
1,整理了一下怎么修改linux 两种时间的方法. 硬件时间:hwclock 或者clock,设置的方法是 hwclock --set --date="05/12/2018 12:30:50 ...
- arcis api for js 值 3.17 本地部署
1. 引言 在学习 ArcGIS API 的过程中,如果我们引用在线的 API,在没有网络或者网络差的情况下,会影响到我们的学习效率,本篇文章就是为了解决这个问题.下载 ArcGIS API 之后,部 ...
随机推荐
- 【AGC035D】Add and Remove(脑洞 DP 分治)
题目链接 大意 给出\(N\)个数的序列,每次操作可以选择连续的三个数,将中间的那个数抽出,将另外两个数的数值加上中间那个数的数值. 一直执行以上操作直到只剩最后两个数,求最后两个数的所有可能的和的最 ...
- Spring Security 介绍
Spring Security介绍 开源 提供企业级的安全认证和授权 Spring安全拦截器 认证管理器 认证模式 Basic HTTP 1.0中使用的认证方法,使用用户名和密码Base64编码的方式 ...
- CoaXPress 接口相机的控制方法--1
GenICam 介绍 简而言之,GenICam 定义了一个通用的相机接口,使得应用程序的编写.相机的控制可以与具体的型号解耦,这样就可以设计出通用的软件完成对不同相机的控制.我们实际使用的CoaXPr ...
- [入门到吐槽系列] Webix 10分钟入门 一 管理后台制作
前言 本人是服务端程序员,同时需要兼职前端开发.常用的就是原生态的HTML.Javascript,也用过ExtJS.Layui.可是ExtJS变公司后非常难用.Layui上手还行,用过一段时间,会觉得 ...
- vivo 服务端监控架构设计与实践
一.业务背景 当今时代处在信息大爆发的时代,信息借助互联网的潮流在全球自由的流动,产生了各式各样的平台系统和软件系统,越来越多的业务也会导致系统的复杂性. 当核心业务出现了问题影响用户体验,开发人员没 ...
- 一个接口多个实现Spring如何实现正确注入
阅读源码的时候,时不时脑子中冒出一个问题:如果自己写一个单例的容器,一个接口多个实现怎么正确地将每个实现都缓存容器中并准确地注入呢?阅读Dubbo源码时也有类似的问题冒出来. 对于@Autowire注 ...
- 『无为则无心』Python面向对象 — 46、类和对象
目录 1.理解类和对象 2.类 3.对象 4.Python中的对象 5.类和对象的定义 (1)定义类 (2)创建对象 (3)练习 6.拓展:isinstance() 函数 1.理解类和对象 (1)类和 ...
- ApplicationStartedEvent与ContextStartedEvent有区别吗?
大家好,我是DD! 今天跟大家聊聊这个问题:ApplicationStartedEvent与ContextStartedEvent有区别吗? 对了,最近花了几周时间,把SpringForAll社区 3 ...
- oj教程--坑
1.OJ判断是只看输出结果的. 2.纯字符串用puts()输出. 3.有很多数学题是有规律的,直接推公式或用递归.循环. 4.擅用三目运算符 5.将乘法转换成加法减少时间 6.空间换时间 7.数组越界
- python刷剑指offer(21-40)(一刷)
21.输入两个整数序列,第一个序列表示栈的压入顺序,请判断第二个序列是否可能为该栈的弹出顺序.假设压入栈的所有数字均不相等.例如序列1,2,3,4,5是某栈的压入顺序,序列4,5,3,2,1是该压栈序 ...