3、上传头像到七牛云并显示

  • Post author:
  • Post category:其他


在设置中,更换头像,上传到七牛云,并显示新头像。

controller:

@LoginRequired
    @GetMapping("/setting")
    public String getSettingPage(Model model) {
        // 上传文件名称
        String fileName = CommunityUtil.generateUUID();
        // 设置响应信息
        StringMap policy = new StringMap();
        policy.put("returnBody", CommunityUtil.getJSONString(0));
        // 生成上传凭证
        Auth auth = Auth.create(accessKey, secretKey);
        String uploadToken = auth.uploadToken(headerBucketName, fileName, 3600, policy);
        model.addAttribute("uploadToken", uploadToken);
        model.addAttribute("fileName", fileName);

        return "site/setting";
    }

前端:单击表单提交时,由JQuery异步将数据按照设置信息传给云服务器(即客户端上传到云服务器)。上传成功会更新图像路径

js:

$(function () {
    $("#uploadForm").submit(upload);
    $("#forgetForm").submit(forget);
});

function upload() {
    $.ajax({
        url:
            "http://up-z1.qiniup.com",
        method:
            "post",
        processData:
            false,
        contentType:
            false,
        data:
            new FormData($("#uploadForm")[0]),
        success: function (data) {
            if (data && data.code == 0) {
                // 更新头像路径
                $.post(
                    CONTEXT_PATH + "/user/header/url",
                    {"fileName": $("input[name='key']").val()},
                    function (data) {
                        data = $.parseJSON(data);
                        if (data.code == 0) {
                            window.location.reload();
                        } else {
                            alert(data.msg);
                        }
                    }
                );
            } else {
                alert("上传失败!");
            }
        }

    })
    ;
    return false;
}

数据库中更新头像路径:

@PostMapping("/header/url")
    @ResponseBody
    public String updateHeaderUrl(String fileName) {
        if (StringUtils.isBlank(fileName)) {
            return CommunityUtil.getJSONString(1, "文件名不能为空");
        }
        String url = headerBucketUrl + "/" + fileName;
        int id = hostHolder.getUser().getId();
        userService.updateHeader(hostHolder.getUser().getId(), url);
        return CommunityUtil.getJSONString(0);
    }



版权声明:本文为nice___amusin原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。