refactor: disable iframe in message markdown render

msgbyte · Nov 23, 2024 · 677faa0 · 677faa0
1 parent f74647f
commit 677faa0
Show file tree

Hide file tree

Showing 3 changed files with 11 additions and 4 deletions.
diff --git a/client/web/plugins/com.msgbyte.mdpanel/src/group/MarkdownPanel.tsx b/client/web/plugins/com.msgbyte.mdpanel/src/group/MarkdownPanel.tsx
@@ -54,7 +54,7 @@ const MarkdownPanel: React.FC = React.memo(() => {
       render={(dataMap: Record<string, string>) => {
         return (
           <MainContent>
-            <Markdown raw={dataMap['markdown'] ?? ''} />
+            <Markdown raw={dataMap['markdown'] ?? ''} allowIframe={true} />
           </MainContent>
         );
       }}

diff --git a/client/web/src/components/Markdown/render.tsx b/client/web/src/components/Markdown/render.tsx
@@ -13,8 +13,9 @@ const ReactMarkdown = Loadable(() => import('react-markdown'));
 
 export const Markdown: React.FC<{
   raw: string;
+  allowIframe?: boolean;
   baseUrl?: string;
-}> = React.memo(({ raw, baseUrl }) => {
+}> = React.memo(({ raw, baseUrl, allowIframe }) => {
   const { t } = useTranslation();
   const transformUrl = useCallback(
     (url: string) => {
@@ -46,21 +47,27 @@ export const Markdown: React.FC<{
       ),
       svg: () => <div>not support svg</div>,
       iframe: (props) => {
+        if (!allowIframe) {
+          return <div>{t('不支持iframe')}</div>;
+        }
+
         let src = props.src;
 
         if (!src) {
           return <div />;
         }
 
         if (!src.startsWith('http')) {
-          return <div>only support http source</div>;
+          return <div>{t('只支持http路径')}</div>;
         }
 
         if (src && src.includes('?')) {
           src += '&autoplay=0'; // make sure media autoplay is false
         }
         return <iframe {...props} src={src} />;
       },
+      embed: () => <div>{t('不支持embed')}</div>,
+      html: () => <div>{t('不支持自定义HTML')}</div>,
       style: () => <div>{t('不支持自定义样式')}</div>,
       meta: () => <div>{t('不支持自定义Meta')}</div>,
     }),

diff --git a/client/web/src/plugin/PluginStore/DocumentView/DocumentMarkdownRender.tsx b/client/web/src/plugin/PluginStore/DocumentView/DocumentMarkdownRender.tsx
@@ -24,7 +24,7 @@ export const DocumentMarkdownRender: React.FC<{ url: string }> = React.memo(
       return <Problem text={String(error)} />;
     }
 
-    return <Markdown raw={String(value)} baseUrl={url} />;
+    return <Markdown raw={String(value)} baseUrl={url} allowIframe={true} />;
   }
 );
 DocumentMarkdownRender.displayName = 'DocumentMarkdownRender';