【高效开发工具系列】云服务器+Nginx自定义图床

💝💝💝欢迎来到我的博客，很高兴能够在这里和您见面！希望您在这里可以感受到一份轻松愉快的氛围，不仅可以获得有趣的内容和知识，也可以畅所欲言、分享您的想法和见解。
img

  • 推荐:kwan 的首页,持续学习,不断总结,共同进步,活到老学到老
  • 导航
    • 檀越剑指大厂系列:全面总结 java 核心技术点,如集合,jvm,并发编程 redis,kafka,Spring,微服务,Netty 等
    • 常用开发工具系列:罗列常用的开发工具,如 IDEA,Mac,Alfred,electerm,Git,typora,apifox 等
    • 数据库系列:详细总结了常用数据库 mysql 技术点,以及工作中遇到的 mysql 问题等
    • 懒人运维系列:总结好用的命令,解放双手不香吗?能用一个命令完成绝不用两个操作
    • 数据结构与算法系列:总结数据结构和算法,不同类型针对性训练,提升编程思维,剑指大厂

非常期待和您一起在这个小小的网络世界里共同探索、学习和成长。💝💝💝 ✨✨ 欢迎订阅本专栏 ✨✨

博客目录

    • 一.基础介绍
      • 1.涉及的软件
      • 2.基本原理
    • 二.实战步骤
      • 1.指定目录
      • 2.上传图片
      • 3.nginx 配置
      • 4.配置解析
      • 5.验证
    • 三.typora 配置
      • 1.图片规则设置
      • 2.原理解析
    • 四.PicGo 设置
      • 1.什么是 PicGo?
      • 2.主要功能
      • 3.插件下载
      • 4.SFTP 上传配置
      • 5.blog_upload.json 详解

一.基础介绍

1.涉及的软件

  • 云服务器 必须
  • nginx 必须
  • Git 必须
  • picgo 非必须
  • typora 非必须

2.基本原理

  1. 将图片上传到云服务的某个目录
  2. 在 nginx 配置文件中,配置静态文件代理
  3. 直接访问服务器代理的静态文件路径可以直接访问上传的图片

二.实战步骤

1.指定目录

在服务器上创建了一个/kwan/img 的层级目录,并且这个目录是跟自己的 git 保存图片的仓库是挂钩的,方便图片持久化,定期同步到 git 仓库中。

mkdir -p /kwan/blogimg

2.上传图片

  1. 通过代码上传
  2. 通过 ftp 上传
  3. 通过 scp 上传
  4. 上传图片到/kwan/blogimg 目录下

3.nginx 配置

# For more information on configuration, see:
#   * Official English Documentation: http://nginx.org/en/docs/
#   * Official Russian Documentation: http://nginx.org/ru/docs/

user nginx;
worker_processes auto;
error_log /var/log/nginx/error.log;
pid /run/nginx.pid;

