ArcGIS JS API：令牌与安全资源及PHP获取令牌后的使用咨询

嘿，我来帮你搞定这个问题！既然你已经通过PHP拿到了ArcGIS的访问令牌，接下来在JS地图代码里用它访问安全资源其实很简单，分两种常见场景给你梳理：

1. 使用ArcGIS官方JavaScript API（4.x版本） #

如果是用ArcGIS官方的JS API开发地图，有两种便捷的方式来集成令牌：

方式一：给单个图层直接指定令牌 #

如果只有少数几个安全图层，你可以在创建图层的时候直接把令牌传进去，或者拼在服务URL后面：

// 示例：创建带令牌的FeatureLayer
const secureFeatureLayer = new FeatureLayer({
  url: "https://gis.server.com/arcgis/rest/services/YourSecureService/FeatureServer/0",
  token: "tAGEfjIY7Risc2hFNgqXpvkdHbr1ObiFNlVL9ag2kO9gBoDDsUoSiMjbwjvJZfWjD36gLpqIiBNpGu7yPPPn1lAM-uGZTpDOEMPCxpZFHmlLq_noTXb--1fSjFo1cGC9z0hcgKiMrwvseMvyLbpDMQ.."
});

// 把图层添加到地图实例
map.add(secureFeatureLayer);

或者直接在URL后拼接令牌：

const secureLayerUrl = "https://gis.server.com/arcgis/rest/services/YourSecureService/FeatureServer/0?token=你的令牌内容";
const secureLayer = new FeatureLayer({ url: secureLayerUrl });

方式二：全局配置令牌（适合多安全资源场景） #

如果你的地图里有多个安全服务/图层，不想每个都手动加令牌，可以用API的AuthenticationManager做全局配置，之后所有请求都会自动带上令牌：

import { AuthenticationManager } from "@arcgis/core/identity/AuthenticationManager.js";
import { TokenCredential } from "@arcgis/core/identity/TokenCredential.js";

// 创建令牌凭证，注意expires要和你请求令牌时设置的expiration一致（比如60分钟）
const tokenCredential = new TokenCredential({
  token: "你的令牌内容",
  server: "https://gis.server.com/arcgis/rest/services", // 你的服务根路径
  expires: new Date(Date.now() + 60 * 60 * 1000) // 60分钟后过期
});

// 将凭证添加到全局认证管理器
AuthenticationManager.addCredential(tokenCredential);

// 之后加载安全图层就不用单独设置令牌了
const map = new Map({
  basemap: "topo-vector",
  layers: [new FeatureLayer({ url: "https://gis.server.com/arcgis/rest/services/YourSecureService/FeatureServer/0" })]
});

2. 手动发送HTTP请求（不用官方JS API的情况） #

如果是自己用fetch、axios等工具直接请求ArcGIS安全服务，只需要把令牌作为参数附加到请求里，或者放在请求头中：

用fetch的GET请求示例 #

const token = "你的令牌内容";
const serviceQueryUrl = "https://gis.server.com/arcgis/rest/services/YourSecureService/FeatureServer/0/query";

// 把令牌拼在URL参数里
fetch(`${serviceQueryUrl}?f=json&where=1=1&token=${token}`)
  .then(res => res.json())
  .then(data => {
    // 处理返回的服务数据
    console.log("获取到的安全资源数据：", data);
  })
  .catch(err => console.error("请求失败：", err));

用fetch的POST请求示例（放在请求头） #

有些ArcGIS服务支持把令牌放在Authorization请求头里，格式为Bearer 你的令牌：

const token = "你的令牌内容";
const serviceQueryUrl = "https://gis.server.com/arcgis/rest/services/YourSecureService/FeatureServer/0/query";

fetch(serviceQueryUrl, {
  method: "POST",
  headers: {
    "Content-Type": "application/x-www-form-urlencoded",
    "Authorization": `Bearer ${token}`
  },
  body: new URLSearchParams({
    f: "json",
    where: "1=1"
  })
})
.then(res => res.json())
.then(data => console.log(data))
.catch(err => console.error(err));

几个重要注意事项 #

• 令牌过期问题：你设置的令牌有效期是60分钟，记得在过期前重新调用PHP接口获取新令牌，避免请求失败。
• IP绑定限制：因为你请求令牌时用了client=ip模式，所以当前访问地图的客户端IP必须和你请求令牌时填写的ip参数一致，否则令牌会失效。
• 安全问题：如果是在前端代码中直接写令牌，一定要确保你的页面只在可信环境中访问，避免令牌泄露给无关用户。如果是公开页面，建议通过后端代理请求安全资源，不要把令牌暴露在前端。

内容的提问来源于stack exchange，提问作者Jeko Eustaquio