tencent cloud

1. Install dependencies in the project.
npm install --save js-base64

2. Import the `encode` method into the code.
import { encode } from 'js-base64';

// Text watermark content
var text = 'Tencent Cloud CI';
// Valid text watermark
var safeBase64 = encode(text).replaceAll('+', '-').replaceAll('/', '_').replaceAll('=', '');
// The following `Pic-Operations` can be used:
'Pic-Operations': `{"is_pic_info": 1, "rules": [{"fileid": "waterMask.jpg", "rule": "watermark/2/text/${safeBase64}"}]}`

<!-- DOM element in the HTLM file -->

<!-- Choose an image to upload -->
<input id="fileSelector" type="file" />
<!-- Click the button to upload the image -->
<input id="submitBtn" type="submit" />

function handleFileInUploading(file) {
  cos.putObject(
    {
      Bucket: 'examplebucket-1250000000',
      Region: 'COS_REGION',
      Key: file.name,
      Body: file,
      Headers: {
        // Use the imageMogr2 API to scale the image (specifying the width of the output image to 200, with the height scaled automatically).
        'Pic-Operations':
          '{"is_pic_info": 1, "rules": [{"fileid": "desample_photo.jpg", "rule": "imageMogr2/thumbnail/200x/"}]}',
      },
    },
    function (err, data) {
      console.log(err || data);
    },
  );
}

document.getElementById('submitBtn').onclick = function (e) {
  var file = document.getElementById('fileSelector').files[0];
  if (!file) {
    document.getElementById('msg').innerText = 'File to upload not selected';
    return;
  }
  handleFileInUploading(file);
};