Typora+PicGo Core+Chevereto realizes the pictures in the notes are automatically uploaded to the personal server picture bed

Typora installation

  • Typora is a very simple Markdown editor, and its newer version supports image upload service
    Insert picture description here
  • Download Typora can visit its official website to download: click to download Typora

Build a Cheveto image bed on a personal server

  • Cheverto is based on web services, PHP environment and MySQL database support

1. Build a web environment

  • We can use lnmp, lampa key package or panel pagoda like to build a web environment. There are many tutorials on the construction of web environment, so I won’t repeat them here. Here mainly talk about the environment support configuration when building Cheverto

1. Download and install Cheverto

  • There are also many tutorials on the Internet for downloading Cheverto, and there are also on Cheverto's official website. Generally, installer.phpdownloads and GitHubopen source warehouse downloads are commonly used . I used the GitHub repository to download.
    The environment is Ubuntu, but the git commands should all be the same
git clone https://github.com/Chevereto/Chevereto-Free [虚拟主机根目录或者web服务根目录]

No gityou can download and install software manager

sudo apt-get git

2. Server configuration

Yes Apache2, the server uses a virtual host for Cheverto's web service. That is, you can directly access the Cheverto service page through a certain port. Those who don't want to engage in virtual hosting can directly download the content of Cheverto to the root directory of the server. , Generally /var/www/html/, use the command

git clone https://github.com/Chevereto/Chevereto-Free /var/www/html/Cheverto

Virtual host add

The configuration of binding this page to the virtual host is also very simple. The details can be customized by Baidu.
Generally, the /etc/apache2/sites-enabled/000-default.conffollowing content is added to the Apache2 configuration file , mainly DocumenrRootitems. Fill in your Cheverto installation directory here. Other items are not important. Port 8080 is the port number you need to add after the url you want to visit, you can decide which one to use

<VirtualHost *:8080> 
        ServerAdmin image@localhost
        DocumentRoot /var/www/html/Chevereto
        ErrorLog ${APACHE_LOG_DIR}/error.log
        CustomLog ${APACHE_LOG_DIR}/access.log combined
</VirtualHost>

Port monitoring

Add a listener to the port set above , modify it
in the /etc/apache2/ports.conffile

Listen 8080

The default in this file is to monitor port 80, you can refer to its format to add

.htaccess file support

Redirection of directory access and other operations under Cheverto file through .htaccess, access control work requires the support of Apache2's Rewrite module, opening method:

sudo a2enmod rewrite

Support for rewrite in the file directory (can .htaccess work)

In /etc/apache2/apache2.confadd the following in order to allow a local configuration file to read information .htaccess

<Directory /var/www/html/Chevereto>
AllowOverride All
Order allow,deny
Allow from all
Require all granted
</Directory>

Directory permission changes

Cheverto wants to use file upload, access many files in its own directory, and make changes to it, it needs permission

sudo chmod 775 -R /var/www/html/Cheverto/*
sudo chown -R www-data:www-data /var/www/html/Cheverto/*

www-data is the user used for web access

MySQL support

Cheverto's registration and login functions rely on database operations. There are many online tutorials on how to install MySQL and how to associate it with PHP, so I won't repeat them.
We need to create a database for Cheverto for its use

create database cheverto;

PHP extension support

During the installation process, I encountered 3 requirements that did not install the extension

sudo apt-get install php7.2-zip
sudo apt-get install php7.2-mbstring
sudo apt-get install php7.2-gd

The support of these extensions will be reported when you visit Cheverto's homepage, as well as the read and write permissions of the file directory, etc. We can modify the extension library according to the return information of the webpage

register log in

After installing Cheverto, visit the url and follow the previous configuration http://xxx.xxx.xxx.xxx:8080
to register a series of configurations on the page

Download and install PicGo-Core

  • The command line of PicG-Core will only start a process when you need to upload pictures, which does not take up computer space. Of course, you can also refer to the installation of PicGo-app.

Download PicGo-Core in Typora

  • PicGo-Core can also be downloaded through npmto download, but Node,jsthe support of the environment is required
  • Downloading in Typora is very simple.
    Open Typora>>>File>>Preferences>>Image
    Insert picture description here
  • In 上传服务设定selectingPicGo-Core(command line)
  • Click on下载或更新
  • After the download is complete C:\Users\[用户名]\AppData\Roaming\Typora\picgo\win64, you should be able to see the picgp.exeprogram in the directory
  • Add picgo.exethe directory to the environment variable to ensure that you can directly use the picgocommand to run the picgoprogram in the cmd command line
  • Start cmd, enter the picgo install web-uploaderinstallation plug-in, this plug-in is suitable for private server image bed, if you need to use code cloud, GitHub and other warehouses as image bed, you can download the corresponding plug-in

Upload file configuration

  • Click 打开配置文件and paste the following code:
{
    
    
  "picBed": {
    
    
    "current": "web-uploader",
    "web-uploader": {
    
    
      "customBody": "{\"key\":\"图床上传api提供的key\"}",
      "customHeader": null,
      "jsonPath": "image.url",
      "paramName": "source",
      "url": "http://个人服务器Cheverto图床域名或地址/api/1/upload"
    }
  },
  "picgoPlugins": {
    
    
    "[email protected]": true,
    "picgo-plugin-web-uploader": true
  }
}
  • Method of obtaining api key 1

upload picture

Upload test

  • Enter in the cmd command line to picgo upload "测试图片路径"check whether the image is uploaded successfully and whether to return the url
  • Set in Typora
    Insert picture description here
  • Set the custom command to picgo upload, click验证图片上传选项
  • After the upload is successful, it will prompt that the upload is successful and return the image url
    Insert picture description hereInsert picture description hereInsert picture description here

Upload local pictures

Insert picture description here


  1. Go to the homepage of Cheverto Image Bed>>>Management>>>Dashboard>>>Settings>>>Website>>>API Insert picture description hereObtain API_Key ↩︎

Guess you like

Origin blog.csdn.net/qq_37957939/article/details/108031601