图片上传

input file上传文件

File类型数据

image.png

url

File转url

  1. const readImageURL = (file: File) => {
  2.     return new Promise((resolve) => {
  3.         if (URL) {
  4.             resolve(URL.createObjectURL(file));
  5.         } else if (FileReader) {
  6.             const reader = new FileReader();
  7.             reader.onload = function () {
  8.                 resolve(reader.result);
  9.             };
  10.             reader.readAsDataURL(file);
  11.         }
  12.     });
  13. };

‘blob:http://localhost:9000/161b1b55-45ed-4e92-ac7c-60e5436c61ff’

blob

url转blob
image.png

blob 通过oss api可上传

  1.     Axios({
  2.         url: src,
  3.         responseType: "blob",
  4.     }).then((res) => {
  5.         callback(res.data);
  6.     });

oss api
支持Buffer.from 和 blob上传

  1. await client.put(
  2.     objectName,
  3.     // Buffer.from(JSON.stringify(fileContent))
  4.     fileContent
  5. );

json上传

File

file读成object内存

  1. const reader = new FileReader()
  2. reader.readAsText(file)
  3. reader.onload = (e) => {
  4.     let fileContent = null
  5.     try{
  6.         fileContent = JSON.parse(e.target.result)
  7.         callback(fileContent)
  8.     } catch(err) {
  9.         enqueueSnackbar('JSON parsed failed, please check your file\'s syntax!', {
  10.             variant: 'error'
  11.         })
  12.         return
  13.     }
  14. }

Object

  1. Buffer.from(JSON.stringify(fileContent))

Buffer

  1.  await client.put(objectName, Buffer.from(JSON.stringify(fileContent)))

图片下载

  1.  const downloadFile = (data: BlobPart[], fileTitle: string) => {
  2.     const blob = new Blob(data);
  3.     FileSaver.saveAs(blob, fileTitle);
  4. };