feat: support web tool (#11)

supercaracal · Feb 10, 2024 · 7233f02 · 7233f02
1 parent 1f2a5c9
commit 7233f02
Show file tree

Hide file tree

Showing 10 changed files with 681 additions and 2 deletions.
diff --git a/Makefile b/Makefile
@@ -6,6 +6,9 @@ CGO_ENABLED ?= $(shell go env CGO_ENABLED)
 cmd/tool/encrypt: cmd/tool/main.go
 	GOOS=${GOOS} GOARCH=${GOARCH} CGO_ENABLED=${CGO_ENABLED} go build -ldflags="-s -w" -trimpath -o $@ $^
 
+docs/encrypt.wasm: cmd/wasm/main.go
+	GOOS=js GOARCH=wasm CGO_ENABLED=0 go build -ldflags="-s -w" -trimpath -o $@ $^
+
 test:
 	@go clean -testcache
 	@go test -race ./...
@@ -16,4 +19,4 @@ lint:
 clean:
 	@rm -rf cmd/tool/encrypt
 
-.PHONY: cmd/tool/encrypt test lint clean
+.PHONY: cmd/tool/encrypt docs/encrypt.wasm test lint clean
diff --git a/README.md b/README.md
@@ -4,7 +4,7 @@
 SCRAM-SHA-256
 ===============================================================================
 
-This is a password-encryption tool for PostgreSQL with SCRAM-SHA-256.
+This is a password-encryption tool for PostgreSQL with [SCRAM-SHA-256](https://www.postgresql.org/docs/current/auth-password.html).
 
 ## Installation
 Please download an executable file from [release pages](https://github.com/supercaracal/scram-sha-256/releases).

diff --git a/cmd/wasm/main.go b/cmd/wasm/main.go
@@ -0,0 +1,32 @@
+//go:build wasm
+// +build wasm
+
+package main
+
+import (
+	"syscall/js"
+
+	"github.com/supercaracal/scram-sha-256/pkg/pgpasswd"
+)
+
+func handleButton(this js.Value, inputs []js.Value) interface{} {
+	document := js.Global().Get("document")
+	input := document.Call("getElementById", "raw-password")
+	result := document.Call("getElementById", "encrypted-password")
+
+	rawPassword := input.Get("value").String()
+
+	if encrypted, err := pgpasswd.Encrypt([]byte(rawPassword)); err != nil {
+		result.Set("value", err.Error())
+	} else {
+		result.Set("value", encrypted)
+	}
+
+	return nil
+}
+
+func main() {
+	button := js.Global().Get("document").Call("getElementById", "encryption-button")
+	button.Call("addEventListener", "click", js.FuncOf(handleButton))
+	select {}
+}
diff --git a/docs/encrypt.wasm b/docs/encrypt.wasm
diff --git a/docs/favicon.ico b/docs/favicon.ico
diff --git a/docs/index.html b/docs/index.html
@@ -0,0 +1,23 @@
+<!DOCTYPE html>
+<html lang="ja">
+<head>
+  <meta charset="utf-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
+  <title>scram-sha-256</title>
+  <link rel="shortcut icon" type="image/x-icon" href="/scram-sha-256/favicon.ico" />
+  <link rel="stylesheet" media="all" href="/scram-sha-256/style.css" />
+  <script src="/scram-sha-256/wasm_exec.js"></script>
+  <script src="/scram-sha-256/script.js"></script>
+</head>
+<body>
+  <div class="block">
+    <input type="password" value="" id="raw-password" />
+    <input type="button" value="encrypt" id="encryption-button" />
+  </div>
+  <div class="block">
+    <input id="encrypted-password" value="" readonly />
+  </div>
+  <div class="block">
+    <span><a href="https://github.com/supercaracal/scram-sha-256">GitHub</a></span>
+  </div>
+</body>
diff --git a/docs/script.js b/docs/script.js
@@ -0,0 +1,9 @@
+"use strict";
+
+window.addEventListener('load', (event) => {
+  const go = new Go();
+
+  WebAssembly
+    .instantiateStreaming(fetch('/scram-sha-256/encrypt.wasm'), go.importObject)
+    .then((result) => go.run(result.instance));
+});
diff --git a/docs/server.go b/docs/server.go
@@ -0,0 +1,36 @@
+package main
+
+import (
+	"fmt"
+	"net/http"
+)
+
+const (
+	appName = "scram-sha-256"
+)
+
+var (
+	staticFiles = []string{
+		"encrypt.wasm",
+		"favicon.ico",
+		"script.js",
+		"style.css",
+		"wasm_exec.js",
+	}
+)
+
+func makeStaticHandler(f string) func(http.ResponseWriter, *http.Request) {
+	return func(w http.ResponseWriter, r *http.Request) {
+		http.ServeFile(w, r, f)
+	}
+}
+
+func main() {
+	http.HandleFunc("/", makeStaticHandler("index.html"))
+
+	for _, f := range staticFiles {
+		http.HandleFunc(fmt.Sprintf("/%s/%s", appName, f), makeStaticHandler(f))
+	}
+
+	http.ListenAndServe(":3000", nil)
+}
diff --git a/docs/style.css b/docs/style.css
@@ -0,0 +1,15 @@
+body {
+  background-color: #555555;
+}
+
+div.block {
+  margin-top: 10px;
+}
+
+input#raw-password {
+  width: 480px;
+}
+
+input#encrypted-password {
+  width: 1280px;
+}