langgenius/dify
1
0
Fork 0
mirror of https://github.com/langgenius/dify.git synced 2026-07-22 12:36:14 -04:00
Code Issues 775 Packages Projects Releases 10 Wiki Activity

Dify is not displaying embedded videos with iframe #6758

New Issue
Closed
opened 2026-02-21 18:17:09 -05:00 by yindo · 2 comments
yindo commented 2026-02-21 18:17:09 -05:00
Owner
Copy Link
Copy Source

Originally created by @taowang1993 on GitHub (Nov 14, 2024).

Self Checks

  • This is only for bug report, if you would like to ask a question, please head to Discussions.
  • I have searched for existing issues search for existing issues, including closed ones.
  • I confirm that I am using English to submit this report (我已阅读并同意 Language Policy).
  • [FOR CHINESE USERS] 请务必使用英文提交 Issue，否则会被关闭。谢谢！:）
  • Please do not modify this template :) and fill in all the required fields.

Dify version

0.11.1

Cloud or Self Hosted

Self Hosted (Docker)

Steps to reproduce

@dosu

I posted this in Disscussions, but later I figured this might be an issue.
So I am posting here as well.

I am trying to add "duckduckgo video search" to api/core/tools/provider/builtin/duckduckgo/tools.

But I could not get dify-web to display youtube videos in iframe, although the api call responded iframe code.

What could be the root cause? Is it a backend issue or a frontend issue?

Is it possibly because the markdown packages are not rendering iframe videos?

ddgo_video.py

from typing import Any

from duckduckgo_search import DDGS

from core.tools.entities.tool_entities import ToolInvokeMessage
from core.tools.tool.builtin_tool import BuiltinTool


class DuckDuckGoVideoSearchTool(BuiltinTool):
    """
    Tool for performing a video search using DuckDuckGo search engine.
    """

    def _invoke(self, user_id: str, tool_parameters: dict[str, Any]) -> list[ToolInvokeMessage]:
        query_dict = {
            "keywords": tool_parameters.get("query"),
            "region": tool_parameters.get("region", "wt-wt"),
            "safesearch": tool_parameters.get("safesearch", "moderate"),
            "timelimit": tool_parameters.get("timelimit"),
            "resolution": tool_parameters.get("resolution"),
            "duration": tool_parameters.get("duration"),
            "license_videos": tool_parameters.get("license_videos"),
            "max_results": tool_parameters.get("max_results"),
        }
        
        # Remove None values to use API defaults
        query_dict = {k: v for k, v in query_dict.items() if v is not None}
        
        response = DDGS().videos(**query_dict)
        
        # Create HTML result with embedded iframes
        markdown_result = "\n\n"
        json_result = []
        
        for res in response:
            title = res.get('title', '')
            embed_html = res.get('embed_html', '')
            description = res.get('description', '')
            
            # Add title, embedded video, and description
            markdown_result += f"### {title}\n\n"
            markdown_result += f"{embed_html}\n\n"
            markdown_result += f"_{description}_\n\n"
            markdown_result += "---\n\n"  # Add separator between videos
            
            json_result.append(self.create_json_message(res))
            
        return [self.create_text_message(markdown_result)] + json_result

Request and Response

