要求#
自己で記事を書く際には常に MWeb を使用しており、画像をアップロードする際には自前の画像公開サービスを利用しており、七牛の画像ホスティングを使用し、https を有効にしていました。以前はブログのトラフィックが比較的低く、画像も少なかったため、七牛の画像ホスティングによる費用はあまりかかりませんでした。しかし、最近突然七牛から請求書のメールが届き、すでに未払いになっていることに気付きました。https のトラフィックには無料枠がないため、トラフィックが増え、その後の記事で画像が多くなったことで、費用が非常に高くなってしまいました。考えてみると本当に必要ないと思い、https を解除して http に変更しました。
しばらく使用してみると、発生する費用は減りましたが、考えてみると画像ホスティングを GitHub に変更した方が良いのではないかと思いました。便利で無料で、バックアップもできるので、picgo というソフトを使用して画像をアップロードすることにしました。その後の 2 つの記事では画像が少なかったため、大きな問題はありませんでしたが、後に 1 つの記事で画像が 15 枚を超えた際、この方法が本当に面倒だと気付きました。しかし、MWeb 自体は GitHub を画像ホスティングとしてサポートしていませんでした。そこで Google で調べてみると、PicBed4MWebというプロジェクトを見つけ、私の問題を比較的良く解決してくれました。以下に使用方法を簡単に記載します。
プロセス#
プロジェクト設定#
- プロジェクトをローカルディレクトリにダウンロード
git clone https://github.com/gaopeng-hz/PicBed4MWeb.git - 依存関係をインストール
npm install - プロジェクトディレクトリ内の config.json ファイルを変更
以下を参考にしてください
"repo": "gaopeng-hz/images", // リポジトリ名
"token": "xxxx", // トークン、公開しないこと、取得方法は上記の記事を参照
"port": 8081, // nodeサーバーのリスニングポート、デフォルトは8080
"url": "/upload" // サービスのアップロードURL、デフォルトは/upload
- プロジェクトディレクトリで
node index.jsを実行してプロジェクトを起動、ターミナルウィンドウは閉じないでください
MWeb 設定#
MWeb の設定画面を開き - 公開サービス - 画像ホスティング - カスタム
config に基づいて記入を完了してください
右下の検証をクリックしてアップロードサービスが正常かどうか確認できます
アップロード成功時は以下の画像のようになります
正常なアップロード#
- バックグラウンドで実行
nohup node index.js & - 起動時に自動起動
- プロジェクトディレクトリに run.sh ファイルを新規作成し、以下の内容を追加
#!/usr/bin/env bash
# 自分のディレクトリに変更
nohup node /あなたのパス/PicBed4MWeb/index.js &
- ファイルに権限を付与
sudo chmod 777 run.sh - run.sh ファイルの開き方をターミナルに変更
- 起動時に自動起動を追加
システム環境設定 - ユーザーとグループ - ログイン項目 - run.sh ファイルを追加するだけです
拡張内容#
lsof -i :8100 ポートを確認
kill -9 PID プロセスを終了、PID は確認したものに置き換え
ps | grep index.js サービスの PID を確認