APP社交类项目二设计之四用户头像设计开发

      用户基本信息设置还包含用户头像上传下载。本APP中，作者使用了阿里云OSS存储服务器（目前可以免费申请）作为文件服务器管理头像资源，因此本地后台服务器调用了该SDK包。如下为阿里云OSS存储服务器后台界面，实际使用过程中需要先创建BUCKET，例如名称为poss. 创建好了就可以如下图所示。

      该BUCKET可以理解为阿里云上的一个区域，这个区域不仅有对应的阿里公网访问IP地址，还有访问密钥，BUCKET可建立文件夹和文件进行存储，上传下载操作。

   

         建立好了后，在本地服务器后台工程（SPRING+ SPRING MVC + MYBATIS）的applicationContext.xml中配置阿里云BUCKET如下参数

               

       在社交APP中，后台服务器给前台移动端提供了如下接口用于改变用户的基本属性，其中avator为用户头像文件

           后台服务器对应代码

         /**
* 修改我的资料
* @return
*/
@RequestMapping(value="/modify",method=RequestMethod.POST)
@ResponseBody
@ApiOperation("修改我的资料")
public Result modifyUserInfo(ModifyUserParam param, @RequestParam(value = "avator",required=false) @ApiParam("用户头像") MultipartFile fileUpload){
Result result=new Result();

String id = param.getId();
String nickname = param.getNickname();
String sex = param.getSex();
String birth = param.getBirth();
String scope = param.getScope();
String intro = param.getIntro();


User user=this.userService.selectByPrimaryKey(id);
if (user == null) {
result.setStatus(Result.FAILED);
result.setTipCode("visitorNotExist");
result.setTipMsg("不存在该用户");
return result;
}
    
if(nickname!=null)
{
user.setNickname(nickname);
}

if(sex!=null)
{
user.setSex(sex);
}
if(birth!=null)
{
user.setBirth(birth);
}
if(scope!=null)
{
user.setScope(scope);
}
if(intro!=null)
{
user.setIntro(intro);
}


if(fileUpload!=null)
{
//用户图片上传
    ImageResult pictureResult;
try {
logger.info("开始提交图片");
pictureResult =fileService.uploadPic(fileUpload,"");
} catch (IOException e) {
// TODO Auto-generated catch block
e.printStackTrace();
result.setStatus(Result.FAILED);
result.setTipCode("error");
result.setTipMsg("图片上传错误");
return result;
}
logger.info("提交图片成功"+pictureResult.getData());
if(pictureResult.getStatus().equals(Result.SUCCESS))
{
user.setAvator(pictureResult.getData());
}
else
{
logger.info("没有图片");
result.setStatus(Result.FAILED);
result.setTipCode("error");
result.setTipMsg("图片上传失败，请重新上传");
return result;
}
}

if(this.userService.updateByPrimaryKeySelective(user)!=1){
result.setStatus(Result.FAILED);
result.setTipCode("updateError");
result.setTipMsg("修改失败");
return result;
}
result.setData(user);
return result;
}

    

      在如上代码中还调用了一些方法（本文暂未贴出）来设置文件上传模式。这个设置是必须的，如果不设置则后台上传到阿里云OSS服务器上的图片后，阿里云返回的地址通过浏览器访问是默认链接打开，

      原问题：[求助]为啥在oss里的图片，浏览器点击图片不是直接打开而是下载了？！

链接地址：

https://bbs.aliyun.com/read/155500.html?spm=5176.11065265.1996646101.searchclickresult.b3a63d7dnC4rI0

 

      注意：原贴中给出的解决方式是通过设置域名关联到阿里云图片服务器ENDPOINT域名的方式是错误的。本文中参考了上述方法并未解决问题，实际上只需要在后台服务器代码中设置上传文件的contentType 就可以解决

      解决方法：后台服务器代码关键语句

     ObjectMetadata meta = new ObjectMetadata();

     //指定该Object文件类型，默认值application/octet-stream  
     meta.setContentType(getContentType(filename));  

    

       /** 
* 通过文件名判断并获取OSS服务文件上传时文件的contentType 
* @param fileName 文件名 
* @return 文件的contentType 
*/  
public static  String getContentType(String fileName){  
   //文件名后缀  
   String fileExtension = fileName.substring(fileName.lastIndexOf("."));  
   if(".bmp".equalsIgnoreCase(fileExtension)) {  
       return "image/bmp";  
   }  
   if(".gif".equalsIgnoreCase(fileExtension)) {  
       return "image/gif";  
   }  
   if(".jpeg".equalsIgnoreCase(fileExtension) || ".jpg".equalsIgnoreCase(fileExtension)  || ".png".equalsIgnoreCase(fileExtension) ){  
       return "image/jpeg";  
   }  
   if(".html".equalsIgnoreCase(fileExtension)){  
       return "text/html";  
   }  
   if(".txt".equalsIgnoreCase(fileExtension)){  
       return "text/plain";  
   }  
   if(".vsd".equalsIgnoreCase(fileExtension)){  
       return "application/vnd.visio";  
   }  
   if(".ppt".equalsIgnoreCase(fileExtension) || "pptx".equalsIgnoreCase(fileExtension)) {  
       return "application/vnd.ms-powerpoint";  
   }  
   if(".doc".equalsIgnoreCase(fileExtension) || "docx".equalsIgnoreCase(fileExtension)) {  
       return "application/msword";  
   }  
   if(".xml".equalsIgnoreCase(fileExtension)) {  
       return "text/xml";  
   }  
   return "image/jpeg";  

}  

        功能实现后，阿里云OSS存储服务器上可以看到对应的上传图片，预览中可以直接看到

 

        如果有阿里云OSS上传下载代码DEMO需要，可直接联系本文作者