Request
{"ddgo_video": {"query": "Ted video artificial intelligence"}}
Response
{"ddgo_video": "\n\n### Will Artificial Intelligence Replace Us? Here's the Answer | Brian Burke | TEDxCoral Springs\n\n<iframe width=\"1280\" height=\"720\" src=\"https://www.youtube.com/embed/MgcsTwWM_-s?autoplay=1\" frameborder=\"0\" allowfullscreen></iframe>\n\n_Ready for an upgrade? In this riveting TEDx Talk, Brian The Mac Man dives headfirst into the powerful shift AI brings to our lives, urging us to confront our egos and embrace AI as the ultimate tool to amplify our creativity and potential. With humor, live demos, and the playful voice of AI itself, Brian explores how AI is blurring the line ..._\n\n---\n\n### How can we bridge the AI gap? | Amanda Williamson | TEDxUniversity of Waikato\n\n<iframe width=\"1280\" height=\"720\" src=\"https://www.youtube.com/embed/7ECfIPHd4CU?autoplay=1\" frameborder=\"0\" allowfullscreen></iframe>\n\n_Dr Amanda Williamson followed, interrogating how the potential for artificial intelligence to support work that saves lives is taking a literal back seat to less critical applications Amanda, an award-winning lecturer, focuses on the adoption of artificial intelligence in business and research. She brings extensive knowledge of data analytics ..._\n\n---\n\n### Struggling to Explain AI: TED Talk Challenge\n\n<iframe width=\"1280\" height=\"720\" src=\"https://www.youtube.com/embed/caVMACPAwUM?autoplay=1\" frameborder=\"0\" allowfullscreen></iframe>\n\n_Join us on the TED stage as our speaker tackles the challenge of defining AI in simple terms. Experience a thought-provoking discussion that demystifies artificial intelligence and explores its potential to enhance human productivity and solve complex problems. Perfect for tech enthusiasts and curious minds alike! #ArtificialIntelligence # ..._\n\n---\n\ntool response: {\"content\": \"https://www.youtube.com/watch?v=MgcsTwWM_-s\", \"description\": \"Ready for an upgrade? In this riveting TEDx Talk, Brian The Mac Man dives headfirst into the powerful shift AI brings to our lives, urging us to confront our egos and embrace AI as the ultimate tool to amplify our creativity and potential. With humor, live demos, and the playful voice of AI itself, Brian explores how AI is blurring the line ...\", \"duration\": \"12:14\", \"embed_html\": \"<iframe width=\\\"1280\\\" height=\\\"720\\\" src=\\\"https://www.youtube.com/embed/MgcsTwWM_-s?autoplay=1\\\" frameborder=\\\"0\\\" allowfullscreen></iframe>\", \"embed_url\": \"https://www.youtube.com/embed/MgcsTwWM_-s?autoplay=1\", \"image_token\": \"99372b03a49cdb60d174cb102c6932f22a3fe1970d32fbb1ec9d8247c5ae8330\", \"images\": {\"large\": \"https://tse4.mm.bing.net/th?id=OVF.eWuHp6qiWMORMM6uOnvADQ&pid=Api\", \"medium\": \"https://tse4.mm.bing.net/th?id=OVF.eWuHp6qiWMORMM6uOnvADQ&pid=Api\", \"motion\": \"\", \"small\": \"https://tse4.mm.bing.net/th?id=OVF.eWuHp6qiWMORMM6uOnvADQ&pid=Api\"}, \"provider\": \"Bing\", \"published\": \"2024-11-04T16:20:20.0000000\", \"publisher\": \"YouTube\", \"statistics\": {\"viewCount\": 241}, \"title\": \"Will Artificial Intelligence Replace Us? Here's the Answer | Brian Burke | TEDxCoral Springs\", \"uploader\": \"TEDx Talks\"}.tool response: {\"content\": \"https://www.youtube.com/watch?v=7ECfIPHd4CU\", \"description\": \"Dr Amanda Williamson followed, interrogating how the potential for artificial intelligence to support work that saves lives is taking a literal back seat to less critical applications Amanda, an award-winning lecturer, focuses on the adoption of artificial intelligence in business and research. She brings extensive knowledge of data analytics ...\", \"duration\": \"12:18\", \"embed_html\": \"<iframe width=\\\"1280\\\" height=\\\"720\\\" src=\\\"https://www.youtube.com/embed/7ECfIPHd4CU?autoplay=1\\\" frameborder=\\\"0\\\" allowfullscreen></iframe>\", \"embed_url\": \"https://www.youtube.com/embed/7ECfIPHd4CU?autoplay=1\", \"image_token\": \"3be70c6b3cbf7b7d90d94a03f8d85505375b29779aa02b7752fca7585536a47d\", \"images\": {\"large\": \"https://tse2.mm.bing.net/th?id=OVF.gurS3jgBotJdO90bzY0u7A&pid=Api\", \"medium\": \"https://tse2.mm.bing.net/th?id=OVF.gurS3jgBotJdO90bzY0u7A&pid=Api\", \"motion\": \"\", \"small\": \"https://tse2.mm.bing.net/th?id=OVF.gurS3jgBotJdO90bzY0u7A&pid=Api\"}, \"provider\": \"Bing\", \"published\": \"2024-11-05T17:10:01.0000000\", \"publisher\": \"YouTube\", \"statistics\": {\"viewCount\": 3129}, \"title\": \"How can we bridge the AI gap? | Amanda Williamson | TEDxUniversity of Waikato\", \"uploader\": \"TEDx Talks\"}.tool response: {\"content\": \"https://www.youtube.com/watch?v=caVMACPAwUM\", \"description\": \"Join us on the TED stage as our speaker tackles the challenge of defining AI in simple terms. Experience a thought-provoking discussion that demystifies artificial intelligence and explores its potential to enhance human productivity and solve complex problems. Perfect for tech enthusiasts and curious minds alike! #ArtificialIntelligence # ...\", \"duration\": \"0:57\", \"embed_html\": \"<iframe width=\\\"1280\\\" height=\\\"720\\\" src=\\\"https://www.youtube.com/embed/caVMACPAwUM?autoplay=1\\\" frameborder=\\\"0\\\" allowfullscreen></iframe>\", \"embed_url\": \"https://www.youtube.com/embed/caVMACPAwUM?autoplay=1\", \"image_token\": \"417d1e4b2d4bcdb9667fae1d4fea2847b75573def679c99e12e8c18cf201cbbe\", \"images\": {\"large\": \"https://tse2.mm.bing.net/th?id=OVF.WpyWCs4qpeHaXFM%2bxLdgHw&pid=Api\", \"medium\": \"https://tse2.mm.bing.net/th?id=OVF.WpyWCs4qpeHaXFM%2bxLdgHw&pid=Api\", \"motion\": \"\", \"small\": \"https://tse2.mm.bing.net/th?id=OVF.WpyWCs4qpeHaXFM%2bxLdgHw&pid=Api\"}, \"provider\": \"Bing\", \"published\": \"2024-11-08T04:04:21.0000000\", \"publisher\": \"YouTube\", \"statistics\": {\"viewCount\": 923}, \"title\": \"Struggling to Explain AI: TED Talk Challenge\", \"uploader\": \"Facts&AI\"}."}
image

