django之集成七牛云对象存储

# 获取七牛云授权 token
def qiniu_token(request):
    # 七牛云授权秘钥（在七牛云中可以得到）
    access_key = settings.UEDITOR_QINIU_ACCESS_KEY
    secret_key = settings.UEDITOR_QINIU_SECRET_KEY
    # 存储对象名称（在七牛云中可以得到）
    bucket_name = settings.UEDITOR_QINIU_BUCKET_NAME
    # 获得七牛云授权对象 q
    q = Auth(access_key,secret_key)
    # 获得一个授权的token
    token = q.upload_token(bucket_name)
    # 将七牛云的授权 token 返回给前端
    # return restful.result(data={‘token‘:token})# 这个是我在项目中集成的通用返回方法
    return JsonResponse({"data":{"token":"token"}})

<!--前端代码-->
<!-- 将 file 按钮放在 label 标签中，并将 file 按钮隐藏，达到想要的效果，因为 file 类型按钮样式是固定的将他放在label中，点击label标签就相当于点击了 file 文件上传按钮-->
<label class="btn btn-file btn-default"><input type="file" hidden id="upload_news_file">上传图片</label>

"""
后端代码
"""
function News(){}

// 上传文件至七牛云中监控上传 进度 处理方式，来自：observable.subscribe()对象
News.prototype.listenQiniuNext = function (response) {
    /*
    * observable 中 subscribe 属性：Next(res)
    * res 参数是一个带有 total 字段的 object，包含loaded、total、percent三个属性：
    *   loaded：已上传文件大小，单位：L字节
    *   total：本次上传的总量控制信息，单位字节，跟文件大小并不一致
    *   percent：当前上传文件的进度，范围：0 - 100
    *
    * **** 要先得到字段 total ：result.total ****
    * */

    var total = response.total;
    // toFixed(index):保留index为小数
    var percent = total.percent.toFixed(0) + "%";
　　console.log("文件上传进度：" + percent

);
};
// 上传文件至七牛云中监控上传 出错 处理方式，来自：observable.subscribe()对象
News.prototype.listenQiniuError = function (error) {
    /*
    * objservable 中 subscribe 的属性：error(err)
    * 参数 err 为一个包含 code、message、isRequestError 三个属性的 object 对象：
    *   code：错误码
    *   message：错误信息，包含错误吗
    *   reqld：xhr请求错误的 X-Reqid
    * */
    console.log("文件上传出现错误，错误信息：" + error.message);
};

// 上传文件至七牛云中监控上传 完成 处理方式，来自：observable.subscribe()对象
News.prototype.listenQiniuComplete = function (response) {
    /* 接收上传完成后的后端返回信息，res 参数为一个 object，
     * 为上传成功后后端返回的信息，具体返回结构取决于后端sdk的配置，
     * 可参考上传策略。
     * */
    // {hash: "FuAB5QBnVM_CWrw7WGc7jm7LAdyO", key: "1534507254079png"} 默认返回hash与key两个参数
    console.log(response);
};

// 将文件上传到七牛云服务器
News.prototype.listenUpload_news_file_qiniu_Event = function () {
    var self = this;
    var uploadBtn = $(‘#upload_news_file‘);
    // 定义一个变量保存文件上传的状态
    var uploading = false;

    // change事件：在选择文件后出发
    uploadBtn.change(function () {
        var file = this.files[0];
        // get请求，可以使用ajax get 请求
        $.get({
　　　　　　　// 这里是服务端处理的视图函数地址
            ‘url‘: ‘/cms/qiniu_token/‘,
            ‘success‘: function (result) {
                if (result[‘code‘] === 200) {
                    // 得到服务端返回的 token 验证信息
                    var token = result[‘data‘][‘token‘];
                    var houzhui = file.name.split(‘.‘);
                    // 使用当前时间戳作为文件的key
                    var key = new Date().getTime() + "." + houzhui[houzhui.length - 1];

                    var config = {
                        // 是否使用cdn加速
                        useCdnDomain: true,
                        // 服务器地址：华东，华南......
                        region: qiniu.region.z0,
                        // 如果产生错误，重新上传次数
                        retryCount: 6
                    };

                    var putExtra = {
                        // 上传文件的名称
                        fnName: key,
                        // 文件上传时使用的一些参数
                        params: {},
                        // 限制文件上传的类型
                        mimeType: ["image/png", "image/jepg", "image/gif"]
                    };

                    var observable = qiniu.upload(file, key, token, putExtra, config);
                    /* subscribe对象有三个属性：next，error，complete
                    * */
                    observable.subscribe({
                        /** 如果使用 self.listenQiniuNext() 会报错
                         ** 必须使用 self.listenQiniuNext，因为作为一个参数传递
                         ** 绑定方法后，会改变方法的所属对象，比如绑定后方法不再属于 News，所以无法使用 News 中定义的属性
                         * **/

                        // 文件上传进度监控
                        ‘next‘: self.listenQiniuNext,
                        // 文件上传产生错误时触发
                        ‘error‘: self.listenQiniuError,
                        // 当文件上传完成时触发
                        ‘complete‘: self.listenQiniuComplete
                    });
                }
            }
        });
    });
};

News.prototype.run = function () {
    // 将文件上传到千牛服务器
    this.listenUpload_news_file_qiniu_Event();
};

$(function () {
    var news = new News();
    news.run();
});

# 参数：
# upfile: 文件（前端传过来的文件）
# filename: 文件名
　　def _upload_to_qiniu(self, upfile, filename):
        """
        上传文件到七牛
        """
        if not sys.modules.get(‘qiniu‘):
            raise RuntimeError(‘没有导入qiniu模块！‘)
　　　　　# 配置自己的 access_key，secret_key
        q = qiniu.Auth(<UEDITOR_QINIU_ACCESS_KEY>, <UEDITOR_QINIU_SECRET_KEY>)
　　　　 # 配置自己的： 空间名称
        token = q.upload_token(<UEDITOR_QINIU_BUCKET_NAME>)
        buffer = BytesIO()
        for chunk in upfile.chunks():
            buffer.write(chunk)
        buffer.seek(0)
        ret, info = qiniu.put_data(token, filename, buffer.read())
        if info.ok:
　　　　　　　# 配置自己的域名：DOMAIN:http://七牛云的域名/
            url = parse.urljoin(UEDITOR_QINIU_DOMAIN, ret[‘key‘])
            return ‘SUCCESS‘, url, ret[‘key‘], ret[‘key‘]
        else:
            return ‘FAIL‘, None, None, None