ArcGIS API 4.16 for JS 的开发—— 本地部署 IIS 服务（一）

最新推荐文章于 2024-07-27 23:17:42 发布

greatathrun

最新推荐文章于 2024-07-27 23:17:42 发布

阅读量627

点赞数 2

分类专栏：安装部署 ArcGIS API For JS 文章标签： js arcgis iis

本文链接：https://blog.csdn.net/greatathrun/article/details/108973589

版权

安装部署同时被 2 个专栏收录

6 篇文章 0 订阅

订阅专栏

ArcGIS API For JS

5 篇文章 0 订阅

订阅专栏

跟着 CSDN 众多文章进行操作，中间出现了很多问题。现在将详细方法和问题解决方法 po 出来。

API 接口无法访问 esri.github.io （直接修改 hosts 文件修改方法点此，另外这个网站可以查询域名对应的 ip ）
无法加载 JS 文件，JS 文件存在，但是全是空白的（解决方法 – 勾选静态内容–）
找不到 MIME 选项（以管理员权限打开 IIS）
打开地图是空白的（dojo.js和init.js中的文件不要使用 localhost,使用127.0.0.1或者服务器域名，以及html中的src中需要 init.js ）
很多早期版本3.x的 API 部署都是使用 localhost ，具体为什么这个会导致无法访问我也不甚了解，似乎是跨源读取阻止(CORS)功能导致的

开发方式

目前ArcGIS JS 的开发测试方式主要分成

CDN ：
（官方或第三方 API 服务，本地部署服务）
本地文件：
（调用本地 JS 文件）

本地部署

采用官方或者第三方 API 可能会因为网络问题受阻，“服务器限制外网连接等原因”。
所以目前很多资料都是使用本地部署 API 服务。

注册下载

ArcGIS 的 API 文档都需要在官网通过注册来下载
得到类似的资源
在这里插入图片描述

启用 IIS 服务器

打开 => 控制面板 => 启用或关闭 Windows 功能 =>
在这里插入图片描述
在 Internet Information Services 部分你要是不清楚就全部勾上
我这边 FTP 服务器是因为以前在局域网弄了一个这个服务器，存文件用。如果感兴趣可以看看
PS: 这边我之前忘了勾选 常见 HTTP 功能 下的 静态内容
在这里插入图片描述
导致打开的 JS 文件都是空白的。

设置 IIS 服务器

按理应该 Tomcat、Node.js 都可以

启动服务器

Win 搜索中输入IIS 并使用管理员权限打开
在这里插入图片描述
选择默认的网站并打开

设置MIME选项

如果正常打开 IIS 是无法找到MIME选项的（即：你在 IIS 中看不到 MIME 的设置选项）
这时需要使用管理员权限打开

设置 JS 文件

在这个默认的网站上他对应的物理路径一般是 C:\inetpub\wwwroot 。也可以新建一个网站，然后自己设置物理路径
将对应的 ArcGIS 文件放入这个文件夹中。
同时将
在这里插入图片描述

这俩文件进行修改

找到 arcgis_js_api\library\3.9\3.9\init.js 文件中的 HOSTNAME_AND_PATH_TO_JSAPI 修改成下图中的http://127.0.0.1/arcgis_js_api/library/4.16/dojo
在这里插入图片描述
找到 arcgis_js_api\library\4.16\dojo\dojo.js 文件中的
HOSTNAME_AND_PATH_TO_JSAPI 修改成下图中的 http://127.0.0.1/arcgis_js_api/library/4.16/dojo

这边设置的是 http ，如果使用推荐的 https 的话需要一直点认证。比较麻烦但是安全。

测试

在浏览器里打开

http://localhost/arcgis_js_api/library/4.16/init.js

如果可以看见 js 文件的内容就没问题了。之前是因为没有设置静态内容，所以全是空白。
还可以使用如下官方代码
我是 4.16 版本的，所以对应的本地连接需要设置自己下载的版本
在第二个src中 src="http://localhost/arcgis_js_api/library/4.16/init.js
要注意init.js不能省略 许多教程给省略了，省略后会导致 require is not defined ，require未定义

<!DOCTYPE html>
<meta http-equiv="Access-Control-Allow-Origin" content="*">
<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.15</title>
    <style>
      html,
      body,
      #viewDiv {
        padding: 0;
        margin: 0;
        height: 100%;
        width: 100%;
      }
    </style>

    <link rel="stylesheet" type="text/css" href="http://localhost/arcgis_js_api/library/4.16/esri/css/main.css" />   
    <script type="text/javascript" src="http://localhost/arcgis_js_api/library/4.16/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>