美文网首页关于hexo自由世界Hexo
Hexo搭配七牛存储图片等媒体资源

Hexo搭配七牛存储图片等媒体资源

作者: SkyHive | 来源:发表于2017-02-15 12:58 被阅读362次

今天把博客的图片存储搞了一下,利用的七牛存储。
七牛 是一个云存储服务商,注册并实名认证之后后,你将免费享有 10GB 存储空间,每月 10GB 下载流量、100 万次 GET 请求、 10 万次 PUT/DELETE 请求。如果想要注册可以点击这里,这样可以为我增加每月5GB的容量。
注册完成之后就可以进行创建空间了,注意我们添加的资源为对象存储,访问控制为公开空间

添加资源 公开空间

然后点击右上角进入密钥管理,复制当前使用的AK和SK,配置的时候会用得到
下面我们会用到一个叫做的hexo-qiniu-sync的插件,首先在hexo主目录下安装:

npm install hexo-qiniu-sync - -save

然后把配置信息添加到_config.yml中

plugins:
  - hexo-qiniu-sync

#七牛云存储设置
##offline       是否离线. 离线状态将使用本地地址渲染
##sync          是否同步
##bucket        空间名称.
##access_key    上传密钥AccessKey
##secret_key    上传密钥SecretKey
##secret_file   秘钥文件路径,可以将上述两个属性配置到文件内,防止泄露,json格式。绝对路径相对路径均可
##dirPrefix     上传的资源子目录前缀.如设置,需与urlPrefix同步 
##urlPrefix     外链前缀.
##up_host      上传服务器路径,如选择华北区域的话配置为http://up-z1.qiniu.com
##local_dir     本地目录.
##update_exist  是否更新已经上传过的文件(仅文件大小不同或在上次上传后进行更新的才会重新上传)
##image/js/css  子参数folder为不同静态资源种类的目录名称,一般不需要改动
##image.extend  这是个特殊参数,用于生成缩略图或加水印等操作。具体请参考http://developer.qiniu.com/docs/v6/api/reference/fop/image/ 
##              可使用基本图片处理、高级图片处理、图片水印处理这3个接口。例如 ?imageView2/2/w/500 即生成宽度最多500px的缩略图
qiniu:
  offline: false
  sync: true
  bucket: bucket_name
  secret_file: sec/qn.json or C:
  access_key: AccessKey
  secret_key: SecretKey
  dirPrefix: static
  urlPrefix: http://bucket_name.qiniudn.com/static
  up_host: http://upload.qiniu.com
  local_dir: static
  update_exist: true
  image: 
    folder: images
    extend: 
  js:
    folder: js
  css:
    folder: css

其中各个参数在插件的README文件中都有详细的介绍,按照github上的教程一步一步来是很简单的。

然后在hexo主目录下创建本地目录(该目录要和配置中local_dir参数保持一致),然后创建iamges、js、css子目录,这样基本的配置就完成了

下面就可以在你的文章中试着插入图片了,比如你想引用在你/local_dir/images/下的图片1.png

{% qnimg 1.png %}

更高级的用法请参考github上的说明。

下面进行同步,插件原来给出的命令是 hexo s 即可同步至七牛空间,这里的s表示的是sync,但是这个与hexo 原有的s(server)产生冲突,所以有了第二种方法

hexo qiniu s

将七牛的插件配置好后我写了一篇博客试一试效果,结果发现怎么也没法部署到github,每次hexo d都会出现

ERROR Deployer not found: git

这样的报错,Google了半天都没有找到解决的办法,最后在找到了github上的一条issue,终于发现了解决办法:只要将配置文件_config.yml中plugins的那段给注释掉就OK了,即

#plugins:
#- hexo-qiniu-sync

还是希望开发者能早点修改文档吧,不然还真的挺容易出事,不过说一句,我的Hexo是3.2.2的版本的,不知道2.x版本会不会出现类似的情况

相关文章

  • Hexo搭配七牛存储图片等媒体资源

    今天把博客的图片存储搞了一下,利用的七牛存储。七牛 是一个云存储服务商,注册并实名认证之后后,你将免费享有 10G...

  • hexo博客图片问题

    15年开始用hexo搭建博客,开始的时候觉得还不错。用着用着感觉图片是一个问题。最开始的时候用七牛来存储图片。 图...

  • springboot+jpa+redis+quzartz+ela

    图片上传 图片存储在七牛云对象存储中,所以首先配置七牛云sdk pom.xml application.yml 七...

  • 配置七牛云存储自定义 CDN 加速域名

        七牛云是我们常用的对象存储服务商,项目中一些图片等静态文件我们可以存储在七牛云中,这样项目运行时可以减少服...

  • Node开箱即用的服务端基本配置

    本文采用Express作为服务端框架,通过配置Token、七牛云对象存储(存储图片、视频等)、后端跨域、MySQL...

  • js 百度编辑器 图片上传

    图片上传方案: 目前来说,Web端基于七牛等云存储的图片上传方式分为以下两种: 上传图片至服务端,再将数据转发至七...

  • 七牛Portal后台学习

    一、总目录 1,资源主页 资源主页:用于添加七牛各个产品模块,包含有:对象存储、自定义数据处理V2、多媒体处理、融...

  • 七牛云图床链接失效解决方案

    问题 七牛云的测试连接失效,hexo博客上的图片都不能显示 1.下载七牛云中保存的图片 参照官网 命令行辅助工具(...

  • 107 七牛云存储

    上传图片到七牛云存储 步骤1:maven配置,增加七牛的sdk 步骤2:运行七牛的官方Demo 其他 Idea设置...

  • Django上传图片到七牛云存储

    七牛云可以帮助服务器转存图片等数据,类似于Dropbox等存储服务,专注文件存储的第三方服务商,服务较好。最近做到...

网友评论

    本文标题:Hexo搭配七牛存储图片等媒体资源

    本文链接:https://www.haomeiwen.com/subject/ptlqwttx.html