✔️ Expected Behavior

No response

❌ Actual Behavior

No response

Originally created by @taowang1993 on GitHub (Nov 14, 2024). ### Self Checks - [X] This is only for bug report, if you would like to ask a question, please head to [Discussions](https://github.com/langgenius/dify/discussions/categories/general). - [X] I have searched for existing issues [search for existing issues](https://github.com/langgenius/dify/issues), including closed ones. - [X] I confirm that I am using English to submit this report (我已阅读并同意 [Language Policy](https://github.com/langgenius/dify/issues/1542)). - [X] [FOR CHINESE USERS] 请务必使用英文提交 Issue，否则会被关闭。谢谢！:） - [X] Please do not modify this template :) and fill in all the required fields. ### Dify version 0.11.1 ### Cloud or Self Hosted Self Hosted (Docker) ### Steps to reproduce @dosu I posted this in Disscussions, but later I figured this might be an issue. So I am posting here as well. I am trying to add "duckduckgo video search" to api/core/tools/provider/builtin/duckduckgo/tools. But I could not get dify-web to display youtube videos in iframe, although the api call responded iframe code. What could be the root cause? Is it a backend issue or a frontend issue? Is it possibly because the markdown packages are not rendering iframe videos? ### ddgo_video.py ``` from typing import Any from duckduckgo_search import DDGS from core.tools.entities.tool_entities import ToolInvokeMessage from core.tools.tool.builtin_tool import BuiltinTool class DuckDuckGoVideoSearchTool(BuiltinTool): """ Tool for performing a video search using DuckDuckGo search engine. """ def _invoke(self, user_id: str, tool_parameters: dict[str, Any]) -> list[ToolInvokeMessage]: query_dict = { "keywords": tool_parameters.get("query"), "region": tool_parameters.get("region", "wt-wt"), "safesearch": tool_parameters.get("safesearch", "moderate"), "timelimit": tool_parameters.get("timelimit"), "resolution": tool_parameters.get("resolution"), "duration": tool_parameters.get("duration"), "license_videos": tool_parameters.get("license_videos"), "max_results": tool_parameters.get("max_results"), } # Remove None values to use API defaults query_dict = {k: v for k, v in query_dict.items() if v is not None} response = DDGS().videos(**query_dict) # Create HTML result with embedded iframes markdown_result = "\n\n" json_result = [] for res in response: title = res.get('title', '') embed_html = res.get('embed_html', '') description = res.get('description', '') # Add title, embedded video, and description markdown_result += f"### {title}\n\n" markdown_result += f"{embed_html}\n\n" markdown_result += f"_{description}_\n\n" markdown_result += "---\n\n" # Add separator between videos json_result.append(self.create_json_message(res)) return [self.create_text_message(markdown_result)] + json_result ``` ### Request and Response ``` Request {"ddgo_video": {"query": "Ted video artificial intelligence"}} Response {"ddgo_video": "\n\n### Will Artificial Intelligence Replace Us? Here's the Answer | Brian Burke | TEDxCoral Springs\n\n<iframe width=\"1280\" height=\"720\" src=\"https://www.youtube.com/embed/MgcsTwWM_-s?autoplay=1\" frameborder=\"0\" allowfullscreen></iframe>\n\n_Ready for an upgrade? In this riveting TEDx Talk, Brian The Mac Man dives headfirst into the powerful shift AI brings to our lives, urging us to confront our egos and embrace AI as the ultimate tool to amplify our creativity and potential. With humor, live demos, and the playful voice of AI itself, Brian explores how AI is blurring the line ..._\n\n---\n\n### How can we bridge the AI gap? | Amanda Williamson | TEDxUniversity of Waikato\n\n<iframe width=\"1280\" height=\"720\" src=\"https://www.youtube.com/embed/7ECfIPHd4CU?autoplay=1\" frameborder=\"0\" allowfullscreen></iframe>\n\n_Dr Amanda Williamson followed, interrogating how the potential for artificial intelligence to support work that saves lives is taking a literal back seat to less critical applications Amanda, an award-winning lecturer, focuses on the adoption of artificial intelligence in business and research. She brings extensive knowledge of data analytics ..._\n\n---\n\n### Struggling to Explain AI: TED Talk Challenge\n\n<iframe width=\"1280\" height=\"720\" src=\"https://www.youtube.com/embed/caVMACPAwUM?autoplay=1\" frameborder=\"0\" allowfullscreen></iframe>\n\n_Join us on the TED stage as our speaker tackles the challenge of defining AI in simple terms. Experience a thought-provoking discussion that demystifies artificial intelligence and explores its potential to enhance human productivity and solve complex problems. Perfect for tech enthusiasts and curious minds alike! #ArtificialIntelligence # ..._\n\n---\n\ntool response: {\"content\": \"https://www.youtube.com/watch?v=MgcsTwWM_-s\", \"description\": \"Ready for an upgrade? In this riveting TEDx Talk, Brian The Mac Man dives headfirst into the powerful shift AI brings to our lives, urging us to confront our egos and embrace AI as the ultimate tool to amplify our creativity and potential. With humor, live demos, and the playful voice of AI itself, Brian explores how AI is blurring the line ...\", \"duration\": \"12:14\", \"embed_html\": \"<iframe width=\\\"1280\\\" height=\\\"720\\\" src=\\\"https://www.youtube.com/embed/MgcsTwWM_-s?autoplay=1\\\" frameborder=\\\"0\\\" allowfullscreen></iframe>\", \"embed_url\": \"https://www.youtube.com/embed/MgcsTwWM_-s?autoplay=1\", \"image_token\": \"99372b03a49cdb60d174cb102c6932f22a3fe1970d32fbb1ec9d8247c5ae8330\", \"images\": {\"large\": \"https://tse4.mm.bing.net/th?id=OVF.eWuHp6qiWMORMM6uOnvADQ&pid=Api\", \"medium\": \"https://tse4.mm.bing.net/th?id=OVF.eWuHp6qiWMORMM6uOnvADQ&pid=Api\", \"motion\": \"\", \"small\": \"https://tse4.mm.bing.net/th?id=OVF.eWuHp6qiWMORMM6uOnvADQ&pid=Api\"}, \"provider\": \"Bing\", \"published\": \"2024-11-04T16:20:20.0000000\", \"publisher\": \"YouTube\", \"statistics\": {\"viewCount\": 241}, \"title\": \"Will Artificial Intelligence Replace Us? Here's the Answer | Brian Burke | TEDxCoral Springs\", \"uploader\": \"TEDx Talks\"}.tool response: {\"content\": \"https://www.youtube.com/watch?v=7ECfIPHd4CU\", \"description\": \"Dr Amanda Williamson followed, interrogating how the potential for artificial intelligence to support work that saves lives is taking a literal back seat to less critical applications Amanda, an award-winning lecturer, focuses on the adoption of artificial intelligence in business and research. She brings extensive knowledge of data analytics ...\", \"duration\": \"12:18\", \"embed_html\": \"<iframe width=\\\"1280\\\" height=\\\"720\\\" src=\\\"https://www.youtube.com/embed/7ECfIPHd4CU?autoplay=1\\\" frameborder=\\\"0\\\" allowfullscreen></iframe>\", \"embed_url\": \"https://www.youtube.com/embed/7ECfIPHd4CU?autoplay=1\", \"image_token\": \"3be70c6b3cbf7b7d90d94a03f8d85505375b29779aa02b7752fca7585536a47d\", \"images\": {\"large\": \"https://tse2.mm.bing.net/th?id=OVF.gurS3jgBotJdO90bzY0u7A&pid=Api\", \"medium\": \"https://tse2.mm.bing.net/th?id=OVF.gurS3jgBotJdO90bzY0u7A&pid=Api\", \"motion\": \"\", \"small\": \"https://tse2.mm.bing.net/th?id=OVF.gurS3jgBotJdO90bzY0u7A&pid=Api\"}, \"provider\": \"Bing\", \"published\": \"2024-11-05T17:10:01.0000000\", \"publisher\": \"YouTube\", \"statistics\": {\"viewCount\": 3129}, \"title\": \"How can we bridge the AI gap? | Amanda Williamson | TEDxUniversity of Waikato\", \"uploader\": \"TEDx Talks\"}.tool response: {\"content\": \"https://www.youtube.com/watch?v=caVMACPAwUM\", \"description\": \"Join us on the TED stage as our speaker tackles the challenge of defining AI in simple terms. Experience a thought-provoking discussion that demystifies artificial intelligence and explores its potential to enhance human productivity and solve complex problems. Perfect for tech enthusiasts and curious minds alike! #ArtificialIntelligence # ...\", \"duration\": \"0:57\", \"embed_html\": \"<iframe width=\\\"1280\\\" height=\\\"720\\\" src=\\\"https://www.youtube.com/embed/caVMACPAwUM?autoplay=1\\\" frameborder=\\\"0\\\" allowfullscreen></iframe>\", \"embed_url\": \"https://www.youtube.com/embed/caVMACPAwUM?autoplay=1\", \"image_token\": \"417d1e4b2d4bcdb9667fae1d4fea2847b75573def679c99e12e8c18cf201cbbe\", \"images\": {\"large\": \"https://tse2.mm.bing.net/th?id=OVF.WpyWCs4qpeHaXFM%2bxLdgHw&pid=Api\", \"medium\": \"https://tse2.mm.bing.net/th?id=OVF.WpyWCs4qpeHaXFM%2bxLdgHw&pid=Api\", \"motion\": \"\", \"small\": \"https://tse2.mm.bing.net/th?id=OVF.WpyWCs4qpeHaXFM%2bxLdgHw&pid=Api\"}, \"provider\": \"Bing\", \"published\": \"2024-11-08T04:04:21.0000000\", \"publisher\": \"YouTube\", \"statistics\": {\"viewCount\": 923}, \"title\": \"Struggling to Explain AI: TED Talk Challenge\", \"uploader\": \"Facts&AI\"}."} ``` <img width="754" alt="image" src="https://github.com/user-attachments/assets/46a58c4f-a565-48e8-af4e-e5202212cfdb"> ### ✔️ Expected Behavior _No response_ ### ❌ Actual Behavior _No response_
yindo added the 🐞 bug label 2026-02-21 18:17:09 -05:00
yindo closed this issue 2026-02-21 18:17:09 -05:00
yindo commented 2026-02-21 18:17:10 -05:00
Author
Owner
Copy Link
Copy Source

