Plotly Dash注释文本URL内#字符编码异常，如何正确转码为%23？

问题根源 #

你遇到的两类编码问题是两层转义逻辑冲突导致的：

• 直接写原生#字符时，Plotly渲染链接不会自动将#转义为%23，导致哈希符号被浏览器识别为页面锚点，截断后面的请求参数
• 用urllib.parse.quote_plus对包含#的完整话题标签编码时，生成的%23会被Plotly的HTML渲染逻辑二次转义，%被编码为%25，最终变成%2523导致链接失效

修改方案 #

不需要调整全局配置，仅需修改回调函数中构造注释文本的代码行即可：

# 把原来拼接hashtag再编码的逻辑，改为直接写死%23，仅对国家名编码
text=f"<a href=\"https://twitter.com/search?q=%23{urllib.parse.quote_plus(topic)}&src=typed_query&f=live\">{topic}</a>",

实现逻辑 #

• 直接将#的编码结果%23作为固定字符串写入链接，不需要通过urllib编码生成，从根源避免被二次转义
• 仅对国家名称部分使用urllib.parse.quote_plus编码，保证国家名称中的特殊字符（空格、特殊符号等）可以被正常编码
• 最终渲染的链接完全符合Twitter搜索链接的格式要求，可正常跳转

内容的提问来源于stack exchange，提问作者Pranab