GitHub-Proxy/signoz
1
0
Fork 0
mirror of https://git.mirrors.martin98.com/https://github.com/SigNoz/signoz synced 2025-08-13 18:56:00 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat: restrict the rendering of img and form tags in the logs content (#4905)

Browse Source 
* feat: restrict the rendering of img tags in the logs content

* fix: forbidden tags code cleanup
This commit is contained in:
Vikrant Gupta 2024-05-20 19:41:44 +05:30 committed by GitHub
parent 2dbe598b2c
commit 12be6ce020
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
4 changed files with 19 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
frontend/src/components/Logs/ListLogView/index.tsx
View File

@ -16,6 +16,7 @@ import { useCallback, useMemo, useState } from 'react';
// interfaces // interfaces
import { IField } from 'types/api/logs/fields'; import { IField } from 'types/api/logs/fields';
import { ILog } from 'types/api/logs/log'; import { ILog } from 'types/api/logs/log';
import { FORBID_DOM_PURIFY_TAGS } from 'utils/app';
// components // components
import AddToQueryHOC, { AddToQueryHOCProps } from '../AddToQueryHOC'; import AddToQueryHOC, { AddToQueryHOCProps } from '../AddToQueryHOC';
@ -50,7 +51,11 @@ function LogGeneralField({
}: LogFieldProps): JSX.Element { }: LogFieldProps): JSX.Element {
const html = useMemo( const html = useMemo(
() => ({ () => ({
__html: convert.toHtml(dompurify.sanitize(fieldValue)), __html: convert.toHtml(
dompurify.sanitize(fieldValue, {
FORBID_TAGS: [...FORBID_DOM_PURIFY_TAGS],
}),
),
}), }),
[fieldValue], [fieldValue],
); );

5
frontend/src/components/Logs/RawLogView/index.tsx
View File

@ -21,6 +21,7 @@ import {
useMemo, useMemo,
useState, useState,
} from 'react'; } from 'react';
import { FORBID_DOM_PURIFY_TAGS } from 'utils/app';
import LogLinesActionButtons from '../LogLinesActionButtons/LogLinesActionButtons'; import LogLinesActionButtons from '../LogLinesActionButtons/LogLinesActionButtons';
import LogStateIndicator from '../LogStateIndicator/LogStateIndicator'; import LogStateIndicator from '../LogStateIndicator/LogStateIndicator';
@ -144,7 +145,9 @@ function RawLogView({
const html = useMemo( const html = useMemo(
() => ({ () => ({
__html: convert.toHtml(dompurify.sanitize(text)), __html: convert.toHtml(
dompurify.sanitize(text, { FORBID_TAGS: [...FORBID_DOM_PURIFY_TAGS] }),
),
}), }),
[text], [text],
); );

7
frontend/src/components/Logs/TableView/useTableView.tsx
View File

@ -8,6 +8,7 @@ import dompurify from 'dompurify';
import { useIsDarkMode } from 'hooks/useDarkMode'; import { useIsDarkMode } from 'hooks/useDarkMode';
import { FlatLogData } from 'lib/logs/flatLogData'; import { FlatLogData } from 'lib/logs/flatLogData';
import { useMemo } from 'react'; import { useMemo } from 'react';
import { FORBID_DOM_PURIFY_TAGS } from 'utils/app';
import LogStateIndicator from '../LogStateIndicator/LogStateIndicator'; import LogStateIndicator from '../LogStateIndicator/LogStateIndicator';
import { getLogIndicatorTypeForTable } from '../LogStateIndicator/utils'; import { getLogIndicatorTypeForTable } from '../LogStateIndicator/utils';
@ -107,7 +108,11 @@ export const useTableView = (props: UseTableViewProps): UseTableViewResult => {
children: ( children: (
<TableBodyContent <TableBodyContent
dangerouslySetInnerHTML={{ dangerouslySetInnerHTML={{
__html: convert.toHtml(dompurify.sanitize(field)), __html: convert.toHtml(
dompurify.sanitize(field, {
FORBID_TAGS: [...FORBID_DOM_PURIFY_TAGS],
}),
),
}} }}
linesPerRow={linesPerRow} linesPerRow={linesPerRow}
isDarkMode={isDarkMode} isDarkMode={isDarkMode}

3
frontend/src/utils/app.ts
View File

@ -31,3 +31,6 @@ export const checkVersionState = (
const versionCore = currentVersion?.split('-')[0]; const versionCore = currentVersion?.split('-')[0];
return versionCore === latestVersion; return versionCore === latestVersion;
}; };
// list of forbidden tags to remove in dompurify
export const FORBID_DOM_PURIFY_TAGS = ['img', 'form'];