怎么样使用微信js-sdk上传与下载图片接口？

//选择图片单个图片
wx.chooseImage({
 count: 1, // 默认9
 sizeType: ['original'],
 sourceType: ['album', 'camera'],
 success: function (res) {
  var localId= res.localIds[0];
  $('#localId').text(localId);
  //选择图片成功，上传到微信服务器
  wx.uploadImage({
   localId: localId, // 需要上传的图片的本地ID，由chooseImage接口获得
   isShowProgressTips: 1, // 默认为1，显示进度提示
   success: function (res) {
    var serverId = res.serverId; // 返回图片的服务器端ID
    $('#serverId').text(serverId);
   }
  });
 }
});

var serverId=$('#serverId').text();
wx.downloadImage({
 serverId: serverId, // 需要下载的图片的服务器端ID，由uploadImage接口获得
 isShowProgressTips: 1, // 默认为1，显示进度提示
 success: function (res) {
  var localId = res.localId; // 返回图片下载后的本地ID
  $('#imgTarget').attr('src',localId);
 }
});

<div class="container">
 <!--图片类型验证方法1-->
 <input type="file" id="file" multiple accept="image/*" />
 <input type="button" id="btn1" value="选择上传文件" onclick="showFiles();" />
 <h4>选择文件如下:</h4>
 <img src="" id="img1" />
</div>

//读取图片，并上传到服务器实例
var fileBox = document.getElementById('file');
function showFiles() {
 //获取选择文件的数组
 var fileList = fileBox.files;
 for (var i = 0; i < fileList.length; i++) {
  var file = fileList[i];
  //图片类型验证第二种方式
  if (/image\/\w+/.test(file.type))
   readFile(file);
  else
   console.log(file.name + ':不是图片');
 }
}
//读取图片内容 为DataURL
function readFile(file) {
 var reader = new FileReader();
 reader.readAsDataURL(file);
 reader.onload = function (e) {
  var result = reader.result;
  $('#img1').attr('src', result)
  upload(result);
 }
 //上传到自己的服务器
 function upload(dataUrl){
  var data=dataUrl.split(',')[1];
  //数据结果是转换,转换成二进制数据
  data=window.atob(data);
  var uint=new Uint8Array(data.length)
  for (var i = 0; i < data.length; i++) {
   uint[i]=data.charCodeAt(i);
  }
  var blob=new Blob([uint],{type:'image/jpeg'});
  //上传到服务器
  var fd=new FormData();
  fd.append('file',blob);
  fd.append('isclip', '-1');
  fd.append('maxsize', 1024*1024*10);
  fd.append('minsize', 0);
  fd.append('subfolder', '1');
  fd.append('automove',true);
  fd.append('extention', '.jpg');
  alert('开始上传');
  var xhr = new XMLHttpRequest();
  xhr.open('post', '/common/upload', true);
  //监听事件
  xhr.onreadystatechange = function (e) {
   if (xhr.readyState == 4 && xhr.status == 200) {
    var data = eval('(' + xhr.responseText + ')');
    if (data.success == true) {
     alert('上传成功:');
     alert(data.msg);
    } else {
     alert(data.msg);
    }
   } else {
    //alert(xhr.readyState);
   }
  }
  xhr.send(fd);
 }
}

wx.chooseImage({
 count: 1, // 默认9
 sizeType: ['original'],
 sourceType: ['album', 'camera'],
 success: function (res) {
  var localId= res.localIds[0];
  //获取图片对象
  try {
   var img=new Image();
   //此设置在微信浏览器中无效,也不会抛出异常，后面的代码不会执行
   img.setAttribute('crossOrigin', 'anonymous');
   img.onload=function(){
    var canvas=document.getElementById('canvasOne');
    var ctx=canvas.getContext('2d');
    canvas.width=img.width;
    canvas.height=img.height;
    ctx.clearRect(0,0,canvas.width,canvas.height);
    ctx.drawImage(img,0,0,img.width,img.height);
    try {
     upload(canvas);
    } catch (e) {
     alert(e.name);
     alert(e.message);
    }
   }
   img.src=localId;
  } catch (e) {
   alert(e.name);
   alert(e.message);
  }
 }
});
//上传到自己的服务器
function upload(canvas){
 //由于toDataURL()的浏览器安全问题，如果不是同一个域的图片会抛出异常
 //所以此处
 var data=canvas.toDataURL('image/jpeg');
 data=data.split(',')[1];
 alert(data.length);
}