一、配置java_jdk以及tomcat
arcgis for javascript api 部署到本地服務器，可以是iis，也可以是tomcat,我這里是部署到tomcat,所以就介紹一下tomcat上部署的步驟。如果電腦上有本地服務器的，可以跳過這一章，直接從第二章開始看 下載arcgis for javascript API
要部署到tomcat,咱得有tomcat,而tomcat運行又得有java_jdk環(huán)境，所以第一步咱先下載安裝配置好java運行環(huán)境。
tomcat版本和java_jdk運行版本如下：
上面紅色框是我安裝的版本，tomcat是10.1的，對應的java_jdk就得是11及以上。
1. 下載安裝配置java環(huán)境
下載java_jdk官網(wǎng)地址：https://www.oracle.com/
來到官網(wǎng)，當然得先注冊登錄一下，這個就不介紹了，找到product -> softwart-> java
然后根據(jù)對應的系統(tǒng)下載對應jdk就行了
如果你下載的是zip的直接解壓就行了，
如果是exe的就雙擊運行然后傻瓜式的點下一步，就行了
這一步是安裝位置，默認是c盤，建議大家搞到其他磁盤，點擊更改就行了
安裝完成之后，需要去配置java環(huán)境變量
這里介紹的是win10的配置方法，其他系統(tǒng)的也差不多，不會的大家可以搜搜教程
找到我的電腦，右擊->屬性->高級系統(tǒng)設置->環(huán)境變量
點擊新建JAVA_HOME變量
變量值是你安裝的java位置，如圖我的在d盤
確定之后找到path變量，配置一下JAVA_HOME執(zhí)行目錄
點擊編輯，將%JAVA_HOME%\bin加到path里面即可
然后我們win+R調(diào)起終端，輸入javac
看到如圖所示，代表你的java運行環(huán)境安裝配置完成了。
2. 下載安裝配置tomcat運行環(huán)境
tomcat下載官網(wǎng)：https://tomcat.apache.org/download-10.cgi
找到download,點擊進去下載你需要的版本就好了
下載的zip文件，解壓到你想安裝的位置，如圖我就直接將它放在d盤
完成之后，和java一樣，這玩意也需要配置環(huán)境變量，同樣的找到我的電腦->屬性->高級系統(tǒng)設置->環(huán)境變量
新建CATLINA_HOME變量，變量值就是你的tomcat安裝目錄
同樣的將這個執(zhí)行目錄配置到path中
然后確定之后，找到D:\apache-tomcat-10.1.9\bin目錄下的startup.bat文件，雙擊運行
順利的話，會有一個窗口如圖所示
保持這個窗口打開，去瀏覽器中輸入localhost:8080,看到如圖所示界面，代表你的tomcat啟動成功了
什么？你的窗口閃一下就沒了？哈哈哈，恭喜你啟動失敗
這種情況很正常，不要慌，首先還是我開頭強調(diào)的，排查下你安裝的java_jdk版本和你的tomcat版本是否對應，對應關系我再附一遍圖：
如果版本沒問題，你的java環(huán)境也沒問題，那就可能是你的tomcat環(huán)境變量配置的不對，如果你按照我上面的配置了沒有問題，還是閃退，那就試一下，在配置兩個變量，變量值都是你的tomcat安裝路徑，如圖：
同樣的將這兩個變量執(zhí)行目錄加入到path變量中
然后找到D:\apache-tomcat-10.1.9\bin目錄下的startup.bat, shutdown.bat這兩個文件，
右鍵編輯：
加上我紅色框出的這兩句，當然后面的變量值都是你自己的安裝目錄哦
shutdown.bat文件也一樣也加上這兩句話
編輯完成之后，我們在雙擊startup.bat文件，運行tomcat
到這里如果還是閃退，那就再改一下startup.bat文件
改完之后，保存，雙擊它， 如果黑框還是閃退，?。。。?br> 那么我也無能為力，我知道的和踩過的坑就這么多，都在上面記錄，
建議問問chatGPT，哈哈哈哈，狗頭.jpg
好了說了這么多，步入今天的正題吧，本地部署arcgis for javascript API
二、下載部署arcgis for javascript API
官網(wǎng)地址：https://developers.arcgis.com/dashboard/
點擊downLoads
在左側點擊ArcGIS Maps SDK for javascript
右側就有對應的api 版本號，下載你想要的版本就行了。
下載解壓完了之后，找到arcgis_js_api目錄，點進去
找到這個版本號目錄，將其拷貝到tomcat的webapps下，如圖：
然后我們啟動tomcat,在瀏覽器中訪問http://localhost:8080/4.26/init.js 如圖表示部署成功了：
然后我們直接去官網(wǎng)拉個例子下來，將里面的官網(wǎng)地址換成我們的本地地址
將這兩個鏈接
<link rel="stylesheet" href="https://js.arcgis.com/4.26/esri/themes/light/main.css" />
<script src="https://js.arcgis.com/4.26/"></script>
換成本地鏈接
<link rel="stylesheet" href="http://localhost:8080/4.26/esri/themes/light/main.css" />
<script src="http://localhost:8080/4.26/init.js"></script>
完整代碼如下：
<!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</title>
<style>
html,
body,
#viewDiv {
padding: 0;
margin: 0;
height: 100%;
width: 100%;
}
</style>
<link rel="stylesheet" href="http://localhost:8080/4.26/esri/themes/light/main.css" />
<script src="http://localhost:8080/4.26/init.js"></script>
<script>
require(["esri/Map", "esri/views/MapView"], (Map, MapView) => {
const map = new Map({
basemap: "topo-vector"
});
const view = new MapView({
container: "viewDiv", // Reference to the view div created in step 5
map: map, // Reference to the map object created before the view
zoom: 4, // Sets zoom level based on level of detail (LOD)
center: [15, 65] // Sets center point of view using longitude,latitude
});
});
</script>
</head>
<body>
<div id="viewDiv"></div>
</body>
</html>
如果你運行起來能看到2d地圖，則代表本地部署的api可以用，如圖：
當然如果你的tomcat沒有配置跨域訪問的話，一般情況下到這一步是顯示不出來的地圖的，會報跨域訪問的錯誤，如圖：
這時候就需要我們?nèi)ヅ渲胻omcat跨域了，找到tomcat中的config下的web.xml,
在<wab-app></wab-app>標簽中加上如下配置即可：
<filter>
<filter-name>CorsFilter</filter-name>
<filter-class>org.apache.catalina.filters.CorsFilter</filter-class>
<init-param>
<param-name>cors.allowed.origins</param-name>
<param-value>*</param-value>
</init-param>
</filter>
<filter-mapping>
<filter-name>CorsFilter</filter-name>
<url-pattern>/*</url-pattern>
</filter-mapping>
然后重啟tomcat地圖應該就可以加載出來啦。
當然我這里下載的arcgis for javascript api 是4.26 版本，所以下載下來部署之后配置個跨域就能訪問了，如果你下載的版本在4.17一下，包括4.17，需要找到版本號之后的init.js文件和dojo/dojo.js文件
將里面的 HOSTNAME_AND_PATH_TO_JSAPI替換成對應的localhost/4.xx版本號我以4.14為例如圖：
換完之后按照上面測試4.26的方式一樣，去官方拉個例子，將官方網(wǎng)址換成本地對應的服務版本，如果能正確加載出地圖，表示本地部署配置成功。文章來源：http://www.zghlxwxcb.cn/news/detail-470269.html
好啦以上就是關于arcgis for javascript api 本地部署的全部內(nèi)容，本人也是菜雞剛接觸arcgis歡迎留言討論文章來源地址http://www.zghlxwxcb.cn/news/detail-470269.html
到了這里，關于arcgis for javascript api4.26 本地tomcat部署,以及解決跨域訪問問題的文章就介紹完了。如果您還想了解更多內(nèi)容，請在右上角搜索TOY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關文章，希望大家以后多多支持TOY模板網(wǎng)！
