在决定保留 A Tour of Go 原有 SPA 架构之后，广告问题从“要不要整页刷新”转变成了“广告应该放在哪里、又该如何跟随 SPA 页面生命周期”。本文记录了从 AdSense Preview 识别 footer 下方候选广告位，到方案 A 使用 MutationObserver 跟踪 DOM 变化，再到方案 B 将广告直接绑定 Angular route-owned course view 生命周期的完整演进。最终通过 mount() / $destroy / unmount() 管理每一页独立广告节点，并保留 Auto Ads 继续服务其他已正常运行的站点和域名。
网站升级至 HTTPS 协议后，百度和阿里妈妈的广告嵌入出现未显示问题。经分析，原因为嵌入代码中仍包含 HTTP 网址，导致浏览器拦截不安全脚本。解决方法是将代码中的 HTTP 地址替换为 HTTPS 地址。修改后，百度与阿里妈妈广告均可成功显示，且网页不再提示安全风险，问题得到解决。
👨💻 个人品牌
王世强｜PHP / Go 技术顾问
15+ 年 Web 后端开发经验，专注于系统维护、架构优化、性能调优及 Linux 运维。
持续运营技术博客 10+ 年，累计发布 1000+ 篇原创技术文章。
为创业团队、中小企业及独立开发者提供长期技术支持与远程合作服务。
.env (14) 404 (13) add (16) AI 翻译 (30) Apache (13) Array (19) A Tour of Go (52) Cache (13) CentOS (23) ChatGPT (19) ChatGPT Plus (14) chrome (19) Cloudflare (29) Codex (17) composer (42) composer.json (22) composer install (13) composer update (14) console (16) Container (25) curl (15) delete (31) Docker (32) Dockerfile (15) EdgeOne (31) environment variable (19) error (24) file (15) filter (20) Git (27) GitHub (23) Gitlab (15) GLM-5.2 (26) Go (54) go-tour-i18n (14) Google AdSense (23) Go 语言 (23) GraphQL (24) GraphQL API (14) Gutenberg (34) http (21) https (22) Interface (19) Jquery (13) json (24) Laravel (37) Laravel 6 (55) Laravel 9 (25) Lighthouse (17) Lighthouse 5 (14) Linux (21) Migrate (13) Module (17) MySQL (78) MySQL 5.7 (22) Nginx (63) normalize.css (28) OKX (15) OneinStack (21) PHP (67) php-fpm (18) php.ini (24) PHP 7.1.12 (22) PHP 7.4 (26) phpmyadmin (15) PhpStorm (24) Polylang (57) postman (18) Query (17) queue (16) Rancher (24) Redis (49) response (13) RESTful (27) RESTful API (23) Shell (13) Shopify (19) SlyTranslate (20) SQL (24) String (14) TortoiseGit (14) Twenty Twenty-Five (20) Ubuntu (40) update (20) VPN (17) W3 Total Cache (35) Windows 10 (46) WireGuard (27) WordPress (126) WPCode (23) Wstunnel (14) Yii (40) Yii 2 (70) Yii 2.0 (51) 多语言翻译 (31) 技术博客 (15) 故障排查 (14) 数据库迁移 (16) 浏览器 (14) 阿里云 (19)