# Load dynamic modules. See /usr/share/doc/nginx/README.dynamic.
include /usr/share/nginx/modules/*.conf;

events {
    worker_connections 1024;
}

http {
    log_format  main  '$remote_addr - $remote_user [$time_local] "$request" '
                      '$status $body_bytes_sent "$http_referer" '
                      '"$http_user_agent" "$http_x_forwarded_for"';

    access_log  /var/log/nginx/access.log  main;

    sendfile            on;
    tcp_nopush          on;
    tcp_nodelay         on;
    keepalive_timeout   65;
    types_hash_max_size 2048;

    include             /etc/nginx/mime.types;
    default_type        application/octet-stream;

    # Load modular configuration files from the /etc/nginx/conf.d directory.
    # See http://nginx.org/en/docs/ngx_core_module.html#include
    # for more information.
    include /etc/nginx/conf.d/*.conf;

    server {
        listen       80;
	server_name  qinyingjie.top;
        root         /usr/share/nginx/html;
        # Load configuration files for the default server block.
        include /etc/nginx/default.d/*.conf;
        location / {
	       root   html;
    	       index  index.html index.htm;
	       proxy_pass http://127.0.0.1:8080/;
       	}
	location ~ .*\.(gif|jpg|jpeg|png|jfif|webp)$ {
	         root  /kwan/;
                 autoindex    on ;
        }
        error_page 404 /404.html;
            location = /40x.html {
        }

        error_page 500 502 503 504 /50x.html;
            location = /50x.html {
        }
    }

# Settings for a TLS enabled server.
#
#    server {
#        listen       443 ssl http2 default_server;
#        listen       [::]:443 ssl http2 default_server;
#        server_name  _;
#        root         /usr/share/nginx/html;
#
#        ssl_certificate "/etc/pki/nginx/server.crt";
#        ssl_certificate_key "/etc/pki/nginx/private/server.key";
#        ssl_session_cache shared:SSL:1m;
#        ssl_session_timeout  10m;
#        ssl_ciphers PROFILE=SYSTEM;
#        ssl_prefer_server_ciphers on;
#
#        # Load configuration files for the default server block.
#        include /etc/nginx/default.d/*.conf;
#
#        location / {
#        }
#
#        error_page 404 /404.html;
#            location = /40x.html {
#        }
#
#        error_page 500 502 503 504 /50x.html;
#            location = /50x.html {
#        }
#    }

}

4.配置解析

location ~ .*\.(gif|jpg|jpeg|png|jfif|webp)$ {
   root  /kwan/;
         autoindex    on ;
}

这是一个 Nginx 配置段，它使用location指令来匹配以 gif、jpg、jpeg、png、jfif、webp 为扩展名的文件，并在匹配成功时执行相应的指令。下面是对这个配置段的详细解析：

  1. location ~ .*\.(gif|jpg|jpeg|png|jfif|webp)$ {: 这是一个location块，用于匹配请求的 URL。~表示进行正则表达式匹配，而.*\.表示匹配任意字符（包括空字符）后面跟着一个点，最后(gif|jpg|jpeg|png|jfif|webp)是一个正则表达式组，匹配文件扩展名为 gif、jpg、jpeg、png、jfif 或 webp 的请求。$表示匹配字符串的结尾。

  2. root /kwan/;: 当请求匹配成功时，使用/kwan/作为文件根目录。这意味着 Nginx 将在/kwan/目录中寻找匹配请求的文件。

  3. autoindex on;: 启用目录列表功能。如果请求的是一个目录而不是具体的文件，Nginx 将显示该目录下的文件列表。

综合起来，这个配置段的作用是，当用户请求以 gif、jpg、jpeg、png、jfif 或 webp 为扩展名的文件时，Nginx 将在/kwan/目录中查找相应的文件。如果请求的是一个目录，Nginx 将显示该目录下的文件列表。

5.验证

中间省了 nginx 的启动,可以参考以往的 nginx 的安装与启动资料。

#访问图片的连接
http://ip:80/img/xxx.png

三.typora 配置

1.图片规则设置

image-20231129233824094

2.原理解析

在 typora 贴入图片时,会自动上传图片,上传图片的功能由 picgo 软件提供,然后上传的图片优先使用相对路径并自动转义图片的 url。

四.PicGo 设置

1.什么是 PicGo?

PicGo 是一个开源的图片上传工具，它可以帮助用户将本地图片上传到各种图床（图像存储服务）。图床通常是云存储服务，用于存储和托管用户上传的图片，使其能够在互联网上访问。用户可以通过提供的图床配置，将图片上传到特定的云服务中，然后获取图片的外链地址，方便在网页、博客或社交媒体上分享图片。

2.主要功能

PicGo 的主要功能包括：

  1. 支持多种图床： PicGo 支持多个图床的配置，包括但不限于七牛、腾讯云、GitHub 等。用户可以选择他们偏好的图床服务。

  2. 本地上传和截图上传： 用户可以通过 PicGo 界面直接选择本地图片上传，也可以使用截图工具进行截图后上传。

  3. 支持快捷键操作： PicGo 提供了一些快捷键，使用户可以更便捷地进行上传操作。

  4. 自定义命名规则： 用户可以根据自己的需求定义上传后图片的命名规则。

  5. 支持压缩： PicGo 还提供了图片压缩的功能，以减小图片文件大小。

PicGo 的功能和特性可能会在不同版本中有所变化，而且截至我最后更新的时间，可能有新的版本发布。因此，为了获取最新信息，建议查阅 PicGo 的官方文档或相关社区。

3.插件下载

在插件市场中搜索 sftp-uploader 1.3.0,并安装此插件

image-20231129234353816

4.SFTP 上传配置

  1. 设置网站标识,Gbolg,自定义,但是最好跟 json 文件的 key 保持一致
  2. 在本地新建 blog_upload.json 文件,内容如下所示
  3. picgo 指定本地 json 配置文件所在路径
  4. 这样在上传图片的时候,会默认通过 sftp 的方式上传到服务器的指定目录
╰─➤   cat  /Users/qinyingjie/Documents/typora/blog_upload.json
{
  "Gblog": {
    "url": "https://www.qinyingjie.top",
    "path": "/blogimg/{fullName}",
    "uploadPath": "/kwan/blogimg/{fullName}",
    "host": "43.139.90.182",
    "port": "22",
    "username": "root",
    "password": "xxxx"
  }
}

image-20231129235041921

5.blog_upload.json 详解

{
  "Gbolg": {
    "url": "https://www.qinyingjie.top",
    "path": "/blogimg/{fullName}",
    "uploadPath": "/kwan/blogimg/{fullName}",
    "host": "43.139.90.182",
    "port": "22",
    "username": "root",
    "password": "xxxx"
  }
}

这是一个用于配置图床（图像存储服务）的 JSON 格式配置文件。其中的字段含义如下：

**Gblog:**相当于一个名字

  • url: 图床的主要 URL，即图片上传后在云端访问的地址。在这里，是 https://www.qinyingjie.top。

  • path: 上传图片的路径模板，包含一个变量 {fullName} 用于替换为实际的文件名。在这里，是 “/blogimg/{fullName}”。

  • uploadPath: 图片在图床上保存的实际路径。在这里，是 “/kwan/blogimg/{fullName}”。

  • host: SSH（Secure Shell）连接的目标主机 IP 地址或主机名。在这里，是 “43.139.90.182”。

  • port: SSH 连接的端口号。在这里，是 “22”，这是 SSH 协议的默认端口。

  • username: 连接目标主机时使用的用户名。在这里，是 “root”。

  • password: 连接目标主机时使用的密码。在这里，是 “xxxx”。需要注意的是，明文密码在配置文件中是一种潜在的安全风险，更安全的做法是使用 SSH 密钥进行认证而非密码。

这个配置文件描述了如何将图片上传到指定的图床，并提供了与图床服务器的 SSH 连接所需的信息。在使用这个配置文件时，PicGo（或其他类似工具）会使用 SSH 协议将本地图片上传到远程服务器上指定的路径。上传后，图床会生成可公开访问的 URL，用户可以在网页、博客等地方使用这些 URL 来展示图片。

觉得有用的话点个赞 👍🏻 呗。
❤️❤️❤️本人水平有限，如有纰漏，欢迎各位大佬评论批评指正！😄😄😄

💘💘💘如果觉得这篇文对你有帮助的话，也请给个点赞、收藏下吧，非常感谢!👍 👍 👍

🔥🔥🔥Stay Hungry Stay Foolish 道阻且长,行则将至,让我们一起加油吧！🌙🌙🌙

img

欢迎加入 CSDN 红包通知群，红包了领到手软🎁🎁🎁。
image-20231130091921654

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：/a/221729.html

如若内容造成侵权/违法违规/事实不符，请联系我们进行投诉反馈qq邮箱809451989@qq.com，一经查实，立即删除！

相关文章

Oracle-数据库连接数异常上涨问题分析

Oracle-数据库连接数异常上涨问题分析

问题： 用户的数据库在某个时间段出现连接数异常上涨问题，时间持续5分钟左右，并且问题期间应用无法正常连接请求数据库 从连接数的监控上可以看到数据库平常峰值不到100个连接，在问题时间段突然上涨到400以上 问题分析：…
阅读更多...
6页手写笔记总结信号与系统常考知识大题知识点

6页手写笔记总结信号与系统常考知识大题知识点

题型一 判断系统特性题型二 求系统卷积题型三 求三大变换正反变换题型四 求全响应题型五 已知微分方程求系统传递函数题型六 已知系统的传递函数求微分方程题型七 画出系统的零极点图，并判断系统的因果性和稳定性 （笔记适合快速复习，可能会有…
阅读更多...
Spring-AOP

Spring-AOP

目录 一、引入AOP 二、核心AOP概念和术语 三、切点表达式 四、Spring实现AOP （一）AspectJ的支持 1 、基于注解开发 1.1 引入依赖 1.2 实现目标类 1.3 定义切面类（日志管理） 1.4 将目标类和切面类纳入Spring容器 1.5 开…
阅读更多...
分布式搜索引擎（Elastic Search）+消息队列（RabbitMQ）部署

分布式搜索引擎（Elastic Search）+消息队列（RabbitMQ）部署

一、分布式搜索引擎：Elastic Search Elastic Search的目标就是实现搜索。是一款非常强大的开源搜索引擎，可以帮助我们从海量数据中快速找到需要的内容。在数据量少的时候，我们可以通过索引去搜索关系型数据库中的数据，但是如果数…
阅读更多...
MySQL-含json字段表和与不含json字段表查询性能对比

MySQL-含json字段表和与不含json字段表查询性能对比

含json字段表和与不含json字段表查询性能对比 说明: EP_USER_PICTURE_INFO_2:不含json字段表 20200729json_test:含有json字段表 其中20200729json_test 标准ID、MANAGER_NO、PHONE_NO 为非json字段 data为json字段 2个表中MANAGER_NO、PHONE_NO都创建了各自的索引 测试…
阅读更多...
iphone/安卓手机如何使用burp抓包

iphone/安卓手机如何使用burp抓包

iphone 1. 电脑 ipconfig /all 获取电脑网卡ip： 192.168.31.10 2. 电脑burp上面打开设置，proxy，增加一条 192.168.31.10:8080 3. 4. 手机进入设置 -> Wi-Fi -> 找到HTTP代理选项，选择手动，192.168.31.10:8080 …
阅读更多...
gitlab注册无中国区电话验证问题

gitlab注册无中国区电话验证问题

众所周知gitlab对中国区不友好，无法直接注册，页面无法选择86的手机号进行验证码发送。 Google上众多的方案是修改dom，而且时间大约是21年以前。 修改dom，对于现在的VUE、React框架来说是没有用的，所以不用尝试。 直接看…
阅读更多...
the name of a constructor must match the name of the enclosing class

the name of a constructor must match the name of the enclosing class

构造器名匹配封闭类名 命令码的位置关系不对 解决：调整 命令码所在层级
阅读更多...
pandas详细笔记

pandas详细笔记

一：什么是Pandas from matplotlib import pyplot import numpy as np import pandas as pdarange np.arange(1, 10, 2) series pd.Series(arange,indexlist("ABCDE")) print(series)二：索引 三：切片 位置索引切片（左闭…
阅读更多...
排序的概念及其运用

排序的概念及其运用

1.排序的概念 排序：所谓排序，就是使一串记录，按照其中的某个或某些关键字的大小，递增或递减的排列起来的操作。 稳定性：假定在待排序的记录序列中，存在多个具有相同的关键字的记录，若经过排序…
阅读更多...
华清远见嵌入式学习——C++——作业6

华清远见嵌入式学习——C++——作业6

作业要求&#xff1a; 代码&#xff1a; #include <iostream>using namespace std;class Animal { public:virtual void perform() 0;};class Lion:public Animal { private:string foods;string feature; public:Lion(){}Lion(string foods,string feature):foods(foo…
阅读更多...
SpringBoot_02

SpringBoot_02

Web后端开发_07 SpringBoot_02 SpringBoot原理 1.配置优先级 1.1配置 SpringBoot中支持三种格式的配置文件&#xff1a; application.propertiesapplication.ymlapplication.yaml properties、yaml、yml三种配置文件&#xff0c;优先级最高的是properties 配置文件优先级…
阅读更多...
PET（Point-Query Quadtree for Crowd Counting, Localization, and More）

PET（Point-Query Quadtree for Crowd Counting, Localization, and More）

PET&#xff08;Point-Query Quadtree for Crowd Counting, Localization, and More&#xff09; 介绍实验记录训练阶段推断阶段 介绍 论文&#xff1a;Point-Query Quadtree for Crowd Counting, Localization, and More 实验记录 训练阶段 TODO 推断阶段 下面是以一张输…
阅读更多...
图解Spark Graphx实现顶点关联邻接顶点的collectNeighbors函数原理

图解Spark Graphx实现顶点关联邻接顶点的collectNeighbors函数原理

一、场景案例 在一张社区网络里&#xff0c;可能需要查询出各个顶点邻接关联的顶点集合&#xff0c;类似查询某个人关系比较近的都有哪些人的场景。 在用Spark graphx中&#xff0c;通过函数collectNeighbors便可以获取到源顶点邻接顶点的数据。 下面以一个例子来说明&#…
阅读更多...
C语言之程序的组成和元素格式

C语言之程序的组成和元素格式

目录 关键字 运算符 标识符 姓名和标识符 分隔符 常量和字符串常量 自由的书写格式 书写限制 连接相邻的字符串常量 缩进 本节我们来学习程序的各组成元素&#xff08;关键字、运算符等&#xff09;和格式相关的内容。 关键字 在C语言中&#xff0c;相if和else这样的标识…
阅读更多...
Arduino学习笔记2023年11月30日

Arduino学习笔记2023年11月30日

目录 1 编程软件下载2 代码结构3 IO引脚控制3.1 引脚初始化3.2 引脚使用数字量输出数字量输入模拟量输出模拟量输入 4 串口串口初始化串口输出串口输入 5 外部中断6 函数6.1 映射区间函数6.2 延时函数 总结 1 编程软件下载 官网链接&#xff1a;https://www.arduino.cc/ 下载链…
阅读更多...
python学习：opencv+用鼠标画矩形和圆形

python学习：opencv+用鼠标画矩形和圆形

目录 步骤 定义数据 新建一个窗口黑色画布 显示黑色画布 添加鼠标回调函数 循环 一直显示图片 一直判断有没有按下字母 m 关闭所有窗口 鼠标回调函数 步骤 当鼠标按下记录坐标并记录鼠标标记位为true&#xff0c;移动的时候就会不断的画矩形或者圆&#xff0c;松下的时候就再…
阅读更多...
Apache Doris 在某工商信息商业查询平台的湖仓一体建设实践

Apache Doris 在某工商信息商业查询平台的湖仓一体建设实践

本文导读&#xff1a; 信息服务行业可以提供多样化、便捷、高效、安全的信息化服务&#xff0c;为个人及商业决策提供了重要支撑与参考。本文以某工商信息商业查询平台为例&#xff0c;介绍其从传统 Lambda 架构到基于 Doris Multi-Catalog 的湖仓一体架构演进历程。同时通过一…
阅读更多...
CC++内存管理方式

CC++内存管理方式

文章目录 1. C/C内存分布总结 C语言中动态内存管理C内存管理方式new/delete操作内置类型new和delete操作自定义类型c推荐是用new和deleteoperator new与operator delete函数 定位new 1. C/C内存分布 我们先来看下面的一段代码和相关问题 int globalVar 1; static int static…
阅读更多...
用Python手把手教你WordCloud可视化

用Python手把手教你WordCloud可视化

目录 WordCloud是什么&#xff1f; 具体使用 总结 WordCloud是什么&#xff1f; WordCloud是一种数据可视化技术&#xff0c;通过根据文本中单词的频率或权重来生成一个视觉上吸引人的词云图。在词云图中&#xff0c;单词的大小和颜色通常与其在文本中的出现频率相关&#…
阅读更多...
最新文章

Copyright @ 2022~2023