image.ts 1.4 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152
  1. export function urlToBase64(url: string, mineType?: string): Promise<string> {
  2. return new Promise((resolve, reject) => {
  3. let canvas = document.createElement('CANVAS') as Nullable<HTMLCanvasElement>
  4. const ctx = canvas!.getContext('2d')
  5. const img = new Image()
  6. img.crossOrigin = ''
  7. img.onload = function () {
  8. if (!canvas || !ctx) {
  9. return reject()
  10. }
  11. canvas.height = img.height
  12. canvas.width = img.width
  13. ctx.drawImage(img, 0, 0)
  14. const dataURL = canvas.toDataURL(mineType || 'image/png')
  15. canvas = null
  16. resolve(dataURL)
  17. }
  18. img.src = url
  19. })
  20. }
  21. /**
  22. * 将文件对象转换为base64格式
  23. * @param file 文件对象,通常来自input[type="file"]的选择
  24. * @returns Promise<string> 返回base64格式的字符串
  25. */
  26. export function fileToBase64(file: File): Promise<string> {
  27. return new Promise((resolve, reject) => {
  28. if (!file) {
  29. reject(new Error('文件不能为空'))
  30. return
  31. }
  32. // 验证是否为图片文件
  33. if (!file.type.startsWith('image/')) {
  34. reject(new Error('请上传图片文件'))
  35. return
  36. }
  37. const reader = new FileReader()
  38. reader.readAsDataURL(file)
  39. reader.onload = () => {
  40. resolve(reader.result as string)
  41. }
  42. reader.onerror = (error) => {
  43. reject(error)
  44. }
  45. })
  46. }