fix: copy button not working on API Server and API Key pages#34515
Merged
hyoban merged 8 commits intolanggenius:mainfrom Apr 9, 2026
Merged
fix: copy button not working on API Server and API Key pages#34515hyoban merged 8 commits intolanggenius:mainfrom
hyoban merged 8 commits intolanggenius:mainfrom
Conversation
…ecure HTTP contexts Replace foxact/use-clipboard with a custom useClipboard hook that uses the project's writeTextToClipboard utility. This utility includes a fallback mechanism (document.execCommand) for non-secure HTTP contexts where navigator.clipboard is unavailable. Affected components: - CopyFeedback (used by API Server URL copy button) - CopyIcon - InputWithCopy Closes langgenius#34494
BrianWang1990
requested review from
CodingOnStar,
hyoban,
iamjoel and
zxhlyh
as code owners
dosubot
Bot
added
the
size:M
dosubot
Bot
added
size:L
hyoban
approved these changes
Apr 9, 2026
HanqingZ
pushed a commit
to HanqingZ/dify
that referenced
this pull request
Apr 23, 2026
…ius#34515) Co-authored-by: Brian Wang <BrianWang1990@users.noreply.github.com> Co-authored-by: test <test@testdeMac-mini.local> Co-authored-by: BrianWang1990 <512dabing99@163.com> Co-authored-by: Stephen Zhou <hi@hyoban.cc> Co-authored-by: Stephen Zhou <38493346+hyoban@users.noreply.github.com>
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
3 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Fixes #34494
Close #34552
Problem
The copy buttons on the API Server endpoint and API Key pages do not work when Dify is accessed over a non-secure HTTP connection (common in self-hosted Docker deployments on local networks).
This is because the
CopyFeedback,CopyIcon, andInputWithCopycomponents usefoxact/use-clipboard, which internally relies onnavigator.clipboard.writeText— an API that is restricted to secure contexts (HTTPS or localhost).Reported in #34494.
Root Cause
PR #32287 previously fixed this issue for
input-copy.tsxby introducing awriteTextToClipboardutility inweb/utils/clipboard.tswith adocument.execCommand("copy")fallback. However, the base copy components (CopyFeedback,CopyIcon,InputWithCopy) still usedfoxact/use-clipboardand were not updated — leaving the API Server URL and API Key copy buttons broken in HTTP contexts.Solution
useClipboardhook (web/hooks/use-clipboard.ts) that wraps the existingwriteTextToClipboardutility, providing the same API surface asfoxact/use-clipboard(copied,copy,reset).foxact/use-clipboardimports in:web/app/components/base/copy-feedback/index.tsxweb/app/components/base/copy-icon/index.tsxweb/app/components/base/input-with-copy/index.tsxvitest.setup.ts.This ensures all copy buttons in the app work correctly in both secure (HTTPS) and non-secure (HTTP) contexts.
Checklist
writeTextToClipboardfallback — no duplicationcopied,copy,reset)