diff --git a/app/services/grok/services/chat.py b/app/services/grok/services/chat.py index 55b4a9a..4238ba3 100644 --- a/app/services/grok/services/chat.py +++ b/app/services/grok/services/chat.py @@ -1078,14 +1078,24 @@ class StreamProcessor(proc_base.BaseProcessor): image = card_data.get("image") or {} original = image.get("original") title = image.get("title") or "" + if not original and "image_chunk" in card_data: + original = card_data["image_chunk"].get("imageUrl") + if not title: + title = card_data["image_chunk"].get("imageTitle") or "Generated Image" if original: async for chunk in self._close_think_block(): yield chunk title_safe = title.replace("\n", " ").strip() - if title_safe: - yield self._sse(f"![{title_safe}]({original})\n") + dl_service = getattr(self, "_get_dl", lambda: None)() + if dl_service: + img_id = title_safe if title_safe else "image" + rendered = await dl_service.render_image(original, self.token, img_id) + yield self._sse(f"{rendered}\n") else: - yield self._sse(f"![image]({original})\n") + if not original.startswith("http"): + original = f"https://assets.grok.com/{original.lstrip('/')}" + img_id = title_safe if title_safe else "image" + yield self._sse(f"![{img_id}]({original})\n") continue if tool_card := resp.get("toolUsageCard"): diff --git a/app/static/public/css/chat.css b/app/static/public/css/chat.css index 6cabe3b..bcbccc6 100644 --- a/app/static/public/css/chat.css +++ b/app/static/public/css/chat.css @@ -584,38 +584,6 @@ body { .message-content.rendered > :first-child { margin-top: 0; } - -.message-content.rendered > :last-child { - margin-bottom: 0; -} - -.message-content.rendered .message-image-card { - display: block; - width: 100%; - max-width: min(680px, 100%); - margin: 18px 0 20px; -} - -.message-content.rendered .message-image-card img { - display: block; - width: 100%; - max-width: 100%; - max-height: none; - margin: 0; - border-radius: 16px; - border: 1px solid var(--chat-border); - background: var(--chat-surface); - cursor: zoom-in; -} - -.message-content.rendered .message-image-caption { - margin-top: 8px; - padding: 0 2px; - font-size: 13px; - line-height: 1.45; - color: var(--accents-4); -} - .message-content.rendered .table-wrap { overflow-x: auto; margin: 10px 0; @@ -1886,3 +1854,36 @@ html[data-theme='dark'] .chat-sidebar { display: inline-flex; } } + + +.message-content.rendered > :last-child { + margin-bottom: 0; +} + +.message-content.rendered .message-image-card { + display: block; + width: 100%; + max-width: min(680px, 100%); + margin: 18px 0 20px; +} + +.message-content.rendered .message-image-card img { + display: block; + width: auto; + max-width: 100%; + max-height: 480px; + margin: 0; + border-radius: 16px; + border: 1px solid var(--chat-border); + background: var(--chat-surface); + cursor: zoom-in; + object-fit: contain; +} + +.message-content.rendered .message-image-caption { + margin-top: 8px; + padding: 0 2px; + font-size: 13px; + line-height: 1.45; + color: var(--accents-4); +} diff --git a/config.defaults.toml b/config.defaults.toml index dbe9d38..06f4207 100644 --- a/config.defaults.toml +++ b/config.defaults.toml @@ -25,7 +25,7 @@ thinking = true # 是否动态生成 Statsig 指纹 dynamic_statsig = true # 过滤的特殊标签列表 -filter_tags = ["xaiartifact","xai:tool_usage_card","grok:render"] +filter_tags = ["xaiartifact","xai:tool_usage_card"] # ==================== 代理配置 ====================