refactor(image): 优化图片上传功能
- 修改后端接口,使用 @RequestPart 注解替代 @RequestParam - 前端调整图片上传逻辑,直接发送 File 对象 - 简化前端上传成功后的处理流程
This commit is contained in:
@@ -6,8 +6,6 @@ import com.test.bijihoudaun.common.response.R;
|
||||
import com.test.bijihoudaun.entity.Image;
|
||||
import com.test.bijihoudaun.service.ImageService;
|
||||
import io.swagger.v3.oas.annotations.Operation;
|
||||
import io.swagger.v3.oas.annotations.Parameter;
|
||||
import io.swagger.v3.oas.annotations.Parameters;
|
||||
import io.swagger.v3.oas.annotations.tags.Tag;
|
||||
import jakarta.servlet.http.HttpServletResponse;
|
||||
import org.springframework.beans.factory.annotation.Autowired;
|
||||
@@ -35,7 +33,7 @@ public class ImageController {
|
||||
@Operation(summary = "上传图片")
|
||||
@PostMapping
|
||||
public R<Image> uploadImage(
|
||||
@RequestParam("file") MultipartFile file,
|
||||
@RequestPart("file") MultipartFile file,
|
||||
@RequestParam(value = "userId", required = false) Long userId,
|
||||
@RequestParam(value = "markdownId", required = false) Long markdownId) {
|
||||
|
||||
|
||||
@@ -62,20 +62,13 @@ const initVditor = () => {
|
||||
upload: {
|
||||
accept: 'image/*',
|
||||
handler(files) {
|
||||
const file = files; // 必须是 File 对象,而不是 FileList
|
||||
const file = files[0];
|
||||
if (!file) return;
|
||||
|
||||
const formData = new FormData();
|
||||
formData.append('file', file); // 字段名必须是 'file'
|
||||
|
||||
uploadImage(formData).then(res => {
|
||||
if (res.code === 200) {
|
||||
const url = res.data;
|
||||
uploadImage(file).then(res => {
|
||||
const url = res.url;
|
||||
// 使用 file.name 替代 files.name 保证一致性
|
||||
vditor.value.insertValue(``);
|
||||
} else {
|
||||
ElMessage.error('图片上传失败');
|
||||
}
|
||||
}).catch(() => {
|
||||
ElMessage.error('图片上传失败');
|
||||
});
|
||||
|
||||
BIN
mydatabase.db
BIN
mydatabase.db
Binary file not shown.
Reference in New Issue
Block a user