无需插件将网站图片同步到七牛云对象存储加快网站速度!

如果你还在为网站速度过慢而损失掉的客户而懊悔不已,那么首先你就要分析造成网站速度过慢的原因,其中最为常见的一个原因就是网站建设时使用的图片过多或过大,解决这个办法的最好办法就是对网站的所有图片进行无损压缩处理,什么?你觉得这个工程比较巨大,没有太多精力来处理?好吧我们可以无需插件将网站图片同步到七牛云对象存储加快网站速度!

无需插件将网站图片同步到七牛云对象存储加快网站速度
无需插件将网站图片同步到七牛云对象存储加快网站速度

既然用到了七牛云对象存储,当然我们需要一枚七牛云账号,好在目前七牛云对HTTP资源有免费的使用额度,完全够中小型企业网站随意折腾,我会告诉你我有7个七牛云对象存储账号吗…..

OK我们步入正题,注册号账号后我们需要新建一个对象存储器,登陆眼睛不要死盯屏幕正中央,找到右上角的管理控制台,而后点击第一个对象存储方块的立即添加按钮.

无需插件将网站图片同步到七牛云对象存储加快网站速度
无需插件将网站图片同步到七牛云对象存储加快网站速度

接下来你会看到一个简单的对象存储设置表单,很简单非常简单….

无需插件将网站图片同步到七牛云对象存储加快网站速度
无需插件将网站图片同步到七牛云对象存储加快网站速度

接下来你就会看到一个对象存储安静的出现在你的对象存储列表当中

无需插件将网站图片同步到七牛云对象存储加快网站速度
无需插件将网站图片同步到七牛云对象存储加快网站速度

而后我们点击这个新的对象存储后面的域名按钮添加一个你的 已经备案的 域名,设置成功后会给你一条cname链接,去你买域名的地方添加相对应的cname解析.

无需插件将网站图片同步到七牛云对象存储加快网站速度
无需插件将网站图片同步到七牛云对象存储加快网站速度

当解析成功后你就可以用你自己绑定的域名来访问七牛对象存储里的任何文件了.

但我们的目的是无需插件将网站图片同步到七牛云对象存储加快网站速度,那就需要来进一步设置你的七牛对象存储.

点击七牛对象存储列表后面的 设置 按钮 找到镜像回源

无需插件将网站图片同步到七牛云对象存储加快网站速度
无需插件将网站图片同步到七牛云对象存储加快网站速度

打开回源按钮,并填入需要将网站图片同步到七牛云对象存储的域名,其他设置一律爆出不动进行保存.

无需插件将网站图片同步到七牛云对象存储加快网站速度
无需插件将网站图片同步到七牛云对象存储加快网站速度

至此 七牛平台上的设置工作就这样完成了,下面我们来设置网站,将有图片的 div 容器添加一个 ID 属性,这个属性可以随意,还是要求你便于记忆就好,我的实例

<div id="article_body">
<img src="/upload/img/图片路径">
<img src="/upload/img/图片路径">
<img src="/upload/img/图片路径">
<img src="/upload/img/图片路径">
<img src="/upload/img/图片路径">
</div>

很明显我的为一个文章主体的div容器添加了个article_body的ID属性接下来我们来添加一段JS代码,最好将这段代码放到</body>上面,主要原因做网站优化的同学们应该很清楚,因为可以提高网站速度.

<script type="text/javascript">
var imglist=document.getElementById("article_body").getElementsByTagName("img");
for(var i=imglist.length-1;i>=0;i--){
	imglist[i].src="http://你设置的七牛域名"+imglist[i].getAttribute('src');
};
</script>

至此你在访问网站文章时就可以轻松的实现无需插件将网站图片同步到七牛云对象存储加快网站速度,这种方法不仅简单而且可以减少插件的使用,同时对未备案域名的加速效果也相对理想,因为七牛对回源域名是没有备案要求的,所以大可以把未备案域名的资源同步到七牛而后在进行调用,从而达到加快网站速度的效果,最后,你学会了吗?

未经允许不得转载:西德SEO » 无需插件将网站图片同步到七牛云对象存储加快网站速度!

打赏

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏

'); })();