当前位置:   article > 正文

服务器搭建图床 + PicGo 配置 + Typora 总结_京东云服务器 搭建图床

京东云服务器 搭建图床

title: 服务器搭建图床 + PicGo 配置 + Typora 总结
date: 2022-03-14 22:12:13
tags:

  • 服务器
  • PicGo
    categories:
  • 其他实践
    cover: https://cover.png
    feature: false

1. 前言

之前用的都是 CSDN 图床,首先本来也会发到 CSDN 上,顺便在自己的网站上也能访问,而且也方便。但最近 CSDN 加了防盗链,全挂了,也因此想自己搭建一个图床

免费图床总归是不靠谱的,所以选择一个付费的好一点,市面上常用的有阿里云 OSS、腾讯云 COS、七牛云等。阿里云 OSS 存储,每个月有 5 GB 的免费存储和流量额度;腾讯云 COS 存储有 6 个月的免费 50 GB 存储额度;七牛云有一定容量的永久免费额度

但是用过后个人总感觉有一定的条件限制,虽然有免费额度,但是后续的存储容量、流量、请求数都要计费,不过阿里云好像不达到一定金额不会算,腾讯云不清楚,虽然作为个人博客而言,价格也不会很高,但自己本身已经有服务器,因此想在自己的服务器上搭一个图床,方便管理和转移,同时也没有其他的限制

2. 服务器搭建图床

2.1 安装 Nginx

首先需要安装 Nginx,以此来启动一个网站服务

见另一篇博客:轻量应用服务器使用总结 的安装 Nginx 部分

2.2 部署配置

1、先创建一个文件夹,用于存储图片,这里我的路径为 /usr/java/fan/images

2、添加一条 img 的二级域名解析记录,主要为了方便管理和查看,后续以 img.域名 作为图床地址,没有域名跳过这步,后续直接使用服务器 IP 也可以

3、给该二级域名申请 SSL 证书

这里需要注意,这一步的目的是给图床服务加上 HTTPS。所以假如你的主域名是付费的泛域名 SSL 证书,那么其下的二级域名都自带 HTTPS 保护,不需要再额外操作。假如是免费的单域名证书,则需要单独给二级域名申请

这一步很重要。因为假如不加上 HTTPS,在使用 HTTPS 的网站(绝大部分都是)上查看图片时,会无法加载。通过 F12 查看请求可以发现默认使用的是 HTTPS 去请求图片的。由于浏览器安全策略的关系,访问不安全(非 HTTPS)的网站需要手动授权允许才能访问

假如是直接访问图片,浏览器会有一个授权提示,选择继续访问即可,但是网站去访问加载图片时则不会,因此会加载失败。虽然先直接访问图片然后手动授权即可正常加载,但是一般用户都不会想到这个原因,而且也很麻烦,不友好。同时本地 Typora 访问时是没有这个授权操作的,直接无法加载,所以得加上 HTTPS

4、进入 Nginx 的 conf 目录,编辑 Nginx 的配置文件 nginx.conf

5、添加 server 配置,server_name 为上面添加的二级域名解析,这里的 root 路径是网站的根目录路径,即上面创建的存储图片文件夹路径,这里使用的是相对路径,以 Nginx 安装目录为起始目录,同时部署上面的 SSL 证书

部署操作见另一篇博客:轻量应用服务器部署 SpringBoot 前后端分离项目 的配置 SSL 证书部分

6、然后启动 Nginx,这里在前面的安装 Nginx 博客里有说到,这里不再赘述

7、此时可以上传一张图片到上面创建的 fan/images 文件夹下,通过 域名/图片名 即可访问

3. PicGo

3.1 下载

GitHub 下载地址:Releases · Molunerfinn/PicGo (github.com)

选择对应系统和位数下载即可

3.2 安装

1、双击打开 exe 文件,选择安装用户

2、选择安装路径,自定义路径即可

3、等待安装完成

3.3 使用

1、下载插件 picgo-plugin-sftp-uploader

2、SFTP 配置

  • 图床配置名:随意定义
  • 网站标识:随意定义
  • 配置文件:为 SFTP 配置文件的路径

3、SFTP 配置文件,在上面的路径下创建对应文件

详细可见官方配置说明:imba97/picgo-plugin-sftp-uploader

{
    // 网站标识
	"Fan": {
        // 图片网站的域名
		"url": "http://img.xxx.xxx",
        // 图片在网址中的路径,即网站根目录下的路径,这里我的网站根目录就是 fan/images
		"path": "/{year}/{month}/{fullName}",
         // 图片在服务器的真实路径
		"uploadPath": "/usr/java/fan/images/{year}/{month}/{fullName}",
        // 一般是服务器 IP
		"host": "124.xxx.xxx.90",
        // 端口
		"port": 22,
        // SSH 用户登录用户
		"username": "username",
        // SSH 用户登录密码
		"password": "password"
	}
}
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19

4、上传文件,选择 SFTP 上传

5、即可在服务器看到上传的文件,文件夹为配置文件配置的路径

6、同时浏览器也可进行访问

4. Typora

在 Typora 的设置里找到图像选项,选择插入图片时上传图片,然后上传服务选择 PicGo,同时选择本地安装的 PicGo.exe 文件

这样在 Typora 插入图片时即可自动上传到服务器上

5. 额外优势

之前使用 OSS 存储时还有一个问题就是,无法直接转存到 CSDN 上,复制内容时,对应的 OSS 图片链接会提示外链转存失败

假如要显示的话只能使用 <img> 格式来引用图片,十分不方便。使用服务器图床就没有这个问题,可以直接转存到 CSDN 上

声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/一键难忘520/article/detail/765209
推荐阅读
相关标签
  

闽ICP备14008679号