Github Pages绑定自定义域名后页面显示异常问题求助

这种情况我碰到过好几次，大概率是资源路径或配置不一致导致的，结合你默认域名正常、自定义域名异常的情况，给你列几个最可能的原因和对应的解决办法：

• 硬编码的资源路径指向旧域名
  很多人在写Jekyll模板时会把图片、CSS、JS的路径直接写死成默认域名（比如https://<myusername>.github.io/assets/style.css），或者用了根路径/assets/style.css但没正确配置Jekyll的站点URL。
  解决办法：

  1. 打开项目根目录的_config.yml，设置url: "https://你的自定义域名"（比如url: "https://www.yourdomain.com"）；
  2. 所有资源路径改用Jekyll的变量或过滤器生成，比如用{{ site.url }}{{ site.baseurl }}/assets/image.jpg，或者更方便的{{ "/assets/image.jpg" | relative_url }}，这样不管域名怎么变，路径都会自动适配。

• CNAME文件配置有误
  检查仓库根目录的CNAME文件，确保里面只包含你的自定义域名（比如www.yourdomain.com），没有多余的空格、换行或者其他字符。另外要注意域名的一致性：如果CNAME里写的是带www的域名，那DNS解析也要对应配置带www的A记录；如果想用不带www的域名，CNAME文件里就写裸域名，同时配置对应的DNS记录，避免混合访问导致资源加载异常。

• HTTPS混合内容拦截
  GitHub Pages默认会为自定义域名开启HTTPS（前提是DNS解析生效），如果你的页面里还有硬编码的HTTP资源链接（比如http://xxx.com/image.jpg），浏览器会因为安全策略拦截这些资源，导致页面样式错乱、图片不显示。
  解决办法：

  1. 确保所有资源链接都用相对路径或者HTTPS绝对路径；
  2. 等DNS解析完全生效后，在GitHub仓库的「Pages」设置里开启「Enforce HTTPS」，强制全站使用HTTPS。

• DNS解析缓存未更新
  刚修改DNS记录后，本地或运营商的DNS缓存可能还没刷新，导致访问时部分资源还是指向旧地址。可以试试清除本地DNS缓存（比如Windows用ipconfig /flushdns，Mac用sudo dscacheutil -flushcache），或者换个浏览器/设备访问，一般等待10-30分钟缓存就会自动更新。

• baseurl配置错误
  如果你用的是用户仓库（即仓库名是<myusername>.github.io），_config.yml里的baseurl应该设为空字符串baseurl: ""，如果之前误设成了/或者其他路径，会导致资源路径多出来不必要的前缀，引发链接失效、图片显示异常。

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