Before using the MinIO + PicList image hosting solution, I have also built my own image hosting platforms such as LanKong Image Hosting, EasyImages2, and Chevereto. However, they are more like temporary solutions for others to use, rather than for personal use, and they are not very intuitive.
The MinIO + PicList solution is simple: MinIO is responsible for storing and providing download links for images, while PicList is used for uploading images and constructing URLs.
Introduction to MinIO as an Image Hosting Platform#
MinIO is an object storage system, which is essentially a network directory that allows you to upload and download files and access them through URLs.
- If we upload an image to MinIO and construct the correct URL, we can display the image on a webpage - image hosting 🎉
- If we upload a video, we can directly play the video on a webpage (assuming the browser supports the video format, such as mp4) - video hosting 🎉
- If we upload an audio file, it becomes an audio hosting platform
- If we upload a regular file, we can use it as a file sharing platform
Installing MinIO: Self-Hosted Object Storage - Building an Efficient and Reliable Data Storage System - Technique Continent (vfly2.com)
Manually uploading and constructing URLs is completely possible. The download link format for uploaded files is as follows (replace the IP or domain name, bucket name "vfly2", and file name "file.name", and note that the port is 9000):
http://ip:9000/vfly2/file.name
For example, if you create a bucket named "imagesbed" in MinIO and upload an image named "vfly2technique.png" to it, the URL of this image would be: http://imgbed.ahfei.blog:9000/imagesbed/vfly2technique.png. You can view the image by accessing this URL in a browser:
When writing an article in Markdown format and wanting to insert this image, you can use the following format:
If you automate the process of uploading and constructing URLs using a tool, it becomes even more convenient. The open-source tool PicList is designed specifically for this purpose.
PicList#
PicList is an efficient cloud storage and image hosting platform management tool, developed based on PicGo. It supports a wide range of storage methods, including WebDAV, S3 API compatible platforms, Tencent COS V5, Github, etc., and also has plugin functionality, with plugins available to support MinIO.
GitHub: Kuingsmile/PicList: An image upload and manage tool, base on PicGo (github.com)
Installing PicList#
Download link: https://github.com/Kuingsmile/PicList/releases. Find and download the desired version.
MacOS users can now use Homebrew to install PicList. Just execute the following command:
brew install piclist --cask
Uninstall command:
brew uninstall piclist
Configuring PicList to Use MinIO as an Image Hosting Platform#
- In the "Plugins" interface, search for "MinIO" and install the plugin by herbertzz. The GitHub address is https://github.com/Herbertzz/picgo-plugin-minio. (You may need to install nodejs first and restart your computer for it to take effect.)
- In the "Image Hosting" section, select "MinIO Image Hosting" and edit the configuration. The following details need to be specified:
- endPoint: The domain name or IP address of the server, ib.ahfei.blog
- port: 443
- useSSL: Whether to enable SSL, select "Enable"
- accessKey: The username set when installing Minio Server, vfly2
- secretKey: The password set previously, pass_vfly2_word
- bucket: The name of the bucket created, imagesbed
- Save the configuration.
- In the "Upload" section, select the image hosting platform and try uploading an image to see if it succeeds (in practice, if the network connection to the server is not good, it is easy to fail for files larger than 1 MB)
Using PicList with Obsidian#
Briefly, this allows for automatic uploading of images to the image hosting platform when dragging them into Obsidian.
- Install the "Image Auto Upload Plugin" in Obsidian.
- Go to the plugin settings page:
- Change the default uploader to
PicGo(app). - Set the
PicGo server upload interfacetohttp://127.0.0.1:36677/upload. - The plugin also supports cloud deletion through PicList. Fill in the deletion interface as
http://127.0.0.1:36677/delete. - Choose other settings as needed.
- Change the default uploader to
- Test by dragging an image into Obsidian.
Video Hosting#
As mentioned earlier, it is simply a matter of constructing the URL for the video file in a specific format. Replace $url with the actual URL:
<video controls> <source src="$url"> not support video tag. </video>
For example, in Obsidian, HTML tags are supported, so inserting the following paragraph will insert the video:
<video controls> <source src="https://ib.ahfei.blog/videobed/lightningrod-vid_wg_720p.mp4"> not support video tag. </video>
If it doesn't display, it's because this platform doesn't support it. You can check the effect on the blog.
Audio Hosting#
This can be used for self-made flashcards in Anki. The format is:
<audio controls> <source src="$url" type="audio/mpeg"> not support audio tag </audio>
For example:
<audio controls> <source src="https://ib.ahfei.blog/audiobed/indulge-23-09-54.mp3" type="audio/mpeg"> not support audio tag </audio>
If it doesn't display, it's because this platform doesn't support it. You can check the effect on the blog.
Sharing Regular Files#
Just learn how to construct the URL. The format is:
http://ip:9000/bucket_name/file.name
Then you can directly download it. Here, I would like to recommend the open-source automatic download tool created by AhFei: Installation Steps for UpdateFetch, a Tool for Periodically Checking and Downloading the Latest Versions of Software - Technique Continent (vfly2.com). It uses MinIO to store files, making it convenient for sharing.
Original article link: https://technique.vfly2.com/2024/03/self-hosted-image-hosting-service/
Copyright notice: All articles on this blog, unless otherwise specified, are original works by AhFei and are licensed under CC BY-NC-SA 4.0. Please indicate the source as Technique Continent (technique.vfly2.com).