排查并解决因 HTTPS 页面无法加载 HTTP 资源导致七牛图床图片不显示的问题,通过为图床域名配置免费 SSL 证书修复。

缺少SSL,导致七牛图床无法显示

很长一段时间,我的图床一直是残废的状态,也曾多次找寻问题也无果,今天请教了Design+code 群里,遇到了白宦成老师的指导,一下就找到问题,药到病除!

环境说明

我 blog 是托管在 github 上,使用 Gride 本地写完就同步上去。 而图床用的就七牛(免费、香),配合uPic 上传。 传送门 《想写blog,所以需要一个顺手的图床-uPic/iPic + 七牛云》

问题

上传到图床上的图片URL 在浏览器里直接能访问,但只要嵌入到 img 标签里就无法显示,我用了排除法,在其他在线编辑器上也无法显示,说明问题不一定出在我博客配置上。网上也找不到类似的问题(想想应该是我搜索的方向错了😑) WechatIMG10064

解决

估计是我之前不小心给 blog.boyso.com.cn 开了免费的SSL证书,而图床的 img.boyso.net 是没有 SSL 证书的,白宦成老师指出『https 页面无法嵌入不安全的资源(没有 https 的资源)』,一下点醒憨憨的我,

WechatIMG10072

那就很简单了,我看到七牛里就很良心的可以自动申请免费的 SSL证书,而且是一键的,太棒了。 WechatIMG10106

不过就是要每年续费或者重新申请一次 SSL 证书,毕竟... Free 哈😏 配置完后,再看 blog 文件里的图片全正常了。👏👏 WechatIMG10174

BOYSO / RESUME

获取 Resume

添加微信并备注「Resume」,或留下邮箱地址。

添加微信

BOYSO 微信二维码

复制微信号 ·

添加时请备注来意,例如「来一份Resume」。

发到你邮箱

仅用于联系并发送 Resume,不订阅营销邮件。