jostreff/wireguard-ui
1
0
Fork 0
mirror of https://github.com/ngoduykhanh/wireguard-ui.git synced 2025-06-07 00:46:58 +03:00
Code Issues Projects Releases Packages Wiki Activity Actions

Fix PreUp, PostUp, PreDown, and PostDown

Browse source 
* Escaping HTML in several places.
* Adds PreUp config when one didn't exist.
* Adds environment variable support for PreUp and PreDown.

closes #549
closes #655
closes #656

See also
--------

- https://github.com/samrocketman/addons-homeassistant/issues/9

Co-authored-by: Robert Willert <rwillert@users.noreply.github.com>
This commit is contained in:
Sam Gleske 2025-05-20 18:33:08 -04:00
parent 2fdafd34ca
commit 2084a81297
10 changed files with 55 additions and 22 deletions
Download patch file Download diff file Expand all files Collapse all files

2
README.md
View file

@ -83,7 +83,9 @@ These environment variables are used to control the default server settings used
|-----------------------------------|-----------------------------------------------------------------------------------------------|-----------------|
| `WGUI_SERVER_INTERFACE_ADDRESSES` | The default interface addresses (comma-separated-list) for the WireGuard server configuration | `10.252.1.0/24` |
| `WGUI_SERVER_LISTEN_PORT` | The default server listen port | `51820` |
| `WGUI_SERVER_PRE_UP_SCRIPT` | The default server pre-up script | N/A |
| `WGUI_SERVER_POST_UP_SCRIPT` | The default server post-up script | N/A |
| `WGUI_SERVER_PRE_DOWN_SCRIPT` | The default server pre-down script | N/A |
| `WGUI_SERVER_POST_DOWN_SCRIPT` | The default server post-down script | N/A |
### Defaults for new clients

37
custom/js/helper.js
View file

