图片上传

jsowell-admin/src/main/java/com/jsowell/web/controller/common/CommonController.java

@@ -163,10 +163,16 @@ public class CommonController {
 		}
 	}
 
+	/**
+	 * 上传到阿里云oss
+	 * http://localhost:8080/common/uploadOSS
+	 * @param file
+	 * @return
+	 * @throws Exception
+	 */
 	@CrossOrigin
 	@PostMapping("/uploadOSS")
 	public AjaxResult uploadFileOSS(MultipartFile file) throws Exception {
-		System.out.println(file);
 		try {
 			String url = AliyunOssUploadUtils.uploadFile(file);
 			AjaxResult ajax = AjaxResult.success();

jsowell-ui/src/components/MapContainer/MapContainer.vue

@@ -19,12 +19,13 @@
     </div>
     <div>上传图片</div>
     <el-upload
-      action="https://jsonplaceholder.typicode.com/posts/"
+      action="http://localhost:8080/common/uploadOSS"
+      :headers="headers"
       list-type="picture-card"
       :on-preview="handlePictureCardPreview"
       :on-remove="handleRemove"
+      :on-success="handleSuccess"
     >
-<!--      :headers="headers"-->
       <i class="el-icon-plus"></i>
     </el-upload>
     <el-dialog :visible.sync="dialogVisible">
@@ -49,6 +50,7 @@
 import AMapLoader from "@amap/amap-jsapi-loader";
 import {getStation} from "@/api/pile/station.js";
 import bus from "@/bus/bus";
+import {getToken} from "@/utils/auth";
 
 window._AMapSecurityConfig = {
   securityJsCode: "829b6b73f84682c2eb982eaa47a745b8",
@@ -75,9 +77,17 @@ export default {
       placeSearch: "",
       stationId: this.$route.params.id,
       avatar: "",
+      headers: {
+        Authorization: "Bearer " + getToken()
+      },
+      imageUrl: null
     };
   },
   methods: {
+    handleSuccess(res, file) {
+      this.imageUrl = URL.createObjectURL(file.raw);
+      console.log("图片上传成功 url：", this.imageUrl);
+    },
     handleRemove(file, fileList) {
       console.log(file, fileList);
     },