openlayers之天地圖為底圖 疊加其他底圖 加載遇到的各種報錯

今天以前使用天地圖為底圖時，map里source的定義：http://t3.tianditu.com~~~

今天突然報跨域的錯誤，原有地址訪問受限，可是key值是有的

最后發現就是前半段的原因 將前半段地址改為 http://t3.tianditu.gov.cn即可

-------------------------------

今天又莫名的報了400的錯，真是一天一個花樣啊!

今天終於發現因為搬運的地圖初始化方法，沒有細考究如下

const kpst = {
  init: () => {
    var _op = { target: conf.target, layers: [], view: new View(conf.view) }
    kpst._this = new ol.Map(_op)
    const maps = conf.urls
    for (const index in maps) {
      const m = maps[index]
      if (!m.overlay) continue
      var layerConf = {
        source: new TileArcGISRest({
          url: m.url,
          params: { 'sessionId': localStorage.getItem('kpst-token') },
        })
      }
      if (m.extent) layerConf.extent = m.extent
      kpst._this.addLayer(new TileLayer(layerConf))
    }

conf.js

export default {
  target: 'map_container',
  view: {
    center: [88.434653, 31.559746],
    zoom: 7,
    maxZoom: 18,
    minZoom: 0,
    projection: 'EPSG:4326'
  },
  urls: [
    {
      url: 'http://arcgis.keepsoft.net:9472/arcgis/rest/services/BaseMap/MapServer',
      overlay: true
    },
    {
      url: 'http://t4.tianditu.com/DataServer?T=vec_w&x={x}&y={y}&l={z}&tk=d0cf74b31931aab68af181d23fa23d8d',
      overlay: true
    }
  ]
}

一個是XYZ切片一個是ArcGIS切片，我居然沒有注意到

JavaScript API調用

以天地圖JavaScript API 4.0為例，您只要在引用的API 地址后增加授權信息即可，其余使用方法不變。例如：
http://api.tianditu.gov.cn/api?v=4.0&tk=您的密鑰

地圖服務調用

以天地圖影像瓦片底圖（球面墨卡托投影）服務為例，在原有瓦片獲取請求參數中增加授權參數即可，其余使用方法不變。例如：
http://t0.tianditu.gov.cn/img_w/wmts?SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=img&STYLE=default&TILEMATRIXSET=w&FORMAT=tiles&TILEMATRIX={z}&TILEROW={x}&TILECOL={y}&tk=您的密鑰

應用服務調用

以天地圖POI搜索服務為例，在服務請求參數中增加授權參數即可，其余使用方法不變。例如：
http://api.tianditu.gov.cn/geocoder?ds={"keyWord":"延慶區北京市延慶區延慶鎮蓮花池村前街50夕陽紅養老院"}&tk=您的密鑰