js获取是什么浏览器

const { userAgent } = window.navigator


/**
 * 是否在微信内
 * @property isInWeChat
 * @type {Boolean}
 */
export const isInWeChat = /\bMicroMessenger\b/.test(userAgent)

/**
 * 是否在QQ或iPad QQ内
 * @property isInQQ
 * @type {Boolean}
 */
export const isInQQ = /\b(IPad)?QQ\b/.test(userAgent)

/**
 * 是否在QQ浏览器内
 * @property isInQQBrowser
 * @type {Boolean}
 */
export const isInQQBrowser = /\bMQQBrowser\b/.test(userAgent)

/**
 * 是否在微博内
 * @property isInWeibo
 * @type {Boolean}
 */
export const isInWeibo = /\bWeibo\b/.test(userAgent)

/**
 * 是否在非浏览器的APP内（目前只能判断一部分APP）
 * @property isInApp
 * @type {Boolean}
 */
export const isInApp = isInWeChat || isInQQ || isInWeibo


/**
 * 是否在iOS设备下
 * @property isIOS
 * @type {Boolean}
 */
export const isIOS = /\b(?:iPad|iPod|iPhone)\b/.test(userAgent)
  && /\bOS(?:\s([\d_.]+))?\slike\sMac\sOS\sX\b/.test(userAgent)


/**
 * 是否在Android设备下
 * @property isAndroid
 * @type {Boolean}
 */
export const isAndroid = /\b(?:Android|Adr|YunOS)\b/.test(userAgent)


/**
 * 是否移动端
 * @type {Boolean}
 */
export const isMobile = isAndroid || isIOS


/**
 * 获取运行环境, local、test、pre或prod
 * @returns {string} 运行环境标识
 */
function getRuntimeEnv() {
  const envObj = {
    dev: 'learning-d.tanzhouedu.com',
    test: 'learning-t.tanzhouedu.com',
    pre: 'learning-p.tanzhouedu.com',
    prod: 'learning.tanzhouedu.com',
  }
  for (let key in envObj) {
    if (location.href.indexOf(envObj[key]) !== -1) {
      return key
    }
  }
  return 'local'
}


/**
 * 运行环境, local、test、pre或prod
 * @property runtimeEnv
 * @type {string}
 */
export const runtimeEnv = getRuntimeEnv()

// 判断当前浏览类型
function getBrowserType() {
  if (window.ActiveXObject || 'ActiveXObject' in window) { // IE
    const reIE = new RegExp('MSIE (\\d+\\.\\d+)')
    reIE.test(userAgent)
    const fIEVersion = parseFloat(RegExp.$1)
    return `IE${fIEVersion || '低版本'}`
  } else if (userAgent.indexOf('Firefox') !== -1) {
    return 'Firefox(火狐)'
  } else if (userAgent.indexOf('Opera') !== -1) {
    return 'Opera'
  } else if (userAgent.indexOf('Edge') !== -1) {
    return 'Edge'
  } else if (userAgent.indexOf('QQ') !== -1 && userAgent.indexOf('QQBrowser') === 1) {
    return '手机QQ'
  } else if (userAgent.indexOf('QQBrowser') !== -1) {
    return 'QQ浏览器'
  } else if (userAgent.indexOf('Safari') !== -1 && userAgent.indexOf('MetaSr') !== -1) {
    return '搜狗浏览器'
  } else if (userAgent.indexOf('MicroMessenger') !== -1) {
    return '微信浏览器'
  } else if (userAgent.indexOf('LBBROWSER') !== -1) {
    return '猎豹浏览器'
  } else if (userAgent.indexOf('Maxthon') !== -1) {
    return '遨游浏览器'
  } else if (userAgent.indexOf('TheWorld') !== -1) {
    return '世界之窗浏览器'
  } else if (userAgent.indexOf('bWeibo') !== -1) {
    return '微博'
  } else if (userAgent.indexOf('ubrowser') !== -1) {
    return 'UC'
  } else if (userAgent.indexOf('bidubrowser') !== -1) {
    return '百度'
  } else if (userAgent.indexOf('Safari') !== -1 && userAgent.indexOf('Chrome') === -1) {
    return 'Safari'
  } else if (userAgent.indexOf('Chrome') !== -1) {
    return 'Chrome'
  }
}

export const browserType = getBrowserType()

js 复制点击按钮复制图片

//  @click="copyImg"
<img
      v-if="imageList[0]"
      ref="draftImageCopy"
      :src="imageList[0]"
      alt="票面截图"
      class="copy-img"
      crossorigin="Anonymous"
    >

/**
 * 获取img标签图片的base64数据
 * @param {object} img img标签
 * @returns {string} base64数据
 */
export function getBase64Image(img) {
  const canvas = document.createElement("canvas");
  canvas.width = img.width;
  canvas.height = img.height;
  const ctx = canvas.getContext("2d");
  ctx.drawImage(img, 0, 0, img.width, img.height);
  return canvas.toDataURL("image/png");
}

/**
 * 将base64数据转化为file对象
 * @param {string} base64Str base64数据
 * @param {string} fileName 文件名
 * @returns {File} 文件对象
 */
export function base64ToFile(base64Str, fileName) {
  const params = base64Str.split(",");
  const mime = params[0].match(/:(.*?)/)[1];
  const fileData = atob(params[1]); // 解码Base64
  let { length } = fileData;
  const uint8Array = new Uint8Array(length);
  while (length) {
    length -= 1;
    uint8Array[length] = fileData.charCodeAt(length);
  }
  return new File([uint8Array], fileName, { type: mime });
}

// 复制图片
    async copyImg() {
      try {
        const draftImage = this.$refs?.draftImageCopy
        if (!draftImage) return
        const isIe = browserType.indexOf('IE') !== -1
        const img = await getBase64Image(draftImage)
        if (!isIe) {
        // 除IE外的浏览器的复制方法
          if (navigator.clipboard) {
            const file = await base64ToFile(img)
            const blob = new Blob([file], { type: 'image/png' })
            await navigator.clipboard.write([
            // eslint-disable-next-line no-undef
              new ClipboardItem({
                [blob.type]: blob
              })
            ]).then(() => {
              this.$message.success('复制成功！')
            })
          } else if (window.require) {
            const { clipboard, nativeImage } = window.require('electron')
            const image = nativeImage.createFromDataURL(img) // res为base64图片数据
            clipboard.writeImage(image)
            this.$message.success('复制成功')
          } else {
            this.$message.warning('浏览器不支持复制票据，可在票据图片上点击右键复制')
          }
        } else {
          this.$message.warning('浏览器不支持复制票据，可在票据图片上点击右键复制')
        }
      } catch (err) {
        this.$message.warning('浏览器不支持复制票据，可在票据图片上点击右键复制')
      }
    },