Vue.js - 集成Cesium构建三维可视化场景教程2（Token申请和设置）
作者：hangge | 2026-07-03 08:50
在实际开发过程中，我们在加载默认影像、地形数据或部分官方资源时，常常会遇到诸如影像无法显示、地形加载失败、控制台报 401/403 错误等问题，其根本原因往往与 Cesium Ion Token 的配置有关。本文将演示如何申请 Token 并设置使用。
（4）如果不希望全局生效，也可以在组件内部设置：
二、Token 申请和设置
1，问题描述
（1）使用 cesium 需要申请一个 token 值，这个就和百度地图或者是高德地图一样，需要一个 token 秘钥来进行操作，确保在使用 cesium 的过程中不会出现 token 过期造成地图加载不出来的问题。
提示：如果我们只使用本地数据并部署在内网环境，可以不配置 Token。但以下场景通常必须配置：
- 使用 createWorldTerrainAsync()
- 使用 Cesium 官方在线影像
- 加载 Cesium Ion 上托管的 3D Tiles
（2）虽然前文我们并未使用 token 也能加载出地图，但是页面会显示如下提示。并且随着我们测试编写的时间增长，调用 cesium 图层次数过多，就会出现图层加载不出来，所以说我们现在就设置上 token，防止这种事情的发生。
This application is using Cesium's default ion access token. Please assign Cesium.Ion.defaultAccessToken with an access token from your ion account before making any Cesium API calls. You can sign up for a free ion account at https://cesium.com
2，解决办法
（1）访问 Cesium 官网（点击访问），注册一个账号并登录。
（2）登录后依次进行如下操作即可创建一个 Token。
（3）最后，在 Vue 项目中设置 Cesium Token 即可。我们可以在 main.js 中添加如下代码，在 Cesium 初始化之前设置全局 Token。
import * as Cesium from 'cesium' Cesium.Ion.defaultAccessToken = '你的Cesium Ion Token'
（4）如果不希望全局生效，也可以在组件内部设置：
async initCesium() {
Cesium.Ion.defaultAccessToken = '你的Cesium Ion Token'
this.viewer = new Cesium.Viewer(this.$refs.cesiumContainer, {
terrainProvider: await Cesium.createWorldTerrainAsync()
})
}
全部评论（0）