fix: decode unicode for response body

fixed #142
Postcatlab · Jan 4, 2023 · 2d6f125 · 2d6f125
1 parent 6692e26
commit 2d6f125
Show file tree

Hide file tree

Showing 4 changed files with 19 additions and 15 deletions.
diff --git a/src/workbench/browser/src/app/modules/eo-ui/monaco-editor/monaco-editor.component.ts b/src/workbench/browser/src/app/modules/eo-ui/monaco-editor/monaco-editor.component.ts
@@ -5,7 +5,7 @@ import type { editor, IDisposable } from 'monaco-editor';
 import type { JoinedEditorOptions } from 'ng-zorro-antd/code-editor';
 
 import { ThemeService } from '../../../core/services/theme.service';
-import { b64DecodeUnicode, debounce, whatTextType } from '../../../utils/index.utils';
+import { debounce, whatTextType } from '../../../utils/index.utils';
 import { getDefaultCompletions } from './defaultCompletions';
 
 type EventType = 'format' | 'copy' | 'search' | 'replace' | 'type' | 'download' | 'newTab';
@@ -35,12 +35,6 @@ const eventHash = new Map()
 export class EoMonacoEditorComponent implements AfterViewInit, OnInit, OnChanges, OnDestroy {
   @Input() eventList: EventType[] = [];
   @Input() hiddenList: string[] = [];
-  @Input() set isBase64(val) {
-    this.$$isBase64 = val;
-    if (val) {
-      this.setCode(b64DecodeUnicode(this.$$code));
-    }
-  }
   @Input() set code(val) {
     this.setCode(val);
   }
@@ -54,7 +48,6 @@ export class EoMonacoEditorComponent implements AfterViewInit, OnInit, OnChanges
   @Input() completions = [];
   @Output() readonly codeChange = new EventEmitter<string>();
   $$code = '';
-  $$isBase64 = false;
   isFirstFormat = true;
   codeEdtor: editor.IStandaloneCodeEditor;
   completionItemProvider: IDisposable;
@@ -187,9 +180,7 @@ export class EoMonacoEditorComponent implements AfterViewInit, OnInit, OnChanges
 
     let code = val;
     try {
-      if (this.$$isBase64) {
-        code = b64DecodeUnicode(val);
-      } else if (typeof val === 'object') {
+      if (typeof val === 'object') {
         code = JSON.stringify(val);
       } else {
         // code = JSON.stringify(typeof val === 'string' ? JSON.parse(val) : val);

diff --git a/...s/workspace/project/api/http/test/result-response/api-test-result-response.component.html b/...s/workspace/project/api/http/test/result-response/api-test-result-response.component.html
@@ -60,9 +60,8 @@
         class="mt-[20px] border-all"
         [autoFormat]="true"
         [autoType]="true"
-        [code]="model.body"
+        [code]="responseBody"
         [config]="{ readOnly: true }"
-        [isBase64]="['longText', 'stream'].includes(model.responseType)"
         [eventList]="['type', 'format', 'copy', 'search']"
       ></eo-monaco-editor>
     </ng-template>

diff --git a/...ges/workspace/project/api/http/test/result-response/api-test-result-response.component.ts b/...ges/workspace/project/api/http/test/result-response/api-test-result-response.component.ts
@@ -1,7 +1,7 @@
 import { Component, Input, OnInit, OnChanges, ViewChild } from '@angular/core';
 import { SafeUrl } from '@angular/platform-browser';
 import { EoMonacoEditorComponent } from 'eo/workbench/browser/src/app/modules/eo-ui/monaco-editor/monaco-editor.component';
-import { b64DecodeUnicode, getBlobUrl } from 'eo/workbench/browser/src/app/utils/index.utils';
+import { b64DecodeUnicode, decodeUnicode, getBlobUrl } from 'eo/workbench/browser/src/app/utils/index.utils';
 import { NzContextMenuService, NzDropdownMenuComponent } from 'ng-zorro-antd/dropdown';
 
 import { ApiTestUtilService } from '../../../../../../../modules/api-shared/api-test-util.service';
@@ -19,6 +19,7 @@ export class ApiTestResultResponseComponent implements OnChanges {
   codeStatus: { status: string; cap: number; class: string };
   size: string;
   blobUrl = '';
+  responseBody = '';
   get responseIsImg() {
     return this.model.contentType?.startsWith('image');
   }
@@ -28,6 +29,7 @@ export class ApiTestResultResponseComponent implements OnChanges {
   ngOnChanges(changes) {
     if (changes.model && this.model) {
       this.codeStatus = this.apiTest.getHTTPStatus(this.model?.statusCode);
+      this.responseBody = this.decodeBody(changes.model.currentValue.body || '');
       if (!this.responseIsImg) {
         this.eoEditor?.formatCode();
       } else if (this.responseIsImg) {
@@ -36,6 +38,14 @@ export class ApiTestResultResponseComponent implements OnChanges {
     }
   }
 
+  decodeBody(body: string) {
+    if (['longText', 'stream'].includes(this.model.responseType)) {
+      return decodeUnicode(b64DecodeUnicode(body));
+    } else {
+      return decodeUnicode(body);
+    }
+  }
+
   contextMenu($event: MouseEvent, menu: NzDropdownMenuComponent): void {
     this.nzContextMenuService.create($event, menu);
   }

diff --git a/src/workbench/browser/src/app/utils/index.utils.ts b/src/workbench/browser/src/app/utils/index.utils.ts
@@ -287,7 +287,7 @@ export const compareVersion = (v1, v2) => {
   return _r === 0 && v1 !== v2 ? compareVersion(_v1.splice(1).join('.'), _v2.splice(1).join('.')) : _r;
 };
 
-// more see https://developer.mozilla.org/zh-CN/docs/Glossary/Base64#solution_4_%E2%80%93_escaping_the_string_before_encoding_it
+// more see https://developer.mozilla.org/zh-CN/docs/Glossary/Base64#solution_4_–_escaping_the_string_before_encoding_it
 export const b64DecodeUnicode = (str: string) => {
   // Going backwards: from bytestream, to percent-encoding, to original string.
   return decodeURIComponent(
@@ -300,3 +300,7 @@ export const b64DecodeUnicode = (str: string) => {
       .join('')
   );
 };
+
+export const decodeUnicode = (str: string) => {
+  return unescape(str.replace(/\\u/gi, '%u'));
+};