rentgen/report-window/har-converter.tsx

99 lines
2.5 KiB
TypeScript
Raw Normal View History

import React, { useEffect, useState } from "react";
2021-11-08 20:14:28 +01:00
import { HAREntry } from "../extended-request";
2021-11-22 17:54:15 +01:00
import { StolenDataEntry } from "../stolen-data-entry";
import { getshorthost, unique } from "../util";
2021-11-08 20:14:28 +01:00
function handleNewFile(
element: HTMLInputElement,
2021-11-22 17:54:15 +01:00
entries: StolenDataEntry[],
2021-11-08 20:14:28 +01:00
setFiltered: (Blob) => void
): void {
2021-11-08 20:14:28 +01:00
const reader = new FileReader();
reader.addEventListener("load", () => {
const content = JSON.parse(reader.result as string);
content.log.entries = content.log.entries.filter((har_entry: HAREntry) =>
2021-11-22 17:54:15 +01:00
entries.some((entry) => entry.matchesHAREntry(har_entry))
2021-11-08 20:14:28 +01:00
);
setFiltered(
new Blob([JSON.stringify(content)], { type: "application/json" })
);
});
reader.readAsText(element.files[0]);
}
2021-11-22 17:54:15 +01:00
function generateFakeHAR(entries: StolenDataEntry[]) {
const requests = entries
.sort((entry1, entry2) => entry2.getPriority() - entry1.getPriority())
.map((entry) => entry.request);
return {
log: {
version: "1.2",
creator: {
name: "Firefox",
version: "94.0",
},
browser: {
name: "Firefox",
version: "94.0",
},
pages: [
{
startedDateTime: "2021-11-08T20:27:23.195+01:00",
id: "page_1",
title: "HAR DUmp",
pageTimings: {
onContentLoad: 467,
onLoad: 4226,
},
},
],
entries: unique(requests).map((r) => r.toHAR()),
},
};
}
2021-11-22 17:54:15 +01:00
export default function HARConverter({
entries,
}: {
entries: StolenDataEntry[];
}) {
2021-11-08 20:14:28 +01:00
const [filtered, setFiltered] = useState<Blob | null>(null);
const [filename, setFilename] = useState("");
const [fakeHAR, setFakeHAR] = useState<ReturnType<typeof generateFakeHAR>>();
useEffect(() => {
2021-11-22 17:54:15 +01:00
setFakeHAR(generateFakeHAR(entries));
}, []);
2021-11-08 20:14:28 +01:00
return (
<div>
<input
type="file"
accept=".har"
onChange={(e) => {
setFilename(e.target.files[0].name);
2021-11-22 17:54:15 +01:00
handleNewFile(e.target, entries, setFiltered);
2021-11-08 20:14:28 +01:00
}}
/>
{(filtered && (
<a
href={URL.createObjectURL(filtered)}
download={filename.replace(".har", "-filtered.har")}
>
Pobierz wyfiltrowany HAR
</a>
)) ||
null}
<a
href={URL.createObjectURL(
new Blob([JSON.stringify(fakeHAR)], { type: "application/json" })
)}
download={`${getshorthost(
2021-11-22 17:54:15 +01:00
entries[0].request.originalURL
2021-11-10 14:59:08 +01:00
)}-${new Date().toJSON()}-trimmed.har`}
>
Pobierz "zfałszowany" HAR
</a>
2021-11-08 20:14:28 +01:00
</div>
);
}