ArcGIS API for JavaScript 4.x 免登录调用 ArcGIS Online 私有服务

1. 简介

ArcGIS API for JavaScript 4.x 是一套基于 JavaScript 的开发工具包，用于构建交互式的地图和应用程序。它可以在浏览器上直接使用，通过调用 ArcGIS Online 或 ArcGIS Enterprise 的服务来实现地图数据的可视化和分析。本文将介绍如何在使用 ArcGIS API for JavaScript 4.x 时免登录调用 ArcGIS Online 私有服务。

2. 准备工作

在开始之前，您需要确保已经具备以下前提条件：

1. ArcGIS Online 私有服务的访问权限和相关凭据。
2. 已安装 Node.js，并可以使用 npm 安装依赖包。

3. 免登录调用 ArcGIS Online 私有服务

使用 ArcGIS API for JavaScript 4.x 免登录调用 ArcGIS Online 私有服务的步骤如下：

步骤 1：安装依赖包

在开始之前，您需要先创建一个新的项目文件夹，并在命令行中导航到该文件夹。然后执行以下命令安装必要的依赖包：

npm install @arcgis/core esri-loader

步骤 2：引入模块

创建一个新的 JavaScript 文件，如 index.js，并引入需要使用的模块：

import { loadModules } from 'esri-loader';

loadModules([
  'esri/config',
  'esri/WebMap',
  'esri/views/MapView',
]).then(([
  esriConfig,
  WebMap,
  MapView,
]) => {
  // 代码将放在这里
});

步骤 3：配置访问 ArcGIS Online 私有服务的凭据

在调用 ArcGIS Online 的私有服务之前，您需要先配置访问凭据。在 loadModules 方法的回调函数中，添加以下代码：

esriConfig.request.proxyUrl = '/proxy'; 
esriConfig.request.corsEnabledServers.push('arcgis-server-url');

将 'arcgis-server-url' 替换为您 ArcGIS Server 的 URL 地址。这两行代码将启用使用内置代理来绕过跨域问题，并配置允许访问 ArcGIS Server 的 URL。

步骤 4：创建地图和视图

继续在 loadModules 方法的回调函数中，添加以下代码来创建地图和视图：

const webmap = new WebMap({
  portalItem: {
    id: 'webmap-item-id'
  }
});

const view = new MapView({
  map: webmap,
  container: 'map-container'
});

将 'webmap-item-id' 替换为您要使用的 Web 地图的项 ID，将 'map-container' 替换为您的 HTML 页面中地图容器的 ID。

步骤 5：实现其他功能

您还可以根据需要实现其他相关功能，例如添加图层、对图层进行操作或者设置交互行为等等。

4. 结论

通过以上步骤，您可以使用 ArcGIS API for JavaScript 4.x 免登录调用 ArcGIS Online 的私有服务，并实现各种地图和应用程序的功能。请注意，您需要确保对 ArcGIS Online 私有服务的访问权限和相关凭据，以及正确配置调用凭据。

希望本篇文章对您有所帮助，祝您在使用 ArcGIS API for JavaScript 4.x 时取得成功！

参考文档：

• ArcGIS API for JavaScript
• ArcGIS API for JavaScript 4.x 官方文档
• ArcGIS API for JavaScript 4.x 概述