阿里云文件上传封装

阿里云文件上传封装

// oss上传
import OSS from 'ali-oss'
import md5 from 'js-md5'
import {Toast} from 'vant';

const clientOss = new OSS({
    region: 'oss-cn-beijing',
    endpoint: 'https://xxxx.xxxxxxxxxxxxxx.com', // 地址
    cname: true,
    // 云账号AccessKey有所有API访问权限，建议遵循阿里云安全最佳实践，部署在服务端使用RAM子账号或STS，部署在客户端使用STS。
    accessKeyId: 'xxxxxxxxxxxx',  // ID
    accessKeySecret: 'xxxxxxxxxxxxx',
    bucket: 'xxxxxxxxxxxxxx',
    secure:true
})

// oss上传图片与视频
export function upload(params, data, callback) {
    // 文件类型


    const file_type = params.file.type.split('/')[0]
    // 文件格式
    const file_format = params.file.type.split('/')[1]
    // 图片格式
    const acceptImage = ['jpg', 'jpeg', 'png', 'gif']
    // 视频格式
    const acceptVideo = ['mp4']
    // 音频格式
    const acceptAudio = ['mp3']


    // 1、判断文件类型是否正确
    if (data.type !== file_type) {
        Toast('请上传正确的文件类型！')
        callback({ status: 'error' })
        return false
    }

    // 2、判断文件格式
    if (file_type === 'image') {
        const isAccept = acceptImage.includes(file_format.toLowerCase(), 0)
        if (!isAccept) {
            Toast('文件格式只支持PNG，JPG，GIF，请重新上传！')
            callback({ status: 'error' })
            return false
        }
    } else if (file_type === 'video') {
        const isAccept = acceptVideo.includes(file_format.toLowerCase(), 0)
    } else if (file_type === 'audio') {
        const isAccept = acceptAudio.includes(file_format.toLowerCase(), 0)
        if (!isAccept) {
            Toast('文件格式只支持MP3，请重新上传！')
            callback({ status: 'error' })
            return false
        }
    }

    // 3、判断文件大小是否超出限制
    if (file_type === 'image') {

        const file_size = params.file.size / (1 * 1024 * 1024).toFixed(1)

        if (file_size >= 5) {

            Toast('文件大小超出5M，请重新上传！')
            callback({ status: 'error' })
            return false
        } else {
            // 4、上传文件
            // 文件存储名称，key
            const file_name = md5(params.file.name.split('.')[0] + new Date().getTime()) + '.' + file_format
            // 第一个参数表示上传到OSS的Object名称，第二个参数表示本地文件或者文件路径
            clientOss.put('images/' + file_name, params.file).then(res => {
                callback(res.url)
            }).catch((err) => {
                console.log('error:', err)
                return false
            })
        }
    } else if (file_type === 'video') {
        const url = URL.createObjectURL(params.file)
        const audioElement = new Audio(url)
        audioElement.addEventListener('loadedmetadata', () => {
            const file_time = Math.floor(audioElement.duration)
            if (file_time > data.len) {
                Toast('视频时长不可超过' + data.len + '秒，请重新上传！')
                callback({ status: 'error' })
                return false
            } else {
                // 4、上传文件
                // 文件存储名称，key
                const file_name = md5(params.file.name.split('.')[0] + new Date().getTime()) + new Date().getTime() + '.' + file_format
                // 第一个参数表示上传到OSS的Object名称，第二个参数表示本地文件或者文件路径
                clientOss.put('images/' + file_name, params.file).then(res => {
                    callback(res.url)
                }).catch((err) => {
                    console.log('error:', err)
                    return false
                })
            }
        })
    } else if (file_type === 'audio') {

        const url = URL.createObjectURL(params.file)
        const audioElement = new Audio(url)
        audioElement.addEventListener('loadedmetadata', () => {
            const file_time = Math.floor(audioElement.duration)
            if (file_time > data.len) {
                Toast('音频时长不可超过' + data.len + '秒，请重新上传！')
                callback({ status: 'error' })
                return false
            } else {
                // 4、上传文件
                // 文件存储名称，key
                var name = "";
                if (params.file.name) {
                    name = params.file.name
                } else {
                    var date=new Date()
                    name =date.getFullYear()+"_"+ new Date().getTime()
                }
                const file_name = md5(name.split('.')[0] + new Date().getTime()) + new Date().getTime() + '.' + file_format
                // 第一个参数表示上传到OSS的Object名称，第二个参数表示本地文件或者文件路径
                clientOss.put('images/' + file_name, params.file).then(res => {
                    const param = {url: res.url, seconds: file_time}
                    callback(param)
                }).catch((err) => {
                    console.log('error:', err)
                    return false
                })
            }
        })
    }
}

export function imgOverSize(params, data, callback) {
    const file_size = params.file.size / (1 * 1024 * 1024).toFixed(1)

    if (file_size >= 5) {

        Toast('文件大小超出5M，请重新上传！')

        return true
    }else{
        return false;
    }
}