JS结合七牛实现上传头像的效果

1    拿7牛的token

  通过后台的接口拿到7牛的token;

2 7牛的域名， 后面要和7牛返回的路径 结合。

var addr = 'http://opf2ucy0n.bkt.clouddn.com/'

3 创建file 和 formData

var file = event.target.files[0];

var formData = new FormData();               formData.append('file', file);

formData.append('token', qiniutoke);    //qiniutoke是1步骤里面后台拿到的token

4 掉7牛接口

$.ajax({                     url: 'http://up-z1.qiniu.com/',                     type: 'POST',                     dataType: 'json',                     cache: false,                     data: formData,                     processData: false,                     contentType: false                 }).done((res) => {                     imageUrl= addr+res.key console.log(’上传成功‘);                 }).fail(function(err) {                     console.log(err);                 });   

//   url为7牛的路径, imageUrl为2步骤的路径加7牛返回来的路径结合。

5 最后页面输出imageUrl即可。