一、头像上传
后端部分
1.1 controller
package com.controller;
import com.pojo.CommonResult;
import com.service.impl.OssServiceImpl;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.web.bind.annotation.CrossOrigin;
import org.springframework.web.bind.annotation.PostMapping;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RestController;
import org.springframework.web.multipart.MultipartFile;
@RestController
@CrossOrigin
@RequestMapping("/eduoss/fileoss")
public class OssController {
@Autowired
private OssServiceImpl ossService;
// 上传头像的方法
@PostMapping
public CommonResult uploadOssFile(MultipartFile file){
// 返回上传到Oss后生成的文件路径
String url = ossService.uploadFileAvatar(file);
return new CommonResult(200,"文件上传路径",url);
}
}
1.2 service
package com.service.impl;
import com.aliyun.oss.OSS;
import com.aliyun.oss.OSSClientBuilder;
import com.service.OssService;
import com.utils.ConstantPropertiesUtils;
import org.joda.time.DateTime;
import org.springframework.stereotype.Service;
import org.springframework.web.multipart.MultipartFile;
import java.io.IOException;
import java.io.InputStream;
import java.util.UUID;
@Service
public class OssServiceImpl implements OssService {
@Override
public String uploadFileAvatar(MultipartFile file) {
String endpoint = ConstantPropertiesUtils.END_POINT;
String keyId = ConstantPropertiesUtils.KEY_ID;
String keySecret = ConstantPropertiesUtils.KEY_SECRET;
String bucketName = ConstantPropertiesUtils.BUCKET_NAME;
// 创建oss实例
OSS ossClient = new OSSClientBuilder().build(endpoint, keyId, keySecret);
try {
// 获得文件流
InputStream inputStream = file.getInputStream();
// 获取文件原始名
final String oldName = file.getOriginalFilename();
// 获取文件后缀:从最后一个点切割
final String suffix = oldName.substring(oldName.lastIndexOf(".")); //.jpg
// 创建文件新的名字
String newName = UUID.randomUUID() + suffix;
// 通过工具类对当前日期进行转化
String dataPath = new DateTime().toString("yyyy/MM/dd");
ossClient.putObject(bucketName, dataPath +"/"+ newName, inputStream);
// 将上传成功的文件路径拼接并返回
// https://guli-lyq.oss-cn-shenzhen.aliyuncs.com/01.jpg
String url = "https://" + bucketName +"."+ endpoint +"/"+ dataPath +"/"+ newName;
return url;
} catch (IOException e) {
e.printStackTrace();
} finally {
ossClient.shutdown();
}
return null;
}
}
1.3 依赖
<dependencies>
<!-- 阿里云oss依赖 -->
<dependency>
<groupId>com.aliyun.oss</groupId>
<artifactId>aliyun-sdk-oss</artifactId>
</dependency>
<!-- 日期工具栏依赖 -->
<dependency>
<groupId>joda-time</groupId>
<artifactId>joda-time</artifactId>
</dependency>
</dependencies>
前端部分
<!-- 讲师头像:TODO -->
<el-form-item label="讲师头像">
<!-- 头衔缩略图 -->
<pan-thumb :image="String(teacher.avatar)" />
<!-- 文件上传按钮 -->
<el-button
type="primary"
icon="el-icon-upload"
@click="imagecropperShow = true"
>更换头像
</el-button>
<!--
v-show:是否显示上传组件
:key:类似于id,如果一个页面多个图片上传控件,可以做区分
:url:后台上传的url地址
@close:关闭上传组件
@crop-upload-success:上传成功后的回调
这里field的值必须和后端接口MultipartFile file的形参名相同
<input type="file" name="file"/>
-->
<image-cropper
v-show="imagecropperShow"
:width="300"
:height="300"
:key="imagecropperKey"
:url="BASE_API + '/eduoss/fileoss'"
field="file"
@close="close"
@crop-upload-success="cropSuccess"
/>
</el-form-item>
组件
import ImageCropper from "@/components/ImageCropper";
import PanThumb from "@/components/PanThumb";
数据
data() {
return {
teacher: {
id: '',
name: '',
sort: 0,
level: 1,
career: '',
intro: '',
avatar: '' // 头像url
},
imagecropperKey: 0, // 上传组件唯一标识
imagecropperShow: false, // 上传弹框组件是否显示
BASE_API: process.env.BASE_API,
saveBtnDisabled: false // 保存按钮是否禁用
}
},
方法
// 关闭上传弹框的方法
close() {
this.imagecropperShow = false
// 修改组件key,否则会存留上次上传成功的预览图
this.imagecropperKey = this.imagecropperKey + 1
},
// 上传成功之后的方法
cropSuccess(data) {
// 得到上传成功之后返回的图片地址
this.teacher.avatar = data
// 关闭上传弹框
this.imagecropperShow = false
// 修改组件key,否则会存留上次上传成功的预览图
this.imagecropperKey = this.imagecropperKey + 1
}
一、docker安装并配置redis
拉取redis镜像
docker pull redis:[版本号]
创建本地存放redis的位置
mkdir -p /mydata/redis/conf
touch /mydata/redis/conf/redis.config
修改配置文件
redis-6.0.6配置文件
主要配置的如下:
bind 127.0.0.1 # 注释掉这部分,使redis可以外部访问
------XX daemonize no # 用守护线程的方式启动 XX------------
requirepass 你的密码#给redis设置密码
appendonly yes # redis持久化 默认是no
tcp-keepalive 300 # 防止出现远程主机强迫关闭了一个现有的连接的错误 默认是300
启动redis
docker run \
-p 6379:6379 \
--name redis \
-v /mydata/redis/data:/data \
-v /mydata/redis/conf/redis.conf:/etc/redis/redis.conf \
-d redis redis-server /etc/redis/redis.conf
停止容器
docker stop redis
删除容器
docker rm redis
重启容器
docker start redis
使用 redis-cli 访问容器内 redis
docker exec -it redis redis-cli
查看现有的 redis 密码
config get requirepass
验证 redis 密码
auth "自定义的密码"
设置 redis 密码
config set requirepass 自定义密码
查看 redis 版本
docker exec -it redis redis-server -v