js 七牛云上传图片

分类：Jquery人气：4701

首先，引入qiniu.js;
定义一个div元素，结构看代码
然后，上传七牛云

完整代码

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>七牛云 -- 代码库演示</title>
    <link rel="stylesheet" href="../css/base.css">
    <link rel="stylesheet" href="../css/main.css">
</head>
<body>    
    <div class="aabb">
        <div id="container" class="containe c-zy-up-item">
            <div id="pickfiles">
                <span><i class="iconfont iconjiahao"></i></span>
            </div>
        </div>
    </div>
    <div class="c-zy-up-img"></div>
    <script src="../js/jquery.js"></script>
    <script src="../js/qn/qiniu.min.js"></script>
    <script>
		var imgurl = dmaku.com
		$.ajax({
			type: "post",
			url: '获取token的接口',
			dataType: "json",
			success: function(data) {
				upToken = data.upToken
				var uploader = Qiniu.uploader({
					runtimes: 'html5,flash,html4',
					browse_button: 'pickfiles',
					uptoken: data.data.UpToken,
					get_new_uptoken: false,
					domain: data.data.LinkUrl,
					container: 'container',
					max_file_size: '100mb',
					flash_swf_url: 'path/of/plupload/Moxie.swf',
					max_retries: 3,
					dragdrop: false,
					chunk_size: '4mb',
					auto_start: true,
					init: {
						'FileUploaded': function(up, file, info) {
							// 成功
							console.log(data.data.LinkUrl + imgurl + '/' + file.name)									
						},
						'Error': function(up, err, errTip) {
							//失败
						},
						'Key': function(up, file) {
							var key = imgurl + '/' + file.name;
							return key;
						}
					}
				});
			}
		});
    </script>
</body>
</html>