-
-
Notifications
You must be signed in to change notification settings - Fork 2.8k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Always open links in chat in a new tab #2180
Conversation
I believe the issue here is this line:
Which calls this function: open-webui/src/lib/utils/index.ts Lines 32 to 40 in 90503be
This transforms open-webui/src/lib/components/chat/Messages/ResponseMessage.svelte Lines 440 to 445 in 90503be
I don't know what the impact of adding |
I tried two ways to fix sanitization
Patch
diff --git a/src/lib/utils/index.ts b/src/lib/utils/index.ts
index 03cbc626..2f9b1dc2 100644
--- a/src/lib/utils/index.ts
+++ b/src/lib/utils/index.ts
@@ -36,11 +36,14 @@ export const sanitizeResponseContent = (content: string) => {
.replace(/<$/, '')
.replaceAll(/<\|[a-z]+\|>/g, ' ')
.replaceAll('<', '<')
+ .replaceAll('>', '>')
.trim();
};
export const revertSanitizedResponseContent = (content: string) => {
- return content.replaceAll('<', '<');
+ return content
+ .replaceAll('<', '<')
+ .replaceAll('>', '>');
};
export const capitalizeFirstLetter = (string) => {
Patch
commit 9c48a1568d00029bef65b9b653d02fd013f52eef
Author: Austen Adler <agadler@austenadler.com>
Date: Thu May 16 16:28:10 2024 -0400
Use dompurify instead of manual sanitization
diff --git a/package-lock.json b/package-lock.json
index be7ae0dc..80477544 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -12,6 +12,7 @@
"async": "^3.2.5",
"bits-ui": "^0.19.7",
"dayjs": "^1.11.10",
+ "dompurify": "^3.1.3",
"eventsource-parser": "^1.1.2",
"file-saver": "^2.0.5",
"highlight.js": "^11.9.0",
@@ -2730,6 +2731,11 @@
"url": "https://github.com/fb55/domhandler?sponsor=1"
}
},
+ "node_modules/dompurify": {
+ "version": "3.1.3",
+ "resolved": "https://registry.npmjs.org/dompurify/-/dompurify-3.1.3.tgz",
+ "integrity": "sha512-5sOWYSNPaxz6o2MUPvtyxTTqR4D3L77pr5rUQoWgD5ROQtVIZQgJkXbo1DLlK3vj11YGw5+LnF4SYti4gZmwng=="
+ },
"node_modules/domutils": {
"version": "3.1.0",
"resolved": "https://registry.npmjs.org/domutils/-/domutils-3.1.0.tgz",
diff --git a/package.json b/package.json
index f8096269..ea7de885 100644
--- a/package.json
+++ b/package.json
@@ -49,6 +49,7 @@
"async": "^3.2.5",
"bits-ui": "^0.19.7",
"dayjs": "^1.11.10",
+ "dompurify": "^3.1.3",
"eventsource-parser": "^1.1.2",
"file-saver": "^2.0.5",
"highlight.js": "^11.9.0",
diff --git a/src/lib/components/chat/Messages/ResponseMessage.svelte b/src/lib/components/chat/Messages/ResponseMessage.svelte
index 1ad252f6..b067aac1 100644
--- a/src/lib/components/chat/Messages/ResponseMessage.svelte
+++ b/src/lib/components/chat/Messages/ResponseMessage.svelte
@@ -1,5 +1,6 @@
<script lang="ts">
import { toast } from 'svelte-sonner';
+ import DOMPurify from 'dompurify';
import dayjs from 'dayjs';
import { marked } from 'marked';
import tippy from 'tippy.js';
@@ -441,15 +442,15 @@
{#if token.type === 'code'}
<CodeBlock
lang={token.lang}
- code={revertSanitizedResponseContent(token.text)}
+ code={token.text}
/>
{:else}
- {@html marked.parse(token.raw, {
+ {@html DOMPurify.sanitize(marked.parse(token.raw, {
...defaults,
gfm: true,
breaks: true,
renderer
- })}
+ }))}
{/if}
{/each}
{/if}
diff --git a/src/lib/utils/index.ts b/src/lib/utils/index.ts
index 03cbc626..20c68d84 100644
--- a/src/lib/utils/index.ts
+++ b/src/lib/utils/index.ts
@@ -35,14 +35,9 @@ export const sanitizeResponseContent = (content: string) => {
.replace(/<\|[a-z]+\|$/, '')
.replace(/<$/, '')
.replaceAll(/<\|[a-z]+\|>/g, ' ')
- .replaceAll('<', '<')
.trim();
};
-export const revertSanitizedResponseContent = (content: string) => {
- return content.replaceAll('<', '<');
-};
-
export const capitalizeFirstLetter = (string) => {
return string.charAt(0).toUpperCase() + string.slice(1);
}; Which one would you prefer? I have already tested both and they're about the same. I think dompurify is better long-term, but it's a larger change. |
1st option would be preferable for now! |
Okay, I pushed patch 1 |
Couldn't check this earlier. The change seems to be working thank you 🙏 |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
LGTM 🚀
Thanks everyone! |
Pull Request Checklist
dev
branch.Description
Add
target="_blank" rel="nofollow"
to all links in the chat history window. It is annoying to click a link in a chat and have it unload Open-Webui, so I added this feature. (This)[https://github.com/markedjs/marked/issues/655#issuecomment-383226346] issue in themarked
repo describes how to do this properly.This only applies to links within chat messages. For example, asking a model
what is the URL of https://google.com?
and clicking the link in your message or the one it produces.Changelog Entry
Changed