图片上传到腾讯云

https://www.jianshu.com/p/bb4c12a16cf8

<template>
    <div>
        <p class='fileT'>选择文件 <input accept="" type='file' ref="file" id='upload' @change="getFile"/></p>
        <button class='sure' @click="upLoad()">上传</button>
        <div class="imgBox" style="width: 200px;height: 160px">
            <img :src="url1">
        </div>
        {{url1}}
    </div>
</template>

<script>
    import COS from 'cos-js-sdk-v5'

    export default {
        name: "upload",
        data() {
            return {
                uploadFile: '',
                uploadFileName: '',
                url: '',
                url1: ''
            }
        },
        mounted() {

        },
        methods: {
            getFile() {
                this.uploadFile = document.getElementById('upload').files[0];
                this.uploadFileName = this.uploadFile.name;
            },
            upLoad() {
                var that = this;
                var cos = new COS({
                    SecretId: 'AKIDa3W0Ni5gxFMOF28dosrgQ7gBVV3EDzlN',
                    SecretKey: 'jBZN8ZlDZJdu41siVdaAkFxBbllcJqHe'
                });
                cos.putObject({
                    Bucket: 'fzy-1259269113',
                    Region: 'ap-beijing',
                    Key: that.uploadFileName,
                    StorageClass: 'STANDARD',
                    Body: that.uploadFile, // 上传文件对象
                    onProgress: function (progressData) {
                        console.log(JSON.stringify(progressData));
                    }
                }, function (err, data) {
                    console.log(err || data);
                });

                var url = cos.getObjectUrl({
                    Bucket: 'fzy-1259269113', // Bucket 格式：test-1250000000
                    Region: 'ap-beijing',
                    Key: that.uploadFileName,
                    Expires: 60,
                    Sign: true,
                }, function (err, data) {
                    console.log(err || data);
                });
                that.url1 = url;
            }
        }
    }
</script>

<style scoped>
    .imgBox img {
        width: 100%;
        height: 100%;
    }
</style>