@smart100/spu-web-plugin 1.0.12 → 1.0.14

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@smart100/spu-web-plugin",
-  "version": "1.0.12",
+  "version": "1.0.14",
   "description": "",
   "scripts": {
     "dev": "npm run build:types && rollup -c -w",

package/src/index.ts

@@ -2,7 +2,7 @@ import { version } from '../package.json'
 import { merge } from 'lodash-es'
 import { v4 as getUuid } from 'uuid'
 import { installStorageProxy, lsProxy, ssProxy } from './storageProxy'
-import { getLocation, getDistance } from './map/index'
+import { getLocation, getDistance, getAddress } from './map/index'
 import { installAxios, spuAxios, axios } from './axios'
 import { installSpuConfig, spuConfig } from './spuConfig'
 import { globalConfig } from './globalConfig'
@@ -101,6 +101,7 @@ export {
   ssProxy,
   getLocation,
   getDistance,
+  getAddress,
   spuAxios,
   axios,
   axios as apaasAxios,

package/src/map/MapService.ts

@@ -101,11 +101,25 @@ class MapService {
 
   private async _init() {
     const type = this.type
+    const key = this.key
+    const secretkey = this.secretkey
     if (type === 'tencent') {
+      if (!key || !secretkey) {
+        console.error('请填写腾讯地图 Web App Key 和 Web Secret Key')
+        return
+      }
       await this.initTecent()
     } else if (type === 'amap') {
+      if (!key || !secretkey) {
+        console.error('请填写高德地图 Web App Key 和 Web Secret Key')
+        return
+      }
       await this.initAmap()
     } else if (type === 'baidu') {
+      if (!key) {
+        console.error('请填写百度地图 Web App Key')
+        return
+      }
       await this.initBaidu()
     }
     this.isInit = true
@@ -127,45 +141,51 @@ class MapService {
   }
 
   private async initAmap() {
-    if (this.secretkey) {
-      window._AMapSecurityConfig = {
-        securityJsCode: this.secretkey
-      }
-    }
-
-    const plugin = ['AMap.Geolocation', 'AMap.Geocoder']
+    return new Promise(async (resolve, reject) => {
+      // 高德地图api初始化失败 没有返回reject 因此用超时机制检测
+      const time = setTimeout(() => {
+        console.error('initAmap fail: 请检查高德地图 Web App Key 和 Web Secret Key 是否正确配置')
+        resolve(null)
+      }, 3000)
 
-    const AMap = await AMapLoader.load({
-      key: this.key,
-      version: '2.0',
-      plugins: plugin,
-      AMapUI: {
-        version: '1.1',
-        plugins: []
+      if (this.secretkey) {
+        window._AMapSecurityConfig = {
+          securityJsCode: this.secretkey
+        }
       }
+
+      const plugin = ['AMap.Geolocation', 'AMap.Geocoder']
+      // debugger
+
+      const AMap = await AMapLoader.load({
+        key: this.key,
+        version: '2.0',
+        plugins: plugin,
+        AMapUI: {
+          version: '1.1',
+          plugins: []
+        }
+      })
+      // debugger
+      clearTimeout(time)
+
+      window.AMap = AMap
+      this.AMap = window.AMap
+      this.MapCore = window.AMap
+      // console.log(window)
+      // console.log(window.AMap)
+      // console.log(window.AMapUI)
+      // console.log(window.AMapLoader)
+      // console.log(window.AMap === aaaa)
+      resolve(window.AMap)
     })
-    window.AMap = AMap
-    this.AMap = AMap
-    this.MapCore = window.AMap
-    // console.log(window)
-    // console.log(window.AMap)
-    // console.log(window.AMapUI)
-    // console.log(window.AMapLoader)
-    // console.log(window.AMap === aaaa)
   }
 
   private async initBaidu() {
-    // await importJS(
-    //     `https://api.map.baidu.com/api?v=1.0&&type=webgl&ak=${this.key}`,
-    //     'BMap'
-    // )
-    // await delay(300)
-    // function initialize() {
-    //     const mp = new BMap.Map('map')
-    //     mp.centerAndZoom(new BMap.Point(121.491, 31.233), 11)
-    // }
     return new Promise((resolve, reject) => {
-      window.BMAP_INITIAL_CALLBACK = () => {
+      window.BMAP_INITIAL_CALLBACK = (e: any) => {
+        // console.log(e)
+        // debugger
         this.BMap = window.BMap
         this.MapCore = window.BMap
         // debugger

package/src/map/index.ts

@@ -3,6 +3,7 @@ import { cloneDeep } from 'lodash-es'
 import { mapService } from './MapService'
 import { getAMapKey } from './AMapKey'
 import { axios } from '../axios'
+import { delay } from '../utils'
 import { wgs84ToGcj02, BMapTransformBD09ToGCJ02Points } from './utils'
 
 type Location = {
@@ -30,9 +31,9 @@ const getLocationByNative = async (): Promise<Location> => {
       }
     }, 30000)
     window.Native.getLocation((res: any, error: any, status: any) => {
-      // console.log('getLocation res', res)
-      // console.log('getLocation error', error)
-      // console.log('getLocation status', status)
+      // console.log('window.Native.getLocation res', res)
+      // console.log('window.Native.getLocation error', error)
+      // console.log('window.Native.getLocation status', status)
       isload = true
       if (res && res?.longitude && res?.latitude) {
         const result = {
@@ -174,15 +175,18 @@ const getAddressByIpaas = async (position: Location): Promise<string> => {
 }
 
 // 高德定位
-const getLocationByAmap = async (): Promise<Location> => {
-  console.log('getLocationByAmap start...')
+const getLocationByAMap = async (): Promise<Location> => {
+  console.log('getLocationByAMap start...')
   return new Promise((resolve, reject) => {
-    const geolocation = new window.AMap.Geolocation({
+    if (!window?.AMap) {
+      console.error('getLocationByAMap fail: AMap is undefinded')
+      resolve(null)
+      return
+    }
+    new window.AMap.Geolocation({
       enableHighAccuracy: true,
       timeout: 15000
-    })
-
-    geolocation.getCurrentPosition((status: string, res: any) => {
+    }).getCurrentPosition((status: string, res: any) => {
       // console.log(status, result)
       // debugger
       if (status === 'complete') {
@@ -191,10 +195,10 @@ const getLocationByAmap = async (): Promise<Location> => {
           longitude: lng.toString(),
           latitude: lat.toString()
         }
-        console.log(`getLocationByAmap success: ${JSON.stringify(result)}`)
+        console.log(`getLocationByAMap success: ${JSON.stringify(result)}`)
         resolve(result)
       } else {
-        console.error('getLocationByAmap fail')
+        console.error('getLocationByAMap fail')
         resolve(null)
       }
     })
@@ -202,14 +206,18 @@ const getLocationByAmap = async (): Promise<Location> => {
 }
 
 // 高德城市定位
-const getCityLocationByAmap = async (): Promise<Location> => {
-  console.log('getCityLocationByAmap start...')
+const getCityLocationByAMap = async (): Promise<Location> => {
+  console.log('getCityLocationByAMap start...')
   return new Promise((resolve, reject) => {
-    const geolocation = new window.AMap.Geolocation({
+    if (!window?.AMap) {
+      console.error('getCityLocationByAMap fail: AMap is undefinded')
+      resolve(null)
+      return
+    }
+    new window.AMap.Geolocation({
       enableHighAccuracy: true,
       timeout: 15000
-    })
-    geolocation.getCityInfo((status: string, res: any) => {
+    }).getCityInfo((status: string, res: any) => {
       // console.log(res)
       // debugger
       if (status === 'complete') {
@@ -219,10 +227,10 @@ const getCityLocationByAmap = async (): Promise<Location> => {
           longitude: lng.toString(),
           latitude: lat.toString()
         }
-        console.log(`getCityLocationByAmap success: ${JSON.stringify(result)}`)
+        console.log(`getCityLocationByAMap success: ${JSON.stringify(result)}`)
         resolve(result)
       } else {
-        console.error('getCityLocationByAmap fail')
+        console.error('getCityLocationByAMap fail')
         resolve(null)
       }
     })
@@ -230,9 +238,14 @@ const getCityLocationByAmap = async (): Promise<Location> => {
 }
 
 // 高德逆地址解析
-const getAddressByAmap = async (position: Location): Promise<string> => {
-  console.log('getAddressByAmap start...')
+const getAddressByAMap = async (position: Location): Promise<string> => {
+  console.log('getAddressByAMap start...')
   return new Promise((resolve, reject) => {
+    if (!window?.AMap) {
+      console.error('getAddressByAMap fail: AMap is undefinded')
+      resolve('')
+      return
+    }
     if (position) {
       new window.AMap.Geocoder({
         city: '',
@@ -243,10 +256,10 @@ const getAddressByAmap = async (position: Location): Promise<string> => {
         // debugger
         if (status === 'complete' && result.info === 'OK' && result?.regeocode?.formattedAddress) {
           const address = result.regeocode.formattedAddress || ''
-          console.log(`getAddressByAmap success: ${address}`)
+          console.log(`getAddressByAMap success: ${address}`)
           resolve(address)
         } else {
-          console.error(`getAddressByAmap fail: status = ${status}, result = ${result}`)
+          console.error(`getAddressByAMap fail: status = ${status}, result = ${result}`)
           resolve('')
         }
       })
@@ -258,10 +271,15 @@ const getAddressByAmap = async (position: Location): Promise<string> => {
 const getIPLocationByTMap = async (ip?: string): Promise<Location> => {
   console.log('getIPLocationByTMap start...')
   return new Promise((resolve, reject) => {
-    const ipLocation = new window.TMap.service.IPLocation()
+    if (!window?.TMap) {
+      console.error('getIPLocationByTMap fail: TMap is undefinded')
+      resolve(null)
+      return
+    }
+
     const params = ip ? { ip } : {}
-    ipLocation
-      .locate(params)
+    new window.TMap.service.IPLocation()
+      .locate({ ...params, servicesk: mapService.secretkey })
       .then((res: any) => {
         const result = {
           longitude: res.result.location.lng.toString(),
@@ -282,15 +300,19 @@ const getIPLocationByTMap = async (ip?: string): Promise<Location> => {
 const getAddressByTMap = async (position: Location): Promise<string> => {
   console.log('getAddressByTMap start...')
   return new Promise((resolve, reject) => {
+    if (!window?.TMap) {
+      console.error('getAddressByTMap fail: TMap is undefinded')
+      resolve('')
+      return
+    }
+
     if (position) {
-      const location = new window.TMap.LatLng(position.latitude, position.longitude)
-      // console.log(position)
-      // console.log(location)
       // debugger
       new window.TMap.service.Geocoder()
         .getAddress({
-          location,
-          getPoi: false
+          location: new window.TMap.LatLng(position.latitude, position.longitude),
+          getPoi: false,
+          servicesk: mapService.secretkey
         })
         .then((res: any) => {
           // console.log(res)
@@ -312,6 +334,11 @@ const getAddressByTMap = async (position: Location): Promise<string> => {
 const getLocationByBMap = async (): Promise<Location> => {
   console.log('getLocationByBMap start...')
   return new Promise((resolve, reject) => {
+    if (!window?.BMap) {
+      console.error('getLocationByBMap fail: BMap is undefinded')
+      resolve(null)
+      return
+    }
     new window.BMap.Geolocation().getCurrentPosition(
       async (res: any) => {
         // console.log(res)
@@ -374,6 +401,11 @@ const getLocationByBMap = async (): Promise<Location> => {
 const getCityLocationByBMap = async (): Promise<Location> => {
   console.log('getCityLocationByBMap start...')
   return new Promise((resolve, reject) => {
+    if (!window?.BMap) {
+      console.error('getCityLocationByBMap fail: BMap is undefinded')
+      resolve(null)
+      return
+    }
     new window.BMap.LocalCity().get(async (res: any) => {
       // console.log(res)
       // debugger
@@ -407,7 +439,12 @@ const getCityLocationByBMap = async (): Promise<Location> => {
 const getAddressByBmap = async (position: Location): Promise<string> => {
   console.log('getAddressByBmap start...')
   return new Promise(async (resolve, reject) => {
-    // resolve('')
+    if (!window?.BMap) {
+      console.error('getAddressByBmap fail: BMap is undefinded')
+      resolve('')
+      return
+    }
+
     if (!position) {
       console.error('getAddressByBmap fail')
       resolve('')
@@ -432,6 +469,7 @@ const getAddressByBmap = async (position: Location): Promise<string> => {
         resolve(address)
       } else {
         console.error('getAddressByBmap fail')
+        // console.error(result)
         resolve('')
       }
     })
@@ -451,15 +489,18 @@ const getLocationPromise = async (isuseiplocarion = false): Promise<Location> =>
   }
   // location = null
 
+  await mapService.init()
+
   if (!location) {
     if (mapService.type === 'amap') {
-      location = await getLocationByAmap()
-      if (!location && isuseiplocarion) {
-        location = await getCityLocationByAmap()
-      }
+      location = await getLocationByAMap()
       if (!location && isuseiplocarion) {
-        location = await getIPLocationByIpaas()
+        location = await getCityLocationByAMap()
       }
+      // 改成不使用ipaas了
+      // if (!location && isuseiplocarion) {
+      //   location = await getIPLocationByIpaas()
+      // }
     } else if (mapService.type === 'tencent' && isuseiplocarion) {
       location = await getIPLocationByTMap()
     } else if (mapService.type === 'baidu') {
@@ -478,6 +519,20 @@ const getLocationPromise = async (isuseiplocarion = false): Promise<Location> =>
     }
   }
 
+  // if (location) {
+  //   for (let i = 0, len = 5000; i < len; i++) {
+  //     // location.latitude = (Number(location.latitude) + 0.02).toString()
+  //     location.longitude = (Number(location.longitude) + 0.002).toString()
+  //     await getAddress(location)
+  //     .then((res: any) => {
+  //       console.log(res)
+  //     }).catch((err: any) => {
+  //       console.error(err)
+  //     })
+  //     await delay(300)
+  //   }
+  // }
+
   if (location && !location.address) {
     location.address = (await getAddress(location)) || '经纬度获取成功，但地址获取失败。'
   }
@@ -489,7 +544,6 @@ const getLocationPromise = async (isuseiplocarion = false): Promise<Location> =>
 // https://www.jianshu.com/p/559029832a67
 // 不能精确定位的情况下是否启用ip城市定位，ip定位用于不需要精确定位的场景
 async function getLocation(isuseiplocarion = false) {
-  await mapService.init()
   // debugger
   // 缓存30秒
   if (datetime && Date.now() - datetime <= cachetime && lastLocation && !runing) {
@@ -519,12 +573,11 @@ const getAddress = async (position: Location): Promise<string> => {
 
   if (!address) {
     if (mapService.type === 'amap') {
-      address = await getAddressByAmap(position)
-
-      if (!address) {
-        // 如果不设置安全秘钥的话 js-api的逆地址查询不成功 返回 INVALID_USER_SCODE 改成用ipaas服务查询
-        address = await getAddressByIpaas(position)
-      }
+      address = await getAddressByAMap(position)
+      // if (!address) {
+      //   // 如果不设置安全秘钥的话 js-api的逆地址查询不成功 返回 INVALID_USER_SCODE 改成用ipaas服务查询
+      //   address = await getAddressByIpaas(position)
+      // }
     } else if (mapService.type === 'tencent') {
       address = await getAddressByTMap(position)
     } else if (mapService.type === 'baidu') {

package/src/tenantSetting.ts

@@ -60,15 +60,39 @@ class TenantSetting {
     //   }
     // }
 
+    // 高德地图key配置错误
+    // 1 如果是key格式不对 那么没返回promise 连window.AMap都拿不到 地图和都不能用
+    // 1 如果是key对式对 但key不对 有返回 window.AMap 但api定位调用失败 地图可以渲染空白地图
+
+    // // 高德地图公司key
     // tenantsetting.lbssetting.setting.type = 'amap'
     // tenantsetting.lbssetting.setting.key.web = '1993ac213d2f4675ac1bffb1b03ef1f0'
     // tenantsetting.lbssetting.setting.secretkey.web = '816fe46b7b7bce145940b93c1e4818fa'
 
-    // // tenantsetting.lbssetting.setting.type = 'tencent'
-    // // tenantsetting.lbssetting.setting.key.web = 'NHBBZ-K5LCQ-LF35M-2CTDP-E4OO7-AIBFT'
+    // // 高德地图个人key
+    // tenantsetting.lbssetting.setting.type = 'amap'
+    // tenantsetting.lbssetting.setting.key.web = 'e4d25fe4661a34198c4e6f79abe9afac'
+    // tenantsetting.lbssetting.setting.secretkey.web = 'a6b674affd9a3278c68602cf7ba02fcb'
+
+    // tencent地图key配置错误
+    // 1 如果是地图 会在地图上明确文字提示 鉴权失败，请传入正确的key
+    // 2 如果是调用定位等api 会返回 catch 和详细的错误信息
+    // getIPLocationByTMap fail: {"status":311,"message":"key格式错误","request_id":"ccedb04fd95e4f3f9cd45cfbad729d10","id":"cbm919vjdj0"}
+    // getIPLocationByTMap fail: {"status":190,"message":"无效的key","request_id":"b6ca9d0749eb4c91a47db9412b1253ca","id":"cbm919wxo40"}
+    // tenantsetting.lbssetting.setting.type = 'tencent'
+    // tenantsetting.lbssetting.setting.key.web = 'NHBBZ-K5LCQ-LF35M-2CTDP-E4OO7-AIBFT'
+    // tenantsetting.lbssetting.setting.secretkey.web = 'zowvV5I2pSxqgGb2Sgr1x62HGXbqdxT0'
+
+    // 百度地图key配置错误alert以下信息
+    // 您提供的密钥不是有效的百度LBS开放平台密钥，或此密钥未对本应用的百度地图JavaScriptAPI授权。您可以访问如下网址了解如何获取有效的密钥：http://lbsyun.baidu.com/apiconsole/key#。
+    // tenantsetting.lbssetting.setting.type = 'baidu'
+    // tenantsetting.lbssetting.setting.key.web = '7r3bsPeQqJ74vsxf3EOXg7C1AM4lOWA1'
+
+
 
-    // // tenantsetting.lbssetting.setting.type = 'baidu'
-    // // tenantsetting.lbssetting.setting.key.web = '7r3bsPeQqJ74vsxf3EOXg7C1AM4lOWA1'
+    // tenantsetting.lbssetting.setting.type = 'tencent'
+    // tenantsetting.lbssetting.setting.key.web = 'NHBBZ-K5LCQ-LF35M-2CTDP-E4OO7-AIBFT是的是的'
+    // tenantsetting.lbssetting.setting.secretkey.web = 'zowvV5I2pSxqgGb2Sgr1x62HGXbqdxT0对对对'
 
     // lsProxy.setItem('tenantsetting', JSON.stringify(tenantsetting))
 

package/src/types/index.d.ts

@@ -99,6 +99,11 @@ export const getLocation: () => Promise<{
   [propName: string]: any
 } | null>
 export const getDistance: (p1: [number, number], p2: [number, number]) => Promise<any>
+export const getAddress: (location: {
+  longitude: string
+  latitude: string
+  [propName: string]: any
+}) => Promise<string>
 export const spuAxios: any
 export const apaasAxios: any
 export const axios: any