问题描述
当我们用ArcGIS JS API（无论3.X还是4.X版本）去加载Portal for ArcGIS中的服务或者GP工具等资源时，如果该资源的权限不是公共的，在我们的前端界面就一直会有一个弹窗，提示我们输入用户名/密码，如下图所示：
解决方法
其实这问题就是由权限问题引起，解决此问题的核心就是解决你要加载引用的这个服务或者GP工具等资源的权限即可，有两种有效的方法：
1、修改此数据资源的权限（最简单、但不推荐）
既然是由资源自身的权限问题引起的，那我们只需要修改它的权限就可以啊，没错，确实是这样。
我们在Portal里找到你要引用的资源，然后点击它后面的权限图标，将它的权限修改为“公共”即可，如下图所示：
经过上图的操作，我们的数据资源权限已经变成了公共了，这时候你再去刷新前端页面，烦人的小弹窗已经不见了。但是，更烦人的问题来了，客户会问你，你这样子将我们的数据相当于暴露了啊，这个方法我可接受不了。OK，那我们找找另外的方法。
2、注册token（代码层面解决，极力推荐）
既然我们直接将要引用的数据资源权限修改为“公共”的方法有人接受不了，那我们就不动它的权限，我们发挥码奴自身的优良传统，自己在代码层面解决。
然后查阅JS API发现，官网已经提供了这样的接口，我们只需要调用Portal的REST接口生成token，然后调用我们JS API官网提供的注册token的接口将我们生成的token注册了，那接下来你想加载引入多少个私有权限的资源都没有问题，具体操作如下：
2.1 调用Portal的REST接口来生成token，代码如下：
const _self = this;
const option = {
url: gConfig.arcgis_jsapi_hosturl + 'init.js',
css: gConfig.arcgis_jsapi_hosturl + 'esri/themes/light/main.css',
};
loadModules([
'esri/config',
], option)
.then(([esriConfig]) => {
esriConfig.portalUrl = gConfig.portal_arcgis_hosturl + 'arcgis'; //配置portal
// 注册token
let portalToken = null;
const params = {
'username': gConfig.portal_username,
'password': gConfig.portal_pwd,
'referer': window.location.hostname,
'f': 'json',
};
axios({
method: 'post',
url: gConfig.portal_arcgis_hosturl + 'arcgis/sharing/rest/generateToken',
data: qs.stringify(params),
}).then( function(response) {
portalToken = response.data.token; //成功返回的portal
}).catch(function(error) {
console.log(error);
});
}).catch((err) => {
_self.$message('底图创建失败，' + err);
});2.2 调用“esri/identity/IdentityManager”接口去注册token，便于后续代码调用私有的服务资源等，代码如下：
const _self = this;
const option = {
url: gConfig.arcgis_jsapi_hosturl + 'init.js',
css: gConfig.arcgis_jsapi_hosturl + 'esri/themes/light/main.css',
};
loadModules([
'esri/config',
'esri/identity/IdentityManager',
], option)
.then(([esriConfig, IdentityManager]) => {
esriConfig.portalUrl = gConfig.portal_arcgis_hosturl + 'arcgis';
// 注册token
let portalToken = null;
const params = {
'username': gConfig.portal_username,
'password': gConfig.portal_pwd,
'referer': window.location.hostname,
'f': 'json',
};
axios({
method: 'post',
url: gConfig.portal_arcgis_hosturl + 'arcgis/sharing/rest/generateToken',
data: qs.stringify(params),
}).then( function(response) {
portalToken = response.data.token;
IdentityManager.registerToken({ //注册生成的token
server: gConfig.portal_arcgis_hosturl + 'arcgis/sharing/rest',
token: portalToken,
});
}).catch(function(error) {
console.log(error);
});
}).catch((err) => {
_self.$message('底图创建失败，' + err);
});2.3 token生成了，然后也注册了，接下来我们就可以加载我们自己想要加载的一些资源啦，具体实例代码如下所示：
// 创建底图
_createMap: function(nodeid) {
const _self = this;
const option = {
url: gConfig.arcgis_jsapi_hosturl + 'init.js',
css: gConfig.arcgis_jsapi_hosturl + 'esri/themes/light/main.css',
};
loadModules(['esri/WebMap',
'esri/views/MapView',
'esri/config',
'esri/identity/IdentityManager',
'esri/widgets/ScaleBar'], option)
.then(([WebMap, MapView, esriConfig, IdentityManager, ScaleBar]) => {
esriConfig.portalUrl = gConfig.portal_arcgis_hosturl + 'arcgis';
// 注册token
let portalToken = null;
const params = {
'username': gConfig.portal_username,
'password': gConfig.portal_pwd,
'referer': window.location.hostname,
'f': 'json',
};
axios({
method: 'post',
url: gConfig.portal_arcgis_hosturl + 'arcgis/sharing/rest/generateToken',
data: qs.stringify(params),
}).then( function(response) {
portalToken = response.data.token;
IdentityManager.registerToken({
server: gConfig.portal_arcgis_hosturl + 'arcgis/sharing/rest',
token: portalToken,
});
}).catch(function(error) {
console.log(error);
});
//创建地图
const webmap = new WebMap({
portalItem: {
// autocasts as new PortalItem()
id: gConfig.largeScreenWebMapID,
},
});
const view = new MapView({
container: nodeid,
map: webmap,
zoom: _self.mapviewLevel,
center: [102.714408, 25.043706],
});
}).catch((err) => {
_self.$message('底图创建失败，' + err);
});
},