base64存储图片

在数据库中，将图片路径修改为longtext类型

以下为vue代码

 
                  
                  
                    
                  
                


// Base64 图片数据
const imageBase64 = ref('')
// 图片上传前的校验
const beforeAvatarUpload: UploadProps['beforeUpload'] = (rawFile) => {
  if (rawFile.type !== 'image/jpeg' && rawFile.type !== 'image/png') {
    ElMessage.error('封面图片必须是 JPG 或 PNG 格式!')
    return false
  } else if (rawFile.size / 1024 / 1024 > 2) {
    ElMessage.error('封面图片大小不能超过 2MB!')
    return false
  }
  return true
}
// 处理图片选择
const handleAvatarChange = (file: UploadFile) => {
  if (file.raw) {
    const reader = new FileReader()
    reader.onload = (e) => {
      if (e.target?.result) {
        imageBase64.value = e.target.result as string // 将图片转换为 Base64
      }
    }
    reader.readAsDataURL(file.raw) // 读取文件为 Base64
  }
}