🐱

WireGuard(VPN)の管理用Webアプリ(GUI)を作ってみた

2024/07/22に公開

WireGuardの管理用Webアプリを開発し、一旦形になったので公開してみました。
WireGuard(VPN)の設定や接続の追加をWeb画面から行えるようにしたものです。

https://github.com/playree/wg-mui
※まだまだ継続して開発中

開発目的

WireGuardでVPNを構築しようとした際に同様のツールが見当たらなかった為、開発してみることにしました。
(今では同様のツール出てきているようですね。

それとWG-MUIはNext.jsで開発しているのですが、Next.jsの最新版(最新機能)を利用する環境(プロトタイプ)としての役割もあります。
なので、なるべく最新機能を取り入れていっています。

WG-MUI

基本的に自らの利用の為に開発を行っていますので、その為の機能開発が優先になっています。
(Googleでログイン、GitLabでログイン、Linode連携、SendGridでメール送信など。

  • Next.jsの最新版で開発
    App Router、Server Components、Server Actionsの利用など。
    積極的に最新機能を利用して開発。
  • 日本語対応
    多言語対応、といっても今のところ日本語と英語。
  • ダークモード対応
  • Googleアカウント、GitLabアカウントと連携(でログイン可能)
  • LinodeとのAPI連携
    Linodeで運用している場合、ネットワーク転送量の情報をアプリ内で表示できます。
  • ユーザー管理
    ユーザーを作成し、ユーザー毎にVPN接続を割り振って管理できます。
  • Wiregurdの設定、操作
    Web画面上からWiregurdの設定や操作が行えます。
  • OSS
    ご自由にお使いください。(ただし利用は自己責任でお願いします。

機能紹介

ドキュメントは別途まとめようと思っていますが、まだ無いので簡単に機能紹介だけ。

ダッシュボード

設定

画面上からWiregurdの起動や停止ができます。
その他各種設定が行えます。

ユーザー管理

ユーザーを作成し、管理することができます。

ピア管理

各ユーザーにピア(VPN接続)を割り振ることができます。

ラベル管理

ラベルを作成し、ユーザーに付与することができます。

ピア(接続)

各ユーザーはピア(接続)メニューから、割り当てられた接続情報を参照できます。

ダークモードに対応

↑の機能紹介で添付しているのがダークモードで、↓が通常モード。

IP固定化のためのVPN構築向けのクラウドサービス

最後にVPN向けのクラウドサービスとしてLinodeを紹介しておきます。

https://www.linode.com/ja/

Linodeはクラウドサービスの中でもコスパが良いというのももちろんあるのですが、VPNにお勧めする理由はデータ転送の無料枠が付いてくるという点にあります。

IP固定化の為のVPNの場合、全ての通信の通過点となるのでデータ転送量にかかる料金を気にする必要があります。
その点Linodeだと無料枠として4TBや5TBのデータ転送量が付いてくるので、枠内なら追加料金はかかりません。
データ転送量の無料枠が付いてくるクラウドサービスってあまり無いんですよね。

Discussion