使用了七牛的cdn加速,但是同时博客需要支持http和https请求,而使用了cdn以后就会发现提示页面包含其他不安全的资源,锁也由绿锁变成了小黄锁.所以有必要解决下七牛cdn在https下的问题了.

F12查看页面发现警告”The page at ‘https://***‘ was loaded over HTTPS, but displayed insecure content from ‘http://****‘: this content should also be loaded over HTTPS”.
这是因为引用七牛的cdn的链接默认是*.qiniucdn.com,而且无论是用WP Super Cache 还是W3 Total cache,都在一定程度上处理https不完全.(W3直接一堆请求会挂,而WP Super cache在我的博客页面的缩略图在https下仍然走的http)

所以这里本人完全放弃使用插件跑cdn,改用手动的方式.

七牛CDN域名设置

进入七牛cdn,进空间的基本设置里,点击”申请绑定”,添加一条结尾为qbox.me的域名,这时会发现,请求协议是https://dn- 开头的:
qiniu_CDN_setting

把申请绑定的url记下来.

手动设置CDN加速

进入网站目录的wp-content/themes/中,找到当前使用的主题下的function.php文件,在最后面加上下面的代码:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
//七牛云存储
if ( !is_admin() ) {//访问博客前台才调用
	add_action('wp_loaded','test_qiniu_ob_start');

	function test_qiniu_ob_start() {
	        ob_start('test_qiniu_cdn_replace');
	}

	function test_qiniu_cdn_replace($html) {
		//这里替换为你的博客域名
		$local_host = "http://******";
		if ($_SERVER['HTTPS'] != "on") {//判断是否是https请求
		    //这里替换为你绑定的七牛域名,非https的
		    $qiniu_host = "http://*****.qiniudn.com";
		}
		else{
		    //这里替换为你绑定的https的七牛域名,如果https下不想使用cdn,也可以设置为https开头的自己的博客域名
		    $qiniu_host = "https://dn-*****.qbox.me";
		}
	    $cdn_exts   = 'js|css|png|jpg|jpeg|gif|ico';//需要cdn加速的文件的扩展名（使用|分隔）
	    $cdn_dirs   = 'wp-content|wp-includes'; //目录（使用|分隔）

	    $cdn_dirs   = str_replace('-', '\-', $cdn_dirs);

	    if ($cdn_dirs) {
		    $regex	=  '/' . str_replace('/', '\/', $local_host) . '\/((' . $cdn_dirs . ')\/[^\s\?\\\'\"\;\>\<]{1,}.(' . $cdn_exts . '))([\"\\\'\s\?]{1})/';
		    $html =  preg_replace($regex, $qiniu_host . '/$1$4', $html);
	    } else {
		    $regex	= '/' . str_replace('/', '\/', $local_host) . '\/([^\s\?\\\'\"\;\>\<]{1,}.(' . $cdn_exts . '))([\"\\\'\s\?]{1})/';
		    $html =  preg_replace($regex, $qiniu_host . '/$1$3', $html);
	    }
	    return $html;
	}
}

基本信息已经在上面的注释中说明了,根据自己的需要进行替换和修改即可.

此修改方法可以与WP Super Cache插件的缓存功能同时使用,且完美兼容,不打开该插件的cdn功能即可.W3 Total Cache未做测试.

如果博客页面中有引用其他的外部文件的,也可以使用if ($_SERVER[‘HTTPS’] != “on”)进行判断和适当替换.

多说插件在https下的问题

上面的方法也勉强能使多说在https下可用.这里的可用指的是让多说插件能在https下加载了,但是用了多说的页面就会是小黄锁了.

在使用多说插件时,使用上面的方法也将多说的embed.js上传到了七牛的CDN,并且根据判断请求方式来调用,虽然解决了在https下无法加载多说的js的问题.但仍然提示页面包含不安全的资源.因为多说请求头像的图片资源仍然是http的.这个问题还待继续研究解决方案.