新增前端vue

web-vue/packages/core/utils/file/base64Conver.ts

@@ -0,0 +1,41 @@
+/**
+ * @description: base64 to blob
+ */
+export function dataURLtoBlob(base64Buf: string): Blob {
+  const arr = base64Buf.split(',');
+  const typeItem = arr[0];
+  const mime = typeItem.match(/:(.*?);/)![1];
+  const bstr = atob(arr[1]);
+  let n = bstr.length;
+  const u8arr = new Uint8Array(n);
+  while (n--) {
+    u8arr[n] = bstr.charCodeAt(n);
+  }
+  return new Blob([u8arr], { type: mime });
+}
+
+/**
+ * img url to base64
+ * @param url
+ */
+export function urlToBase64(url: string, mineType?: string): Promise<string> {
+  return new Promise((resolve, reject) => {
+    let canvas = document.createElement('CANVAS') as Nullable<HTMLCanvasElement>;
+    const ctx = canvas!.getContext('2d');
+
+    const img = new Image();
+    img.crossOrigin = '';
+    img.onload = function () {
+      if (!canvas || !ctx) {
+        return reject();
+      }
+      canvas.height = img.height;
+      canvas.width = img.width;
+      ctx.drawImage(img, 0, 0);
+      const dataURL = canvas.toDataURL(mineType || 'image/png');
+      canvas = null;
+      resolve(dataURL);
+    };
+    img.src = url;
+  });
+}

web-vue/packages/core/utils/file/download.ts

@@ -0,0 +1,131 @@
+// import { openWindow } from '..';
+import { dataURLtoBlob, urlToBase64 } from './base64Conver';
+import { defHttp } from '@jeesite/core/utils/http/axios';
+
+/**
+ * Download online pictures
+ * @param url
+ * @param filename
+ * @param mime
+ * @param bom
+ */
+export function downloadByOnlineUrl(url: string, filename: string, mime?: string, bom?: BlobPart) {
+  urlToBase64(url).then((base64) => {
+    downloadByBase64(base64, filename, mime, bom);
+  });
+}
+
+/**
+ * Download pictures based on base64
+ * @param buf
+ * @param filename
+ * @param mime
+ * @param bom
+ */
+export function downloadByBase64(buf: string, filename: string, mime?: string, bom?: BlobPart) {
+  const base64Buf = dataURLtoBlob(buf);
+  downloadByData(base64Buf, filename, mime, bom);
+}
+
+/**
+ * Download according to the background interface file stream
+ * @param {*} data
+ * @param {*} filename
+ * @param {*} mime
+ * @param {*} bom
+ */
+export function downloadByData(data: BlobPart, filename: string, mime?: string, bom?: BlobPart) {
+  const blobData = typeof bom !== 'undefined' ? [bom, data] : [data];
+  const blob = new Blob(blobData, { type: mime || 'application/octet-stream' });
+  const nav = window.navigator as any;
+  if (typeof nav.msSaveBlob !== 'undefined') {
+    nav.msSaveBlob(blob, filename);
+  } else {
+    const blobURL = window.URL.createObjectURL(blob);
+    const tempLink = document.createElement('a');
+    tempLink.style.display = 'none';
+    tempLink.href = blobURL;
+    tempLink.setAttribute('download', filename);
+    if (typeof tempLink.download === 'undefined') {
+      tempLink.setAttribute('target', '_blank');
+    }
+    document.body.appendChild(tempLink);
+    tempLink.click();
+    document.body.removeChild(tempLink);
+    window.URL.revokeObjectURL(blobURL);
+  }
+}
+
+/**
+ * Download file according to file address
+ * @param {*} sUrl
+ */
+export async function downloadByUrl({
+  url,
+  params,
+  data,
+  // target = '_self',
+  fileName,
+}: {
+  url: string;
+  params?: any;
+  data?: any;
+  // target?: TargetContext;
+  fileName?: string;
+}): Promise<boolean> {
+  const res = await defHttp.post(
+    { url, params, data, responseType: 'blob' },
+    { isReturnNativeResponse: true, joinPrefix: false },
+  );
+  let name = res.headers['content-disposition'];
+  name = name && name.match(/filename[^;=\n]*=((['"]).*?\2|[^;\n]*)/);
+  name = name && name.length >= 1 && name[1].replace("utf-8'zh_cn'", '');
+  name = (name && decodeURIComponent(name)) || fileName || 'jeesite';
+  downloadByData(res.data, name);
+  // axios({
+  //   url: url,
+  //   method: 'post',
+  //   data: data,
+  //   responseType: 'blob',
+  // })
+  //   .then((response) => {
+  //     let name = response.headers['content-disposition'];
+  //     name = name && name.match(/filename[^;=\n]*=((['"]).*?\2|[^;\n]*)/);
+  //     name = name && name.length >= 1 && name[1].replace("utf-8'zh_cn'", '');
+  //     name = name && (decodeURIComponent(name) || fileName || 'jeesite');
+  //     downloadByData(response.data, name);
+  //   })
+  //   .catch((error) => {
+  //     console.error(error);
+  //   });
+
+  // const isChrome = window.navigator.userAgent.toLowerCase().indexOf('chrome') > -1;
+  // const isSafari = window.navigator.userAgent.toLowerCase().indexOf('safari') > -1;
+
+  // if (/(iP)/g.test(window.navigator.userAgent)) {
+  //   console.error('Your browser does not support download!');
+  //   return false;
+  // }
+  // if (isChrome || isSafari) {
+  //   const link = document.createElement('a');
+  //   link.href = url;
+  //   link.target = target;
+
+  //   if (link.download !== undefined) {
+  //     link.download = fileName || url.substring(url.lastIndexOf('/') + 1, url.length);
+  //   }
+
+  //   if (document.createEvent) {
+  //     const e = document.createEvent('MouseEvents');
+  //     e.initEvent('click', true, true);
+  //     link.dispatchEvent(e);
+  //     return true;
+  //   }
+  // }
+  // if (url.indexOf('?') === -1) {
+  //   url += '?download';
+  // }
+
+  // openWindow(url, { target });
+  return true;
+}