Decode gRPC body (#48)

* Decode grpc.

* Better variable names.

* Added protobuf-decoder dependency.

* Updated protobuf-decoder's version.
This commit is contained in:
nimrod-up9 2021-05-12 18:42:42 +03:00 committed by GitHub
parent d975e76555
commit 1ddc7f2f6b
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 21208 additions and 27 deletions

21226
ui/package-lock.json generated

File diff suppressed because it is too large Load Diff

View File

@ -13,6 +13,7 @@
"@types/react-dom": "^17.0.3", "@types/react-dom": "^17.0.3",
"node-sass": "^5.0.0", "node-sass": "^5.0.0",
"numeral": "^2.0.6", "numeral": "^2.0.6",
"protobuf-decoder": "^0.1.0",
"react": "^17.0.2", "react": "^17.0.2",
"react-copy-to-clipboard": "^5.0.3", "react-copy-to-clipboard": "^5.0.3",
"react-dom": "^17.0.2", "react-dom": "^17.0.2",

View File

@ -4,6 +4,7 @@ import {SyntaxHighlighter} from "../SyntaxHighlighter/index";
import CollapsibleContainer from "../CollapsibleContainer"; import CollapsibleContainer from "../CollapsibleContainer";
import FancyTextDisplay from "../FancyTextDisplay"; import FancyTextDisplay from "../FancyTextDisplay";
import Checkbox from "../Checkbox"; import Checkbox from "../Checkbox";
import ProtobufDecoder from "protobuf-decoder";
interface HAREntryViewLineProps { interface HAREntryViewLineProps {
label: string; label: string;
@ -70,7 +71,7 @@ export const HAREntryBodySection: React.FC<HAREntryBodySectionProps> = ({
const MAXIMUM_BYTES_TO_HIGHLIGHT = 10000; // The maximum of chars to highlight in body, in case the response can be megabytes const MAXIMUM_BYTES_TO_HIGHLIGHT = 10000; // The maximum of chars to highlight in body, in case the response can be megabytes
const supportedLanguages = [['html', 'html'], ['json', 'json'], ['application/grpc', 'json']]; // [[indicator, languageToUse],...] const supportedLanguages = [['html', 'html'], ['json', 'json'], ['application/grpc', 'json']]; // [[indicator, languageToUse],...]
const jsonLikeFormats = ['json']; const jsonLikeFormats = ['json'];
const binaryFormats = ['application/grpc']; const protobufFormats = ['application/grpc'];
const [isWrapped, setIsWrapped] = useState(false); const [isWrapped, setIsWrapped] = useState(false);
const formatTextBody = (body): string => { const formatTextBody = (body): string => {
@ -80,9 +81,10 @@ export const HAREntryBodySection: React.FC<HAREntryBodySectionProps> = ({
try { try {
if (jsonLikeFormats.some(format => content?.mimeType?.indexOf(format) > -1)) { if (jsonLikeFormats.some(format => content?.mimeType?.indexOf(format) > -1)) {
return JSON.stringify(JSON.parse(bodyBuf), null, 2); return JSON.stringify(JSON.parse(bodyBuf), null, 2);
} else if (binaryFormats.some(format => content?.mimeType?.indexOf(format) > -1)) { } else if (protobufFormats.some(format => content?.mimeType?.indexOf(format) > -1)) {
// Replace all non printable characters (ASCII) // Replace all non printable characters (ASCII)
return atob(bodyBuf).replace(/[^ -~]/g, '.') const protobufDecoder = new ProtobufDecoder(bodyBuf, true);
return JSON.stringify(protobufDecoder.decode().toSimple(), null, 2);
} }
} catch (error) { } catch (error) {
console.error(error); console.error(error);