icd/rentgen
icd
/
rentgen
2
1
Fork 0
Code Issues 70 Pull Requests Projects Releases 6 Wiki Activity

Handle new screenshot-service API

This commit is contained in:
Kuba Orlik 2022-06-17 11:47:51 +02:00
parent 48809c7cc5
commit 58c40efc79
1 changed files with 18 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
components/report-window/screenshot-generator.tsx
View File

@ -2,23 +2,31 @@ import React, { Fragment } from 'react';
import { RequestCluster } from '../../request-cluster'; import { RequestCluster } from '../../request-cluster';
import './screenshot-generator.scss'; import './screenshot-generator.scss';
const SS_URL = 'http://65.108.60.135:3000';
enum taskState { enum taskState {
WAITING = 'waiting', WAITING = 'waiting',
RUNNING = 'running', RUNNING = 'running',
FINISHED = 'finished', FINISHED = 'finished',
} }
type Screenshot = {
url: string;
domain: string;
found_headers: string[];
};
interface screenshotTask { interface screenshotTask {
url: string; url: string;
domains: string[]; domains: string[];
id: string; id: string;
status: taskState; status: taskState;
output: string; output: string;
files: string[]; images: Screenshot[];
} }
function createTaskEndpoint(visited_url: string, domains: string[]) { function createTaskEndpoint(visited_url: string, domains: string[]) {
return `http://65.108.60.135:3000/api/requests?url=${visited_url}${domains.reduce( return `${SS_URL}/api/requests?url=${visited_url}${domains.reduce(
(prev: string, curr: string) => prev + '&domains[]=' + curr, (prev: string, curr: string) => prev + '&domains[]=' + curr,
'' ''
)}`; )}`;
@ -42,7 +50,7 @@ export default function ScreenshotGenerator({
setReportWindowMode: Function; setReportWindowMode: Function;
}) { }) {
const [mode, setMode] = React.useState<string>('idle'); const [mode, setMode] = React.useState<string>('idle');
const [images, setImages] = React.useState<string[]>([]); const [images, setImages] = React.useState<Screenshot[]>([]);
const [taskId, setTaskId] = React.useState<string>(null); const [taskId, setTaskId] = React.useState<string>(null);
async function subscribeTask(path: string): Promise<screenshotTask> { async function subscribeTask(path: string): Promise<screenshotTask> {
@ -50,7 +58,7 @@ export default function ScreenshotGenerator({
while (response.status === taskState.WAITING || response.status === taskState.RUNNING) { while (response.status === taskState.WAITING || response.status === taskState.RUNNING) {
await new Promise((resolve) => setTimeout(resolve, 1000)); await new Promise((resolve) => setTimeout(resolve, 1000));
response = await (await pollTask(path)).json(); response = await (await pollTask(path)).json();
setImages((response as screenshotTask)?.files); setImages((response as screenshotTask)?.images);
} }
if (response.status === taskState.FINISHED) { if (response.status === taskState.FINISHED) {
@ -60,7 +68,7 @@ export default function ScreenshotGenerator({
} }
function downloadFiles() { function downloadFiles() {
const urls = images.map((el) => `http://65.108.60.135:3000/static/${taskId}/${el}`); const urls = images.map((el) => `${SS_URL}${el}`);
for (const url of urls) { for (const url of urls) {
let a = document.createElement('a'); let a = document.createElement('a');
@ -108,7 +116,7 @@ export default function ScreenshotGenerator({
const urlArr = task.url.split('/'); const urlArr = task.url.split('/');
setTaskId(urlArr[urlArr.length - 1]); setTaskId(urlArr[urlArr.length - 1]);
const response = await subscribeTask(task.url); const response = await subscribeTask(task.url);
setImages(response.files); setImages(response.images);
console.log('output', response); console.log('output', response);
}} }}
> >
@ -131,18 +139,18 @@ export default function ScreenshotGenerator({
</p> </p>
<div className="images"> <div className="images">
{images.map((filename: string) => { {images.map((screenshot) => {
return ( return (
<div <div
key={`${taskId}_${filename}`} key={`${taskId}_${screenshot.url}`}
className="browser browser--filled" className="browser browser--filled"
style={{ style={{
backgroundImage: `url(http://65.108.60.135:3000/static/${taskId}/${filename})`, backgroundImage: `url(${SS_URL}${screenshot.url})`,
}} }}
> >
<div className="browser__header"> <div className="browser__header">
<div className="browser__header--address-bar"> <div className="browser__header--address-bar">
{filename} {screenshot.url}
</div> </div>
<div className="browser__header--controls">· · ·</div> <div className="browser__header--controls">· · ·</div>
</div> </div>