@dosubot[bot] commented on GitHub (Nov 14, 2024):

The issue you're experiencing with Dify not displaying embedded videos using iframes is likely due to a known limitation in Dify's markdown or content rendering components. The ReactMarkdown component configuration in Dify explicitly disallows the use of iframe elements through the disallowedElements property:

disallowedElements={['script', 'iframe', 'head', 'html', 'meta', 'link', 'style', 'body']}

This configuration prevents iframes from being rendered in the markdown content processed by this component [1].

To continue talking to Dosu, mention @dosu.

@dosubot[bot] commented on GitHub (Nov 14, 2024): <!-- Answer --> The issue you're experiencing with Dify not displaying embedded videos using iframes is likely due to a known limitation in Dify's markdown or content rendering components. The `ReactMarkdown` component configuration in Dify explicitly disallows the use of `iframe` elements through the `disallowedElements` property: ```tsx disallowedElements={['script', 'iframe', 'head', 'html', 'meta', 'link', 'style', 'body']} ``` This configuration prevents iframes from being rendered in the markdown content processed by this component <sup>[[1]](https://github.com/langgenius/dify/blob/main/web/app/components/base/markdown.tsx)</sup>. <!-- Dosu Comment Footer --> *To continue talking to [Dosu](https://dosu.dev), mention @dosu.*
yindo commented 2026-02-21 18:17:10 -05:00
Author
Owner
Copy Link
Copy Source

@crazywoola commented on GitHub (Nov 14, 2024):

The iframe is on the black list, it might cause some unwanted behavior for now. So it's not supported yet.

@crazywoola commented on GitHub (Nov 14, 2024): The iframe is on the black list, it might cause some unwanted behavior for now. So it's not supported yet.
Sign in to join this conversation.
No Branch/Tag Specified
Branches Tags
Labels
Clear labels
Knowledge Pipeline
Proposal
WIP
cloud
dependencies
feat:webapp
good first issue
outdated
performance
pull-request
Mirrored from GitHub Pull Request
 python:uv
refactor
size:L
stale
status: accepting prs
status: blocked
status: in discussion
stt & tts
vulnerablity
web
wont-fix
🌊 feat:workflow
🌚 invalid
🐞 bug
👻 feat:rag
💪 enhancement
📚 documentation
🔨 feat:tools
🙋‍♂️ question
🙏 help wanted
🤔 cant-reproduce
🤖 feat:agent
No Label 🐞 bug
Milestone
No items
No Milestone
Projects
Clear projects
No project
Assignees
Clear assignees
yindo
No Assignees
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: langgenius/dify#6758
Delete Branch "%!s()"

Deleting a branch is permanent. Although the deleted branch may continue to exist for a short time before it actually gets removed, it CANNOT be undone in most cases. Continue?