sdk4.0/src/on/index.js

/**
 * @desc 加载资源
 * @method on
 * @return Promise
 * @example YJ.on().then(()=>{
 *
 * })
 * */
// import * as THREE from '../../static/3rdparty/three/three.module.min.js';

function on(
  options = {
    isc: false,
    excel: false,
    flv: false,
    rtsp: false,
    hls: false,
    host: '',
    username: '',
    password: ''
  }
) {
  // window.THREE = THREE
  return new Promise((resolve, reject) => {
    let prefix = getSourceRootPath()
    let sources = [
      '/custom/css/index.css',
      '/arrow/algorithm.js',
      '/arrow/plotUtil.js',
      '/3rdparty/turf.min.js',
      '/3rdparty/fabric.min.js',
      '/3rdparty/proj4.js',
      '/3rdparty/pako.min.js',
      '/3rdparty/heatmap.js',
      '/3rdparty/tween.umd.js',
      // '/3rdparty/video.min.js',
      // '/3rdparty/videojs-contrib-hls.min.js',
      '/Cesium/Cesium.js',
      '/Cesium/Widgets/widgets.css',
      '/3rdparty/ewPlugins.min.js',
      '/3rdparty/wangeditor/index.js',
      '/3rdparty/wangeditor/style.css',
      '/3rdparty/html2canvas.min.js',
      '/3rdparty/kriging.js',
      '/3rdparty/echarts.min.js',
      '/3rdparty/clipboard.min.js',
      '/3rdparty/libgif.js',
      '/3rdparty/liveplayer/liveplayer-element.min.js',
      '/3rdparty/jedate/jedate.min.js',
      '/3rdparty/jedate/skin/jedate.css',
      // '/3rdparty/ewColorPicker/ew-color-picker.min.css',
      // '/3rdparty/ewColorPicker/ew-color-picker.min.js',
      // '/3rdparty/modelloadermin.js',
      // '/3rdparty/element-ui/index.css',
      // '/3rdparty/element-ui/icon.css',
      // '/3rdparty/element-ui/index.js',
      
      // '/3rdparty/viewerCesiumNavigationMixin.min.js',
    ]

    window['YJSDK3rdpartyResourceAddress'] = prefix + '/3rdparty'

    if (options.ws) {
      sources.push('/3rdparty/reconnecting-websocket.js')
    }

    if (options.flv || options.rtsp) {
      sources.push('/3rdparty/flv.min.js')
    }
    let sourceThree = document.createElement('script')
    sourceThree.setAttribute('type', 'module')
    sourceThree.textContent = `
      import * as THREE from '${prefix}/3rdparty/three/three.module.min.js';
      window.THREE = THREE
    `
    document.querySelector('html').appendChild(sourceThree)
    let sourceSVG = document.createElement('script')
    sourceSVG.setAttribute('type', 'module')
    sourceSVG.textContent = `
      import { SVGLoader } from '${prefix}/3rdparty/three/jsm/loaders/SVGLoader.js';
      window.SVGLoader = SVGLoader
    `
    document.querySelector('html').appendChild(sourceSVG)
    let promise_arr = []
    sources.forEach(uri => {
      let source
      if (uri.endsWith('.js')) {
        source = document.createElement('script')
        source.setAttribute('type', 'text/javascript')
        source.setAttribute('src', prefix + uri)
      } else {
        source = document.createElement('link')
        source.setAttribute('rel', 'stylesheet')
        source.setAttribute('href', prefix + uri)
      }
      document.querySelector('html').appendChild(source)

      let promise = new Promise((res, reject) => {
        source.onload = () => {
          res()
        }
      }).then(result => result)
      promise_arr.push(promise)
    })

    Promise.all(promise_arr)
      .then(data => {
        // let source1
        // source1 = document.createElement('script')
        // source1.setAttribute('type', 'text/javascript')
        // source1.setAttribute('src', prefix + '/3rdparty/modelloader.js')
        // document.querySelector('html').appendChild(source1)
        let source
        source = document.createElement('script')
        source.setAttribute('type', 'text/javascript')
        source.setAttribute(
          'src',
          prefix + '/3rdparty/viewerCesiumNavigationMixin.min.js'
        )
        document.querySelector('html').appendChild(source)
        source.onload = () => {
          setHost(options.host)
          if (options.username) {
            //可以不登录，不登录时无法加载服务端的数据
            login(options).then(r => {
              resolve()
            })
          } else {
            resolve()
          }
        }

        let source2
        source2 = document.createElement('script')
        source2.setAttribute('type', 'text/javascript')
        source2.setAttribute('src', prefix + '/3rdparty/CesiumHeatmap.js')
        document.querySelector('html').appendChild(source2)
      })
      .catch(e => {
        reject(e)
      })
  })
}

let yjTokenKey = '9e549c39c542fc9f835c2a5c260f8cc1'
let hostkey = '40ef4712c26360d01e397ebcb0d031ca'

async function login(options = {}) {
  let rsp = await fetch(
    (options.host || '') + '/yjearth4.0/api/v1/user/sign-in',
    {
      method: 'post',
      body: JSON.stringify({
        username: options.username,
        password: options.password
      }),
      headers: {
        'Content-Type': 'application/json'
      }
    }
  )
  let res = await rsp.text()
  res = JSON.parse(res)
  if (res.code === 0) {
    setHost(options.host)
    if (res.token) {
      setToken(res.token)
    } else {
      setToken(res.data.token)
    }
  }
}

function setHost(host) {
  localStorage.setItem(hostkey, host || '')
}

function getHost() {
  return localStorage.getItem(hostkey) || ''
}

function setToken(token) {
  localStorage.setItem(yjTokenKey, token)
}

function getToken() {
  return localStorage.getItem(yjTokenKey)
}

function getSourceRootPath() {
  let sdkName = 'YJEarth.min.js'
  let scripts = document.querySelectorAll('script')
  let prefix = ''
  scripts.forEach(item => {
    if (item.src.indexOf(sdkName) > -1) {
      let arr = item.src.split('/')
      arr.pop()
      prefix = arr.join('/')
    }
  })
  return prefix
}

export { on, setToken, getToken, getHost }