使用JS方法实现对拍摄的图片进行压缩，然后用Ajax传输

可以使用 JavaScript 中的 Canvas API 对拍摄的图片进行压缩，然后使用 Ajax 进行传输。

下面是一个简单的示例代码：

// 获取拍摄的图片文件
const file = document.getElementById('photo').files[0];

// 创建一个 Image 对象
const img = new Image();

// 将文件转换为 DataURL
const reader = new FileReader();
reader.readAsDataURL(file);
reader.onload = function (event) {
  // 加载图片
  img.src = event.target.result;
};

// 等待图片加载完成
img.onload = function () {
  // 创建一个 Canvas 元素
  const canvas = document.createElement('canvas');

  // 设置 Canvas 的宽度和高度
  const MAX_WIDTH = 800;
  const MAX_HEIGHT = 600;
  let width = img.width;
  let height = img.height;
  if (width > height) {
    if (width > MAX_WIDTH) {
      height *= MAX_WIDTH / width;
      width = MAX_WIDTH;
    }
  } else {
    if (height > MAX_HEIGHT) {
      width *= MAX_HEIGHT / height;
      height = MAX_HEIGHT;
    }
  }
  canvas.width = width;
  canvas.height = height;

  // 在 Canvas 上绘制图片
  const ctx = canvas.getContext('2d');
  ctx.drawImage(img, 0, 0, width, height);

  // 将 Canvas 转换为 DataURL
  const dataURL = canvas.toDataURL('image/jpeg', 0.8);

  // 发送 Ajax 请求
  const xhr = new XMLHttpRequest();
  xhr.open('POST', '/upload');
  xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
  xhr.onload = function () {
    // 处理响应
  };
  xhr.send('image=' + encodeURIComponent(dataURL));
};

上面的代码中，我们首先获取拍摄的图片文件，然后将其转换为 DataURL。接着创建一个 Image 对象，加载图片，并等待图片加载完成。在图片加载完成后，我们创建一个 Canvas 元素，并在 Canvas 上绘制压缩后的图片。最后将 Canvas 转换为 DataURL，并使用 Ajax 发送 POST 请求，将数据传输到服务器端。