@ -1,3 +1,10 @@
/*
Hack using jQuery's text() method and a temporary element to escape html()
utilizing jQuery.
*/
function escapeHtml(unsafe) {
return $('<div/>').text(unsafe).html();
}
function renderClientList(data) {
$.each(data, function(index, obj) {
// render telegram button
@ -6,13 +13,13 @@ function renderClientList(data) {
telegramButton = `<div class="btn-group">
<button type="button" class="btn btn-outline-primary btn-sm" data-toggle="modal"
data-target="#modal_telegram_client" data-clientid="${obj.Client.id}"
data-clientname="${obj.Client.name}">Telegram</button>
data-clientname="${escapeHtml(obj.Client.name)}">Telegram</button>
</div>`
}
let telegramHtml = "";
if (obj.Client.telegram_userid && obj.Client.telegram_userid.length > 0) {
telegramHtml = `<span class="info-box-text" style="display: none"><i class="fas fa-tguserid"></i>${obj.Client.telegram_userid}</span>`
telegramHtml = `<span class="info-box-text" style="display: none"><i class="fas fa-tguserid"></i>${escapeHtml(obj.Client.telegram_userid)}</span>`
}
// render client status css tag style
@ -24,13 +31,13 @@ function renderClientList(data) {
// render client allocated ip addresses
let allocatedIpsHtml = "";
$.each(obj.Client.allocated_ips, function(index, obj) {
allocatedIpsHtml += `<small class="badge badge-secondary">${obj}</small>&nbsp;`;
allocatedIpsHtml += `<small class="badge badge-secondary">${escapeHtml(obj)}</small>&nbsp;`;
})
// render client allowed ip addresses
let allowedIpsHtml = "";
$.each(obj.Client.allowed_ips, function(index, obj) {
allowedIpsHtml += `<small class="badge badge-secondary">${obj}</small>&nbsp;`;
allowedIpsHtml += `<small class="badge badge-secondary">${escapeHtml(obj)}</small>&nbsp;`;
})
let subnetRangesString = "";
@ -40,7 +47,7 @@ function renderClientList(data) {
let additionalNotesHtml = "";
if (obj.Client.additional_notes && obj.Client.additional_notes.length > 0) {
additionalNotesHtml = `<span class="info-box-text" style="display: none"><i class="fas fa-additional_notes"></i>${obj.Client.additional_notes.toUpperCase()}</span>`
additionalNotesHtml = `<span class="info-box-text" style="display: none"><i class="fas fa-additional_notes"></i>${escapeHtml(obj.Client.additional_notes.toUpperCase())}</span>`
}
// render client html content
@ -56,12 +63,12 @@ function renderClientList(data) {
<div class="btn-group">
<button type="button" class="btn btn-outline-primary btn-sm" data-toggle="modal"
data-target="#modal_qr_client" data-clientid="${obj.Client.id}"
data-clientname="${obj.Client.name}" ${obj.QRCode != "" ? '' : ' disabled'}>QR code</button>
data-clientname="${escapeHtml(obj.Client.name)}" ${obj.QRCode != "" ? '' : ' disabled'}>QR code</button>
</div>
<div class="btn-group">
<button type="button" class="btn btn-outline-primary btn-sm" data-toggle="modal"
data-target="#modal_email_client" data-clientid="${obj.Client.id}"
data-clientname="${obj.Client.name}">Email</button>
data-clientname="${escapeHtml(obj.Client.name)}">Email</button>
</div>
${telegramButton}
<div class="btn-group">
@ -72,22 +79,22 @@ function renderClientList(data) {
<div class="dropdown-menu" role="menu">
<a class="dropdown-item" href="#" data-toggle="modal"
data-target="#modal_edit_client" data-clientid="${obj.Client.id}"
data-clientname="${obj.Client.name}">Edit</a>
data-clientname="${escapeHtml(obj.Client.name)}">Edit</a>
<a class="dropdown-item" href="#" data-toggle="modal"
data-target="#modal_pause_client" data-clientid="${obj.Client.id}"
data-clientname="${obj.Client.name}">Disable</a>
data-clientname="${escapeHtml(obj.Client.name)}">Disable</a>
<a class="dropdown-item" href="#" data-toggle="modal"
data-target="#modal_remove_client" data-clientid="${obj.Client.id}"
data-clientname="${obj.Client.name}">Delete</a>
data-clientname="${escapeHtml(obj.Client.name)}">Delete</a>
</div>
</div>
<hr>
<span class="info-box-text"><i class="fas fa-user"></i> ${obj.Client.name}</span>
<span class="info-box-text" style="display: none"><i class="fas fa-key"></i> ${obj.Client.public_key}</span>
<span class="info-box-text" style="display: none"><i class="fas fa-subnetrange"></i>${subnetRangesString}</span>
<span class="info-box-text"><i class="fas fa-user"></i> ${escapeHtml(obj.Client.name)}</span>
<span class="info-box-text" style="display: none"><i class="fas fa-key"></i> ${escapeHtml(obj.Client.public_key)}</span>
<span class="info-box-text" style="display: none"><i class="fas fa-subnetrange"></i>${escapeHtml(subnetRangesString)}</span>
${telegramHtml}
${additionalNotesHtml}
<span class="info-box-text"><i class="fas fa-envelope"></i> ${obj.Client.email}</span>
<span class="info-box-text"><i class="fas fa-envelope"></i> ${escapeHtml(obj.Client.email)}</span>
<span class="info-box-text"><i class="fas fa-clock"></i>
${prettyDateTime(obj.Client.created_at)}</span>
<span class="info-box-text"><i class="fas fa-history"></i>
@ -95,7 +102,7 @@ function renderClientList(data) {
<span class="info-box-text"><i class="fas fa-server" style="${obj.Client.use_server_dns ? "opacity: 1.0" : "opacity: 0.5"}"></i>
${obj.Client.use_server_dns ? 'DNS enabled' : 'DNS disabled'}</span>
<span class="info-box-text"><i class="fas fa-file"></i>
${obj.Client.additional_notes}</span>
${escapeHtml(obj.Client.additional_notes)}</span>
<span class="info-box-text"><strong>IP Allocation</strong></span>`
+ allocatedIpsHtml
+ `<span class="info-box-text"><strong>Allowed IPs</strong></span>`

1
model/server.go
View file

@ -22,6 +22,7 @@ type ServerInterface struct {
Addresses []string `json:"addresses"`
ListenPort int `json:"listen_port,string"` // ,string to get listen_port string input as int
UpdatedAt time.Time `json:"updated_at"`
PreUp string `json:"pre_up"`
PostUp string `json:"post_up"`
PreDown string `json:"pre_down"`
PostDown string `json:"post_down"`

2
router/router.go
View file

@ -112,8 +112,10 @@ func New(tmplDir fs.FS, extraData map[string]interface{}, secret [64]byte) *echo
}
// create template list
//"htmlescaper": template.htmlEscaper,
funcs := template.FuncMap{
"StringsJoin": strings.Join,
"attrescaper": util.EscapeHtmlCode,
}
templates := make(map[string]*template.Template)
templates["login.html"] = template.Must(template.New("login").Funcs(funcs).Parse(tmplLoginString))

2
store/jsondb/jsondb.go
View file

@ -64,7 +64,9 @@ func (o *JsonDB) Init() error {
serverInterface := new(model.ServerInterface)
serverInterface.Addresses = util.LookupEnvOrStrings(util.ServerAddressesEnvVar, []string{util.DefaultServerAddress})
serverInterface.ListenPort = util.LookupEnvOrInt(util.ServerListenPortEnvVar, util.DefaultServerPort)
serverInterface.PreUp = util.LookupEnvOrString(util.ServerPreUpScriptEnvVar, "")
serverInterface.PostUp = util.LookupEnvOrString(util.ServerPostUpScriptEnvVar, "")
serverInterface.PreDown = util.LookupEnvOrString(util.ServerPreDownScriptEnvVar, "")
serverInterface.PostDown = util.LookupEnvOrString(util.ServerPostDownScriptEnvVar, "")
serverInterface.UpdatedAt = time.Now().UTC()
o.conn.Write("server", "interfaces", serverInterface)

14
templates/server.html
View file

@ -37,21 +37,26 @@ Wireguard Server Settings
<input type="text" class="form-control" id="listen_port" name="listen_port"
placeholder="Listen Port" value="{{ .serverInterface.ListenPort }}">
</div>
<div class="form-group">
<label for="pre_up">Pre Up Script</label>
<input type="text" class="form-control" id="pre_up" name="pre_up"
placeholder="Pre Up Script" value="{{ .serverInterface.PreUp | attrescaper }}">
</div>
<div class="form-group">
<label for="post_up">Post Up Script</label>
<input type="text" class="form-control" id="post_up" name="post_up"
placeholder="Post Up Script" value="{{ .serverInterface.PostUp }}">
placeholder="Post Up Script" value="{{ .serverInterface.PostUp | attrescaper }}">
</div>
<div class="form-group">
<label for="pre_down">Pre Down Script</label>
<input type="text" class="form-control" id="pre_down" name="pre_down"
placeholder="Pre Down Script" value="{{ .serverInterface.PreDown }}">
placeholder="Pre Down Script" value="{{ .serverInterface.PreDown | attrescaper }}">
</div>
<div class="form-group">
<label for="post_down">Post Down Script</label>
<input type="text" class="form-control" id="post_down" name="post_down"
placeholder="Post Down Script" value="{{ .serverInterface.PostDown }}">
placeholder="Post Down Script" value="{{ .serverInterface.PostDown | attrescaper }}">
</div>
</div>
<!-- /.card-body -->
@ -135,10 +140,11 @@ Wireguard Server Settings
function submitServerInterfaceSetting() {
const addresses = $("#addresses").val().split(",");
const listen_port = $("#listen_port").val();
const pre_up = $("#pre_up").val();
const post_up = $("#post_up").val();
const pre_down = $("#pre_down").val();
const post_down = $("#post_down").val();
const data = {"addresses": addresses, "listen_port": listen_port, "post_up": post_up, "pre_down": pre_down, "post_down": post_down};
const data = {"addresses": addresses, "listen_port": listen_port, "pre_up": pre_up, "post_up": post_up, "pre_down": pre_down, "post_down": post_down};
$.ajax({
cache: false,

6
templates/wake_on_lan_hosts.html
View file

@ -90,7 +90,7 @@
<button type="button"
class="btn btn-outline-primary btn-sm btn_modify_wake_on_lan_host"
data-toggle="modal" data-target="#modal_wake_on_lan_host"
data-name="{{ .Name }}" data-mac-address="{{ .MacAddress }}">Edit
data-name="{{ .Name | attrescaper }}" data-mac-address="{{ .MacAddress }}">Edit
</button>
<button type="button" class="btn btn-outline-danger btn-sm" data-toggle="modal"
data-target="#modal_remove_wake_on_lan_host"
@ -98,7 +98,7 @@
</button>
</div>
<hr>
<span class="info-box-text"><i class="fas fa-address-card"></i> <span class="name">{{ .Name }}</span></span>
<span class="info-box-text"><i class="fas fa-address-card"></i> <span class="name">{{ .Name | attrescaper }}</span></span>
<span class="info-box-text"><i class="fas fa-ethernet"></i> <span class="mac-address">{{ .MacAddress }}</span></span>
<span class="info-box-text"><i class="fas fa-clock"></i>
<span class="latest-used">
@ -120,4 +120,4 @@
{{end}}
{{define "bottom_js"}}
<script src="{{.basePath}}/static/custom/js/wake_on_lan_hosts.js"></script>
{{end}}
{{end}}

1
templates/wg.conf
View file

@ -8,6 +8,7 @@ Address = {{$first :=true}}{{range .serverConfig.Interface.Addresses }}{{if $fir
ListenPort = {{ .serverConfig.Interface.ListenPort }}
PrivateKey = {{ .serverConfig.KeyPair.PrivateKey }}
{{if .globalSettings.MTU}}MTU = {{ .globalSettings.MTU }}{{end}}
PreUp = {{ .serverConfig.Interface.PreUp }}
PostUp = {{ .serverConfig.Interface.PostUp }}
PreDown = {{ .serverConfig.Interface.PreDown }}
PostDown = {{ .serverConfig.Interface.PostDown }}

2
util/config.go
View file

@ -58,7 +58,9 @@ const (
LogLevel = "WGUI_LOG_LEVEL"
ServerAddressesEnvVar = "WGUI_SERVER_INTERFACE_ADDRESSES"
ServerListenPortEnvVar = "WGUI_SERVER_LISTEN_PORT"
ServerPreUpScriptEnvVar = "WGUI_SERVER_PRE_UP_SCRIPT"
ServerPostUpScriptEnvVar = "WGUI_SERVER_POST_UP_SCRIPT"
ServerPreDownScriptEnvVar = "WGUI_SERVER_PRE_DOWN_SCRIPT"
ServerPostDownScriptEnvVar = "WGUI_SERVER_POST_DOWN_SCRIPT"
DefaultClientAllowedIpsEnvVar = "WGUI_DEFAULT_CLIENT_ALLOWED_IPS"
DefaultClientExtraAllowedIpsEnvVar = "WGUI_DEFAULT_CLIENT_EXTRA_ALLOWED_IPS"

10
util/html.go Normal file
View file

@ -0,0 +1,10 @@
package util
import (
"html"
)
func EscapeHtmlCode(s string) string {
encodedString := html.EscapeString(s)
return encodedString
}