[frontend] bugfix: fix guest mode get file icon failed bug (#455)

Author: desAweis

app-builder/plugins/aipp-plugin/src/main/java/modelengine/fit/jober/aipp/controller/AppBuilderGuestController.java

@@ -17,8 +17,10 @@
 import modelengine.fit.http.annotation.RequestBody;
 import modelengine.fit.http.annotation.RequestMapping;
 import modelengine.fit.http.annotation.RequestParam;
+import modelengine.fit.http.entity.FileEntity;
 import modelengine.fit.http.entity.PartitionedEntity;
 import modelengine.fit.http.server.HttpClassicServerRequest;
+import modelengine.fit.http.server.HttpClassicServerResponse;
 import modelengine.fit.jane.common.controller.AbstractController;
 import modelengine.fit.jane.common.entity.OperationContext;
 import modelengine.fit.jane.common.response.Rsp;
@@ -483,6 +485,26 @@ public Rsp<List<FileRspDto>> batchUploadFile(HttpClassicServerRequest httpReques
         return Rsp.ok(fileRspDtos);
     }
 
+    /**
+     * 从远端下载文件或者从 nas 下载文件。
+     *
+     * @param httpRequest 表示 Http 请求体的 {@link HttpClassicServerRequest}。
+     * @param tenantId 表示租户唯一标识的 {@link String}。
+     * @param fileCanonicalPath 表示文件的规范路径的 {@link String}。
+     * @param fileName 表示文件名的 {@link String}。
+     * @param httpClassicServerResponse 表示 Http 响应的 {@link HttpClassicServerResponse}。
+     * @return 表示文件实体的 {@link FileEntity}。
+     * @throws IOException 表示文件读写异常的 {@link IOException}。
+     */
+    @GetMapping(path = "/{tenant_id}/file", description = "下载文件")
+    public FileEntity getFile(HttpClassicServerRequest httpRequest, @PathVariable("tenant_id") String tenantId,
+            @RequestParam(value = "filePath", required = false) String fileCanonicalPath,
+            @RequestParam(value = "fileName") String fileName, HttpClassicServerResponse httpClassicServerResponse)
+            throws IOException {
+        OperationContext context = new OperationContext();
+        return this.fileService.getFile(context, fileCanonicalPath, fileName, httpClassicServerResponse);
+    }
+
     /**
      * 清空应用的历史对话。
      *

frontend/src/common/util.ts

@@ -9,13 +9,19 @@ export function bytesToSize(bytes) {
   return (bytes / Math.pow(k, i)).toFixed(2) + ' ' + sizes[i];
 }
 
-export function convertImgPath(path: string) {
+export function convertImgPath(path: string, isGuest = false) {
   return new Promise((resolve, reject) => {
-    fetch(path, {
-      headers: {
-        'X-Auth-Token': getCookie('__Host-X-Auth-Token'),
-        'X-Csrf-Token': getCookie('__Host-X-Csrf-Token')
-      },
+    const headers: HeadersInit = {};
+    let requestPath = path;
+    if (isGuest) {
+      requestPath = path.replace('/appbuilder/v1/api/', '/appbuilder/v1/api/guest/');
+    } else {
+      headers['X-Auth-Token'] = getCookie('__Host-X-Auth-Token');
+      headers['X-Csrf-Token'] = getCookie('__Host-X-Csrf-Token');
+    }
+
+    fetch(requestPath, {
+      headers,
     })
     .then(response => response.blob())
     .then(blob => {
@@ -57,4 +63,4 @@ export const listFormate = (arr) => {
     });
   });
   return res;
-}
+}

frontend/src/pages/chatPreview/components/chat-details.tsx

@@ -129,9 +129,10 @@ const NormalAppInfo = (props) => {
 const Img = (props) => {
   const { icon } = props;
   const [imgPath, setImgPath] = useState('');
+  const isGuest = useAppSelector((state) => state.appStore.isGuest);
   useEffect(() => {
     if (icon) {
-      convertImgPath(icon).then(res => {
+      convertImgPath(icon, isGuest).then(res => {
         setImgPath(res);
       });
     }

frontend/src/pages/chatPreview/components/receive-box/receive-box.tsx

@@ -124,9 +124,10 @@ const Loading = () => {
 const Img = (props) => {
   const { iconPath } = props;
   const [imgPath, setImgPath] = useState('');
+  const isGuest = useAppSelector((state) => state.appStore.isGuest);
   useEffect(() => {
     if (iconPath) {
-      convertImgPath(iconPath).then(res => {
+      convertImgPath(iconPath, isGuest).then(res => {
         setImgPath(res);
       });
     }

frontend/src/pages/chatPreview/components/send-editor/components/editor-btn-home.tsx

@@ -100,7 +100,7 @@ const EditorBtnHome = (props) => {
   // 获取图片
   const getImgPath = async (cardInfo) => {
     if (cardInfo && cardInfo.icon) {
-      const res: any = await convertImgPath(cardInfo.icon);
+      const res: any = await convertImgPath(cardInfo.icon, isGuest);
       setAppIcon(res);
     }
   };