今天主要学习了如何配置阿里云的oss存储服务,并对网站进行进一步完善和功能上的扩充-----以下学习来自 "东软教育-Neusoft"
仅作为学习记录,供今后复习参考
目录
“对象存储 OSS”存储服务配置
1. 注册账号
此处不做介绍,就正常注册账号
2. 开通 “对象存储 OSS” 存储服务
- 点击立即开通
3. 新建Bucket
- 注意蓝色框的EndPoint后面会用到
4. 新建目录
- 新建一个目录,用于存放文件,这里起名为demo
5. 新建AccessKey
- 点击头像,选择AccessKey管理,创建AccessKey,注意保存创建成功后提示的下载文件,里面存放了我们要用到的AccessKey和AccessKeySecret
6. 编写随机生成多级子目录算法
- 编写一个多级子目录随机生成类,用于为我们生成图片文件的随机路径
package com.wanglianng.utils;
//此工具类的作用:生成并获取随机的目录层级
public class DirUtils {
public static String getDirs(String fileName){
//参数是一个字符串,每个字符串都有一个hashcode.
int hashCode = fileName.hashCode();
//构建一个字符串工具序列
StringBuilder sb = new StringBuilder();
//四级目录
for(int i = 0;i<4;i++){
int x = hashCode & 0b111;
sb.append(Integer.toHexString(x)+"/");
hashCode = hashCode>>>4;
}
return sb.toString();//返回结果
}//getDirs
//测试
public static void main(String[] args) {
String xdir = DirUtils.getDirs("demo");
System.out.println("xdir:"+xdir);
}
}
- 运行测试,查看返回结果
7. 编写阿里云常量类
7.1随便上传一张图片
- 点击详情,复制图片url地址
7.2新建AliYunOSSConst接口
- 在工具包utils下新建AliYunOSSConst接口
- 用于存放oss存储服务下的一些关键信息
package com.wanglianng.utils;
public interface AliYunOSSConst {
//访问阿里云的根节点,也就是服务器外网访问的域名地址
//https://wl8138.oss-cn-beijing.aliyuncs.com/%E9%A1%B9%E7%9B%AE%E7%BB%84%E7%BB%87%E6%9E%B6%E6%9E%84%20%281%29.png
//下载复制文件 URL
public static final String endpoint ="https://oss-cn-beijing.aliyuncs.com";
//定义申请阿里云给开发者开通的账号 : AccessKeyId
String accessKeyId = "LTAI4GFAQFR7HzjNJ21AiWZY";
//id对应的唯一密码 : AccessKeySecret
String accessKeySecret = "BIIX2o06ZNYpcdDtr1UP9sLPxovs7a";
//桶的名称 Bucket:wl8138
String bucketName = "wl8138";
//上传文件的路径全名 "demo/"
String yourObjectName = "demo/";
}
- 注意一下几处,仔细仔细仔细!
8. 新建OSSUtils类
- 添加阿里云com.aliyun.oss依赖包:选择3.8.0版本
- 在工具包utils下新建OSSUtils.class
- 用于编写我们的文件存储函数和文件获取函数,实现将照片通过注册的方式上传到新建的bucket中,并能从中调取
package com.wanglianng.utils;
import com.aliyun.oss.OSS;
import com.aliyun.oss.OSSClientBuilder;
import com.aliyun.oss.model.OSSObject;
import java.io.InputStream;
import java.net.MalformedURLException;
import java.net.URL;
public class OSSUtils {
//作用:将文件数据存储到阿里云的OSS服务上
//别忘记添加阿里云的pom.xml依赖包。groupid:<com.aliyun.oss>
//参数1:fileName ---需要被上传的文件名
//参数2: in ---上传文件的输入流
//return String ---返回上传到阿里云OSS上之后的文件的URL地址
public static String ossUploadFile (String fileName, InputStream in){
//获取到操作OSS的客户端对象。
OSS ossClient = new OSSClientBuilder().build(AliYunOSSConst.endpoint,
AliYunOSSConst.accessKeyId,AliYunOSSConst.accessKeySecret);
//添加上传的相关参数。
//先构建对象名。比如:xdir:3/6/5/7/xxx.xx
String yourObjectName = AliYunOSSConst.yourObjectName+DirUtils.getDirs(fileName)+fileName;
//把对象名放到桶当中
ossClient.putObject(AliYunOSSConst.bucketName,yourObjectName,in);
//关闭客户端
ossClient.shutdown();
return "https://wl8138.oss-cn-beijing.aliyuncs.com/"+yourObjectName;
}
//获取文件方法
public static InputStream getFile(String imgUrl) throws MalformedURLException{
OSS ossClient = new OSSClientBuilder().build(AliYunOSSConst.endpoint,
AliYunOSSConst.accessKeyId,AliYunOSSConst.accessKeySecret);
OSSObject object = ossClient.getObject(new URL(imgUrl),null);
InputStream in = object.getObjectContent();
return in;
}
}
- 主要用于图片文件的上传和读取
- 然后返回到web包下的RegistServlet.class进行修改
- 由于之前未进行AliYunOSSConst接口和OSSUtils类的编写,所以在注册时,图片文件不能够对数据库进行传值,我们虚拟了一个图片地址(红色圈体内);这是我们已经编写好图片文件存储函数,所以将虚拟的图片地址注释掉,添加文件上传语句,并将地址映射到imgUrl中。
String url = OSSUtils.ossUploadFile(fileItem.getName(),fileItem.getInputStream());
map.put("imgUrl",url);
- 重新载入,点击刷新,进行注册
- 测试成功,成功将注册图片文件上传到阿里云
9. 新建js;fonts;img;css文件夹
- 在web包下的新建四个文件夹,分别为:
- js;fonts;img;css。
9.1 配置js文件
- 向js文件夹内导入jquery-3.5.1.js
9.2 对login.html进行完善
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="js/jquery-3.5.1.js"type="text/javascript"charset="UTF-8"></script>
</head>
<body>
<h1>欢迎使用个人健康码</h1>
<form method="post">
手机号码:
<input type="text" name="telephone" id="telephone"><br>
身份证号:
<input type="text" name="idCard" id="idCard"><br>
<button type="button"onclick="getCard()">获取健康码</button>
<a href="register.html">注册健康码</a><br>
</form>
</body>
<script type="text/javascript">
function getCard() {
//alert("getCard");
/*post方法有三个参数
参1:字符串-提交的servlet地址/服务器根目录
参2:字符串-地之后的参数
参3:函数-返回后的结果处理
* */
$.post("/HealthCode_war/login","telephone=323&idCard=3232",function (resp) {
alert(resp);//响应的结果
})
}
</script>
</html>
9.3 对index.jsp进行完善,增加直接登陆跳转
<html lang="zh">
<body>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<h2>Hello World!healthcode java</h2>
<a href="register.html">register healthcode</a><br>
<a href="login.html">直接登陆</a><br>
</body>
</html>
9.4 对LoginServlet.class进行完善
package com.wanglianng.web;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;
@WebServlet(name = "LoginServlet",urlPatterns = "/login")
public class LoginServlet extends HttpServlet {
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
doGet(request,response);
}
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
String telephone =request.getParameter("telephone");
String idCard =request.getParameter("idCard");
System.out.println("telephone:"+telephone);
System.out.println("idCard:"+idCard);
String cpath = request.getContextPath();
System.out.println("测试连接servlet"+cpath);
}
}
- 重新部署,进行测试
- 主界面出现直接登陆方式
- 点击 “ 直接登陆 ” 会直接跳转到 “ 获取健康码 ” 界面
- 点击 “ 获取健康码 ” 会跳出弹窗即测试成功