收藏
回答

微信公号号调用草稿箱保存文档接口,上传的html会被塞入很多<span leaf>标签导致排版乱序?

相关账号ID
wx3a0c8f967bbcffd7(公众号app_id)

问题现场

(1) 使用方法提交图文,content是富文本

class WeChatDraft(BaseWeChatAPI):
    def add(self, articles):
        """
        新增草稿素材, 原 新增永久图文素材
        用于替换原本的新增永久图文素材 add_articles 方法
        详情参考
        https://developers.weixin.qq.com/doc/offiaccount/Draft_Box/Add_draft.html


        :param articles: 图文素材数组
        :type articles: list[dict]
        :return: 返回的 JSON 数据包
        """
        articles_data = []
        for article in articles:
            articles_data.append(
                {
                    "title": article["title"],
                    "author": article.get("author", ""),
                    "digest": article.get("digest", ""),
                    "content": article["content"],
                    "content_source_url": article.get("content_source_url", ""),
                    "thumb_media_id": article["thumb_media_id"],
                    "need_open_comment": int(article.get("need_open_comment", False)),
                    "only_fans_can_comment": int(article.get("only_fans_can_comment", False)),
                }
            )
        return self._post("draft/add", data={"articles": articles_data})

(2) 富文本的 html 如下

<section style="max-width: 680px; margin: 0 auto; font-family: 楷体, STKaiti, KaiTi, serif; line-height: 1.8; color: #333; font-size:20px;">
    <!-- 引言 -->
    <hr style="border: 0; border-top: 1px solid #ddd; margin: 2em 0;">
    <section style="margin: 1em 0;">
        <strong>当代人都在谈"抗压能力",殊不知三百年前的郑板桥,早已用四句诗道破强者真谛。</strong>  在996成为常态、35岁危机蔓延的今天,这首看似写竹的小诗,藏着让现代人立于不败之地的生存智慧。让我们透过《竹石》,看古人如何把苦难活成养料。
    </section>


    <!-- 诗词 -->
    <section style="border-left: 3px solid #e67e22; padding-left: 1em; margin: 2em 0;">
        <h2 style="font-size:24px; margin: 0 0 0.5em; color: #2c3e50;">《竹石》</h2>
        <p style="font-style: italic; margin: 0 0 1em; color: #7f8c8d;">清代·郑燮</p>
        <section style="line-height: 1.8;">
            
            <p style="margin:0.8em 0;">
                咬定青山不放松,立根原在破岩中。


                千磨万击还坚劲,任尔东西南北风。
            </p>
            
        </section>
    </section>


    <!-- 逐句解读 -->
    
    <section style="margin: 2em 0;">
        <h3 style="font-size:22px; border-bottom: 2px solid #e67e22; padding-bottom: 0.5em; margin: 1em 0;">#01 咬定青山不放松</h3>
        <section style="background: #f5f5f5; padding: 1em; border-radius: 4px; margin: 1em 0;">
            <p style="font-weight: bold; margin: 0 0 0.5em; color: #e67e22;">解读:</p>
            <p style="margin: 0;">开篇即显峥嵘。"咬定"二字力透纸背,这不是优雅的观赏竹,而是带着野性的生存者。如同现代职场人,真正的核心竞争力不是技巧,而是死磕到底的狠劲。</p>
        </section>
        <section style="border: 1px solid #e67e22; padding: 1em; border-radius: 4px; margin: 1em 0;">
            <p style="font-weight: bold; margin: 0 0 0.5em; color: #e67e22;">启发:</p>
            <p style="margin: 0;">那些在裁员潮中屹立不倒的,未必是最聪明的,但一定是目标最坚定的。<strong>当你觉得坚持不下去时,记住:牙齿陷入岩石的深度,决定人生的高度</strong></p>
        </section>
    </section>
    
    <section style="margin: 2em 0;">
        <h3 style="font-size:22px; border-bottom: 2px solid #e67e22; padding-bottom: 0.5em; margin: 1em 0;">#02 立根原在破岩中</h3>
        <section style="background: #f5f5f5; padding: 1em; border-radius: 4px; margin: 1em 0;">
            <p style="font-weight: bold; margin: 0 0 0.5em; color: #e67e22;">解读:</p>
            <p style="margin: 0;">第二句揭示惊人真相——最好的成长环境竟是"破岩"。裂隙中的贫瘠,反而迫使竹根不断向下寻找生机,成就超乎寻常的抓地力。</p>
        </section>
        <section style="border: 1px solid #e67e22; padding: 1em; border-radius: 4px; margin: 1em 0;">
            <p style="font-weight: bold; margin: 0 0 0.5em; color: #e67e22;">启发:</p>
            <p style="margin: 0;">这届年轻人总说"原生家庭决定论",看看岩石里的竹子吧!<strong>真正造就我们的,从来不是顺境里的养分,而是逆境中野蛮生长的渴望</strong></p>
        </section>
    </section>
    
    <section style="margin: 2em 0;">
        <h3 style="font-size:22px; border-bottom: 2px solid #e67e22; padding-bottom: 0.5em; margin: 1em 0;">#03 千磨万击还坚劲</h3>
        <section style="background: #f5f5f5; padding: 1em; border-radius: 4px; margin: 1em 0;">
            <p style="font-weight: bold; margin: 0 0 0.5em; color: #e67e22;">解读:</p>
            <p style="margin: 0;">第三句笔锋陡转,描写持续二十年的摧折。请注意"还"字——不是被动承受,而是越挫越勇的生命反脆弱性。</p>
        </section>
        <section style="border: 1px solid #e67e22; padding: 1em; border-radius: 4px; margin: 1em 0;">
            <p style="font-weight: bold; margin: 0 0 0.5em; color: #e67e22;">启发:</p>
            <p style="margin: 0;">KPI压力、房贷重担、中年危机...这些现代社会的"千磨万击",正在把你锻造成钢筋铁骨。<strong>要感谢那些让你不舒服的磨难,它们都是命运的淬火</strong></p>
        </section>
    </section>
    
    <section style="margin: 2em 0;">
        <h3 style="font-size:22px; border-bottom: 2px solid #e67e22; padding-bottom: 0.5em; margin: 1em 0;">#04 任尔东西南北风</h3>
        <section style="background: #f5f5f5; padding: 1em; border-radius: 4px; margin: 1em 0;">
            <p style="font-weight: bold; margin: 0 0 0.5em; color: #e67e22;">解读:</p>
            <p style="margin: 0;">结句四个方位词,暗喻无常变化。当根基足够深厚,所有风向都成为证明实力的契机,正如台风过境后,唯真材实料者依然挺立。</p>
        </section>
        <section style="border: 1px solid #e67e22; padding: 1em; border-radius: 4px; margin: 1em 0;">
            <p style="font-weight: bold; margin: 0 0 0.5em; color: #e67e22;">启发:</p>
            <p style="margin: 0;">行业风口年年变,从元宇宙到AI浪潮,跟风者疲于奔命。<strong>真正的高手,都在修炼"不变应万变"的底层能力</strong></p>
        </section>
    </section>
    


    <!-- 总结 -->
    <section style="border-left: 3px solid #e67e22; padding: 1em 0 1em 1em; margin: 2em 0;">
        <p style="margin: 0 0 1em; color: #2c3e50;">郑板桥的竹子告诉我们:**顶级抗压能力=明确目标×逆境转化×持续精进×战略定力**</p>
        <ul style="padding-left: 1.2em; margin: 0;">
            
            <li style="margin: 0.8em 0; color: #e67e22;">
                <strong>死磕不是愚勇</strong>:找准值得"咬住"的青山
            </li>
            
            <li style="margin: 0.8em 0; color: #e67e22;">
                <strong>破局需要巧劲</strong>:把限制条件转化为特色优势
            </li>
            
            <li style="margin: 0.8em 0; color: #e67e22;">
                <strong>韧性决定上限</strong>:每天比昨天多扛住1%的压力
            </li>
            
            <li style="margin: 0.8em 0; color: #e67e22;">
                <strong>定力创造奇迹</strong>:在摇摆的世界里做自己的锚点
            </li>
            
            <li style="margin: 0.8em 0; color: #e67e22;">
                在这个充满不确定性的时代,我们都需要把自己活成"竹石模式"——越是风雨如晦,越要野蛮生长。
            </li>
            
        </ul>
    </section>


    <!-- 互动 -->
    <section style="background: #f9f9f9; padding: 1.5em; border-radius: 4px; margin: 2em 0;">
        <p style="margin: 0 0 1em; color: #2c3e50;"><strong>你曾经历过哪些"千磨万击还坚劲"的时刻?</strong></p>
        <ul style="padding-left: 1.2em; margin: 0;">
            
            <li style="margin: 0.8em 0;">是连续加班三个月拿下大项目的夜晚?</li>
            
            <li style="margin: 0.8em 0;">还是房贷车贷压顶仍坚持进修的周末?</li>
            
        </ul>
        <p style="margin: 1em 0 0; color: #7f8c8d;">欢迎在评论区分享你的"竹子时刻",点赞前三名将获赠《逆境成长手册》电子书。</p>
    </section>
</section>

(3) 浏览器视图如下,非常好看

(3) 提交到微信公众号管理后台的草稿如下

(4) 非常丑陋的样式,使用 f12 查看源代码,每个元素的前后都被插入 <span leaf>标签,影响了样式

(5)能不能帮忙解决一下,严重影响了我agent 工程的自动化了


回答关注问题邀请回答
收藏

1 个回答

登录 后发表内容
问题标签