如何将上传的图片设置为画布背景？

<input type="file" id="uploadInput">
<canvas id="canvas"></canvas>

// 获取上传图片的文件对象
const uploadInput = document.getElementById('uploadInput');
uploadInput.addEventListener('change', function() {
  const file = uploadInput.files[0];
  
  // 读取图片文件为数据URL
  const reader = new FileReader();
  reader.onload = function(e) {
    const dataURL = e.target.result;
    
    // 创建画布并绘制图片
    const canvas = document.getElementById('canvas');
    const ctx = canvas.getContext('2d');
    const img = new Image();
    img.onload = function() {
      canvas.width = img.width;
      canvas.height = img.height;
      ctx.drawImage(img, 0, 0);
      
      // 将画布作为背景应用到页面
      document.body.style.backgroundImage = `url(${canvas.toDataURL()})`;
    };
    img.src = dataURL;
  };
  reader.readAsDataURL(file);
});