前書き#
現在、MarkDown はプログラマーにとって必須の軽量マークアップ言語として使用されており、リッチテキストエディタを別のプラットフォームに移行する際の手間を省き、技術的な出力に集中することができます。ただし、MarkDown の使用には欠点もあります。それは画像の保存方法です。MarkDown ファイルで画像を使用する場合、リンクである必要があります。各プラットフォームには独自の画像保存方法があり、画像を異なるプラットフォームに公開する場合は、画像を個別にアップロードする必要があります。すべてローカルに保存すると非常に面倒です。
現在、最も良い解決策は、画像を保存するために画像ホスティングサービスを使用することです。
一般的なパブリック画像ホスティングの概要#
画像ホスティング | 説明 |
---|---|
sm.ms | 登録が必要で、海外サーバー【無料】 |
meotu | 登録が必要で、国内サーバー【無料】 |
z4a 画像ホスティング | 登録が必要で、国内サーバー【無料】 |
imgtp | 登録不要で、国内サーバー、最大 15MB まで【無料】 |
imgbed | 登録不要で、国内サーバー、最大 20MB まで【無料】 |
聚合画像ホスティング | 登録が必要で、国内サーバー【無料】 |
牛図ネット | 登録不要で、日本のサーバー【無料】 |
imgbb | 登録不要で、アジア太平洋のサーバー【無料】 |
upload | 登録不要で、海外サーバー【無料】 |
catbox | 登録不要で、海外サーバー【無料】 |
路過画像ホスティング | 登録が必要で、海外サーバー【無料】 |
TG 画像ホスティング | 登録が必要で、国内外のサーバー【無料】 |
Postimages | 登録不要で、海外のサーバー、高速【無料】 |
imgloc | 登録不要で、国内サーバー、最大 6MB まで【無料】 |
映画の妖火画像ホスティング | 登録不要で、集約型 CDN 画像ホスティング【無料】 |
遇見画像ホスティング | 登録不要で、集約型 CDN 画像ホスティング【無料】 |
hello 画像ホスティング | 登録が必要で、国内 CDN【無料】 |
IM.GE | 登録不要で、香港の CDN【無料】 |
クラウド画像ホスティング | グローバル CDN【無料】 |
画像をアップロードする前に、圧縮することをお勧めします。これにより、スペースの使用量が減少し、画像の読み込み速度が向上します。以下は優れた圧縮ツールのいくつかです。
オンラインツール:
TinyPNG は非破壊圧縮であり、Imagestool は損失圧縮ですが、肉眼では 2 つの違いを見分けることはできません。
ローカルツール:
- Format Factory
画像ホスティング管理ツール#
適切な画像ホスティングを選択した後は、画像をアップロードして使用することになります。この時、毎回画像ホスティングにアップロードし、リンクをコピーして、画像を使用するプラットフォームに戻って貼り付ける必要があります。非常に面倒です。そのため、画像ホスティング管理ツールが登場し、画像を迅速にアップロードして画像の URL リンクを取得するのを手助けしてくれます。これにより、自分で操作する手間が省けます。
以下はいくつかの優れた画像ホスティング管理ツールです。
- PicGo 公式ウェブサイト、Github アドレス(Windows システム、Mac システム)
- VScode-PicGo プラグイン
- ShareX 公式ウェブサイト、Github アドレス(Windows システム)
- uPic 公式ウェブサイト、Github アドレス(Mac システム)
- PicUploader 公式ウェブサイト、Github アドレス(Windows システム、Mac システム)
- uPgit(Windows システム、Mac システム、Linux システム)
PicGo を強くお勧めします。PicGo は smms、又拍云、七牛云、阿里云 OSS、腾讯云 COS、微博、Github、Gitee、Amazon S3、カスタムアップロードインターフェース(他のストレージもサポート)をサポートしています。また、画像をアップロードする前に圧縮することもできます。圧縮ツールも省けます。
その他の解決策#
大手企業の無料提供#
ここでは、Jianshu/Blog Garden/Xiaohongshu/Zhihu/Bilibili などのウェブサイトを使用して画像の外部リンクを取得する方法について説明します。これらのウェブサイトは基本的に防盗リンクを持っていますが、速度は非常に速いです。
直接使用:#
上記の一般的な無料画像ホスティングの中で、遇見画像ホスティング
、映画の妖火画像ホスティング
は大手企業のアップロードインターフェースを利用してアップロードすることができます。
ブラウザ拡張機能の推奨:#
- 即刻画像ホスティング(一部のインターフェースはログインが必要です)
- 説明:阿里 / 京東 / 百度 / テンセント / 58 同城 / 美団などのグローバル CDN アクセラレーションをサポートし、HTTPS をサポートします!
- 公式ウェブサイト:https://test2.jiketuchuang.com/
- Bilibili 画像ホスティング
- 説明:Bilibili にアップロードして直リンクを取得します
- ダウンロード: Microsoft Edge Addons
防盗リンクの解決策:#
空のリファラーは、ほとんどの防盗リンクを無視することができます。以下のコードを head に追加します。
<meta name="referrer" content="no-referrer">
または、画像に no-referrer ヘッダーを追加します。
<img src="example.com" referrerPolicy="no-referrer"/>
ただし、個人的には、最適な画像ホスティングはクラウドストレージまたは Baidu の一刻アルバム(少し手間がかかります)であり、大手企業が防盗リンクを強化しても、ローカルにダウンロードできるため、サービスを切り替えることができます。
Github + jsdelivr(おすすめしない)#
jsdelivr は不安定な要素を持っているため、この方法を画像ホスティングとして使用することは非常におすすめしません。また、この方法で画像ホスティングを行うことは、jsdelivr の TOS に違反します。
2. Abusing the service and its resources, or using jsDelivr as a general-purpose file or media hosting service. This includes, for example:
- running an image hosting website and using jsDelivr as a storage for all uploaded images,
- hosting videos, file backups, or other files in large quantities.
We recognize that there are legitimate projects that consist of a large number of files, and these are not considered abuse. For example: icons packs, apps, or games with a large number of assets.
NPM + NPM CDN#
{% link npm 画像ホスティング使用,https://anzhiy.cn/posts/72ea.html, https://img02.anzhiy.cn/adminuploads/1/2022/09/15/63232b7d91d22.jpg %}
backBlazeb2 + cloudflare cdn#
参考:
IPFS 画像ホスティング#
InterPlanetary File System (IPFS) は、分散型の Web、ピアツーピアのハイパーメディアプロトコルです。IPFS は、インターネットをより高速、より安全、よりオープンにすることを目指しています。IPFS プロトコルの目標は、従来の HTTP プロトコルを置き換えることです。
プライベートホスティングサービス#
これには、GitHub には多くのオープンソースプロジェクトがあります。例えば、
- GitHub - lsky-org/lsky-pro: ☁️ 兰空图床 (Lsky Pro) - Your photo album on the cloud.
- GitHub - helloxz/imgurl: ImgURL 是一个简单、纯粹的图床程序,让个人图床多一个选择。
ただし、デプロイコストが非常に高いため、おすすめしません。もしあなたがより良い提案やおすすめの画像ホスティングがある場合は、コメント欄にコメントしてください。
画像を Base64 に変換する#
画像をテキスト形式に変換して保存し、ウェブページや Typora でも表示することができます。
以下はツールの推奨です。
画像を BASE64 エンコードに変換する | 菜鳥ツール
<!--HTMLでのBase64の使用-->
<img width="40" height="30" src="data:image/jpg;base64,/9j/4QMZRXhpZgAASUkqAAgAAAAL...." />
<!--MDでのBase64の使用-->
