hexo部署到服务器之后图片无法访问问题

hexo部署到服务器之后图片无法访问问题

问题描述:

hexo本地截图之类的图片,本地部署可以访问,但是部署到服务器之后无法显示,因为图片并没有传到服务器上面或者路径有问题。

解决办法:

首先:安装一个图片路径转换的插件,这个插件名字是hexo-asset-image

npm install hexo-asset-image --save

但是这个插件的内容需要修改【不然可能会出Bug】

打开/node_modules/hexo-asset-image/index.js,将内容更换为下面的代码

'use strict';
var cheerio = require('cheerio');

// http://stackoverflow.com/questions/14480345/how-to-get-the-nth-occurrence-in-a-string
function getPosition(str, m, i) {
   
   
  return str.split(m, i).join(m).length;
}

var version = String(hexo.version).split('.');
hexo.extend.filter.register('after_post_render', function(data){
   
   
  var config = hexo.config;
  if(config.post_asset_folder){
   
   
    	var link = data.
### 部署 Hexo 到云服务器 Hexo 是一种快速、简洁且高效的静态博客框架,通常用于构建个人博客或技术文档。以下是关于如何将 Hexo 博客部署到云服务器的相关说明。 #### 1. 准备工作 在开始之前,需要确保本地环境已经配置好必要的工具和依赖项。这包括 Node.js 和 Git 的安装[^4]。如果尚未完成这些步骤,则需先按照官方指南或其他资源中的方法进行设置。 对于云端部分,可以选用多种类型的主机服务提供商,比如阿里云 ECS 实例、腾讯云 CVM 或 AWS EC2 等实例作为目标机器运行环境。此外还需要确认该虚拟机操作系统版本以及开放端口情况是否满足条件访问需求。 #### 2. 修改 `_config.yml` 文件 为了实现自动化发布功能,在项目的根目录下编辑 `blog/_config.yml` 文件时应加入如下字段定义: ```yaml deploy: type: git repo: github: git@github.com:<username>/<username>.github.io.git,master coding: git@git.coding.net:<username>/<username>.git,master ``` 上述代码片段展示了两种可能的目标仓库地址——GitHub Pages 及 Coding 平台上的私有存储库链接;实际操作过程中只需保留其中一个有效路径即可[^1]。 #### 3. 使用 SSH 密钥认证方式连接远程服务器 考虑到安全性因素,建议通过基于公私密钥对的身份验证机制代替传统密码登录形式来管理与各平台间的数据交换过程。具体做法可参照相关手册创建专属用户的SSH key,并将其添加至对应服务商账户下的授权钥匙列表里头去。 #### 4. 设置自定义域名(可选) 如果有计划绑定个性化网址的话,那么除了正常购买注册之外还需调整DNS解析记录指向新购置的空间IP地址上。与此同时启用HTTPS加密传输协议也是提升用户体验不可或缺的一环,借助Let's Encrypt免费证书或者第三方CDN加速节点如Cloudfalre都可以轻松达成目的。 #### 5. 自动化流程优化提议 随着项目规模扩大和技术栈更新迭代速度加快,手动执行命令难免显得繁琐低效。因此借鉴其他开发者经验教训后推荐尝试引入CI/CD流水线概念简化日常运维事务负担。例如利用 GitHub Actions 来替代原有单纯依靠 hexo-deployer-git 插件单独处理的方式,从而达到更灵活可控的效果[^2]。 ```yaml name: Deploy Blog via GH Action on: push: branches: - main jobs: build-and-deploy: runs-on: ubuntu-latest steps: - name: Checkout code uses: actions/checkout@v2 - name: Setup NodeJS environment uses: actions/setup-node@v2 with: node-version: '16' - run: npm install - run: npm run generate # or whatever your command is called - name: Deploy to Server env: PRIVATE_KEY: ${{ secrets.SSH_PRIVATE_KEY }} run: | mkdir -p ~/.ssh/ echo "$PRIVATE_KEY" | tr -d '\r' > ~/.ssh/id_rsa chmod 600 ~/.ssh/id_rsa ssh-keyscan example.com >> ~/.ssh/known_hosts rsync --archive --compress --progress _site/* user@example.com:/path/to/webroot/ ``` 以上脚本示范了一个完整的持续集成管道设计思路,涵盖了从检出源码直至最终同步生成产物整个生命周期内的各个环节要点。 ---
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

JiangPengCode

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值