该文章介绍的是GHOST博客的图片储存,并不是CDN加速哦!
为什么要用云储存?
1、ghost原本图片上传,图片是保存在
ghost/content/images
目录下面的,也就是说图片保存在自己服务器上面的,万一服务重装系统咋办?万一不小心删掉咋办?是不是就完蛋了!2、一般自己的博客配置比较低,图片加载很占宽带的啊,有免费的云储存的话,压力会减少很多,页面加载就快了,多特么好!
3、博客文章迁移图片是相对路径,那特么是多么头疼的一件事,图片如果是绝对路径,那多好!
这里不会详细介绍云储存注册使用,本文示例是七牛云储存,使用又拍云、阿里云OSS在本文最后有配置介绍。
七牛云官网:http://www.qiniu.com/
又拍云官网:https://www.upyun.com/
阿里云官网:https://www.aliyun.com/
刚开始使用ghost的时候,使用的是中文版的,因为中文版是已经添加了七牛、又拍云、阿里云OSS云储存插件的,依照配置可以直接使用了七牛云储存。
中文版下载地址:
http://www.ghostchina.com/download/
中文版使用就不多说了。
下面说重点!
目前官方版本测试都可以使用,以下方法使用是在0.11.3版本,以后的版本不知道能不能正常使用,下载并且安装完成ghost。
ghost的github:
https://github.com/TryGhost/Ghost
首先安装nodejs的qiniu依赖,在ghost根目录下运行下面命令:
npm install qiniu
使用中文版已经编写好云储存插件:
下载云储存插件代码:
http://oh6t6o35a.bkt.clouddn.com/storage.rar
博客部署完成后,找到ghost/core/server/storage
目录,该目录就是处理上传图片的,解压上面下载的代码,把该目录的代码全部替换。(注意:替换前要做备份哦,万一出错了呢?)
替换完成,接下来就是配置七牛云了,在ghost根目录找到config.js
配置文件,添加以下内容(该配置使用的是七牛云,如果有其他可参考后面的配置):
storage: {
provider: 'qiniu',
bucketname: 'XXXX',//在七牛云创建的bucketname
ACCESS_KEY: 'XXXX',//七牛云的ACCESS_KEY
SECRET_KEY: 'XXXX',//七牛云的SECRET_KEY
root: '/qianxun/',//自定义前缀,随便写也可以
prefix: 'http://XXXX.clouddn.com'//七牛云的域名
}
获取七牛云ACCESSKEY、SECRETKEY:
获取七牛云prefix:
添加玩后完整配置:
var path = require('path'),
config;
config = {
production: {
url: 'http://qianxunclub.com/',
mail: {
from: '[email protected]',
transport: 'SMTP',
host: 'smtp.qq.com',
options: {
port: 465,
service: 'QQ',
auth: {
user: '[email protected]',
pass: 'XXXX'
}
}
},
database: {
client: 'mysql',
connection: {
host : 'XXXX',
user : 'XXXX',
password : 'XXXX',
database : 'XXXX',
charset : 'utf8'
},
debug: false
},
storage: {
provider: 'qiniu',
bucketname: 'XXXX',
ACCESS_KEY: 'XXXX',
SECRET_KEY: 'XXXX',
root: '/qianxun/',
prefix: 'http://XXXX.bkt.clouddn.com'
},
server: {
host: '127.0.0.1',
port: '2368'
}
},
development: {
url: 'http://qianxunclub.com/',
mail: {
from: '[email protected]',
transport: 'SMTP',
host: 'smtp.qq.com',
options: {
port: 465,
service: 'QQ',
auth: {
user: '[email protected]',
pass: 'XXXX'
}
}
},
database: {
client: 'mysql',
connection: {
host : 'XXXX',
user : 'XXXX',
password : 'XXXX',
database : 'XXXX',
charset : 'utf8'
},
debug: false
},
storage: {
provider: 'qiniu',
bucketname: 'ghost',
ACCESS_KEY: 'XXXX',
SECRET_KEY: 'XXXX',
root: '/qianxun/',
prefix: 'http://XXXX.bkt.clouddn.com'
},
server: {
host: '127.0.0.1',
port: '2368'
},
paths: {
contentPath: path.join(__dirname, '/content/')
}
}
};
module.exports = config;
接下里重启就OK了,下面再使用图片上传试试,就会自动上传到七牛云了。
这里我们能看到图片的URL已经是七牛云的图片地址了。
完成!!!!
以下配置依然是storage标签,因为我自己使用的是七牛云,所以一下云储存我自己没有测试使用,如果有问题,可以反馈。
安装nodejs的upyun依赖,在ghost根目录下运行下面命令:
npm install upyun
配置
storage: {
provider: 'upyun',
bucketname: 'XXXX',
username: 'XXXX',
password: 'XXXX',
root: '/image/',
prefix: 'http://XXXX.upaiyun.com'
}
安装nodejs的oss依赖,在ghost根目录下运行下面命令:
npm install oss
配置
storage: {
provider: 'oss',
bucketname: 'XXXX',
ACCESS_KEY: 'XXXX',
SECRET_KEY: 'XXXX',
root: '/image/',
endpoint: 'http://XXXX.aliyuncs.com', //阿里云的上传端点是分地域的,需要单独设置
prefix: 'http://XXXX.aliyuncs.com'
}
作者的git:https://github.com/Minwe/qn-store
这里我就直接复制作者的做法了
npm install ghost-qn-store
创建目录
mkdir content/storage
把插件复制到目录
cp -vR node_modules/ghost-qn-store content/storage/qn-store
在新创建的content/storage
目录里面执行
git clone https://github.com/Minwe/qn-store.git
下载完成进入插件目录安装
cd qn-store
npm install
上面安装完成,就可以在ghost的config.js里面配置插件了
storage: {
active: 'qn-store',
'qn-store': {
accessKey: 'your access key',
secretKey: 'your secret key',
bucket: 'your bucket name',
origin: 'http://xx.xx.xx.glb.clouddn.com',
// timeout: 3600000, // default rpc timeout: one hour, optional
// if your app outside of China, please set `uploadURL` to `http://up.qiniug.com/`
// uploadURL: 'http://up.qiniu.com/'
// file storage key config [optional]
// if `fileKey` not set, Qiniu will use `SHA1` of file content as key.
fileKey: {
// use Qiniu hash as file basename, if set, `safeString` will be ignored
hashAsBasename: false,
safeString: true, // use Ghost safaString util to rename filename, e.g. Chinese to Pinyin
prefix: 'YYYY/MM/', // {String | Function} will be formated by moment.js, using `[]` to escape,
suffix: '', // {String | Function} string added before file extname.
extname: true // keep file's extname
}
// take `外面的世界 x.jpg` as example,
// applied above options, you will get an URL like below after uploaded:
// http://xx.xx.xx.glb.clouddn.com/2016/06/wai-mian-de-shi-jie-x.jpg
}
}
完成!