阿里云oss图片添加水印

申请oss并添加bucket这里就不说了官网有文档，网上也很详细，这里记录下oss添加图片水印并记录下几个问题

1.在bucket中创建规则

登陆oss管理台左侧

选择图片处理

 

点击新建样式，自己选定样式并保存就会生成一个自定义的水印模板

 

 

然后前端中我是这样写的

getFilePath1() {
    let _this = this;
    //获取文件信息
    const files = document.getElementById("file1")
    const fileLen = document.getElementById("file1").files
    const file = document.getElementById("file1").files[0]
    let name = fileLen[0].name
    let watermark='!test_watermark';
    let consat=this.calculate_object_name(name);
    _this.openFullScreen('上传中...');
    for (let i = 0; i < fileLen.length; i++) {
      const file = fileLen[i]
      client().multipartUpload('image/' + consat+watermark, file).then(function (res) {
        var str = res.res.requestUrls[0]
        console.log('str is ' + str);
        _this.form.authUrl = 'https://自由域名/image' + consat+'%21test_watermark?x-oss-process=style/test_watermark';
　　 _this.closeFullScreen(); 
}).catch((err) => { 
console.log(err) 
})
 }
 },

其中file是你上传的文件，这里获取到他的名字并进行calculate_object加密处理 

上传的样式多种多样，重要的是.multipartUpload方法，这里的意思是上传到bucket下的image目录中，并且使用test_watermark水印样式

这里返回的url也是拼接的使用的是自有域名加文件名称加上阿里云约定的格式，其中我设定的水印格式分隔符为！

 

 转utf-8后就是%21这样上传的文件就是有水印版本的了