feat: add basic authentication and directory creation functionality

Author: Tian Xiaoqiang

.github/workflows/release.yml

@@ -0,0 +1,61 @@
+name: Release
+
+on:
+  push:
+    tags:
+      - 'v*'
+
+permissions:
+  contents: write
+
+jobs:
+  release:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+
+      - uses: actions/setup-go@v5
+        with:
+          go-version: '1.23'
+
+      - uses: actions/setup-node@v4
+        with:
+          node-version: '20'
+
+      - name: Install frontend dependencies
+        run: yarn install --frozen-lockfile
+
+      - name: Build frontend
+        run: yarn build web
+
+      - name: Build binaries
+        run: |
+          VERSION=${GITHUB_REF#refs/tags/}
+          LDFLAGS="-s -w -X main.version=${VERSION}"
+
+          targets=(
+            "linux/amd64"
+            "linux/arm64"
+            "darwin/amd64"
+            "darwin/arm64"
+            "windows/amd64"
+          )
+
+          mkdir -p dist
+
+          for target in "${targets[@]}"; do
+            os="${target%/*}"
+            arch="${target#*/}"
+            output="dist/fileserver-${VERSION}-${os}-${arch}"
+            if [ "$os" = "windows" ]; then
+              output="${output}.exe"
+            fi
+            echo "Building ${os}/${arch}..."
+            GOOS=$os GOARCH=$arch go build -ldflags "$LDFLAGS" -o "$output" .
+          done
+
+      - name: Create Release
+        uses: softprops/action-gh-release@v2
+        with:
+          generate_release_notes: true
+          files: dist/*

README.md

@@ -5,20 +5,58 @@ The `fileserver` can be used as a static file server to share your file and also
 ## Features
 - Directory index
 - File download
-- File upload
+- File upload (batch upload supported)
+- Directory creation
 - HTTPS supported
+- Basic Auth
 - Web UI
 - JSON API
 
 ## Usage
+
+### Start the server
+
+```bash
+# Basic usage
+./fileserver -port 8880 -basedir /path/to/files
+
+# With basic auth
+./fileserver -port 8880 -basedir /path/to/files -user admin -pass secret
+
+# With TLS
+./fileserver -port 8443 -basedir /path/to/files -tls-cert cert.pem -tls-key key.pem
+
+# With TLS and basic auth
+./fileserver -port 8443 -basedir /path/to/files -tls-cert cert.pem -tls-key key.pem -user admin -pass secret
+```
+
+#### Flags
+
+| Flag       | Default | Description                  |
+|------------|---------|------------------------------|
+| `-port`    | `8880`  | Which port to listen on      |
+| `-basedir` | `.`     | Which directory to serve     |
+| `-tls-cert`| `""`    | TLS cert file location       |
+| `-tls-key` | `""`    | TLS key file location        |
+| `-user`    | `""`    | Basic auth username          |
+| `-pass`    | `""`    | Basic auth password          |
+
+> When `-user` and `-pass` are both set, all requests (WebUI and API) require HTTP Basic Authentication.
+
 ### API usage
+
+When basic auth is enabled, add `-u user:pass` to all curl commands.
+
 **File upload - Using default file name**
 
 Following command will upload the `img.png` to the directory `/image/a/b/c/` on the file server and produces a file named `img.png`.
  ```bash
  $ curl -T img.png http://localhost:8880/image/a/b/c/
  $ # or
  $ curl -F 'file=@img.png' http://localhost:8880/image/a/b/c/
+
+ # With basic auth
+ $ curl -u admin:secret -T img.png http://localhost:8880/image/a/b/c/
  ```
 
 **File upload - Specify file name**
@@ -30,33 +68,60 @@ Following command will upload the `img.png` to the directory `/image/a/b/c/` on
  $ curl -F 'file=@img.png' http://localhost:8880/image/a/b/c/another.png
  ```
 
-> Note: 
+> Note:
 > 1. If the specified directory does not exist on the file server, this directory will be created first.
 > 2. If the file to be uploaded already exists on the file server, the file will be overwritten.
 
+**Create directory**
+```bash
+$ curl -X POST 'http://localhost:8880/path/to/?action=mkdir&name=new-folder'
+
+# With basic auth
+$ curl -u admin:secret -X POST 'http://localhost:8880/path/to/?action=mkdir&name=new-folder'
+```
+
 **File download**
 ```bash
 $ curl http://localhost:8880/image/a/b/c/another.png
+
+# With basic auth
+$ curl -u admin:secret http://localhost:8880/image/a/b/c/another.png
+```
+
+**List directory (JSON)**
+```bash
+$ curl http://localhost:8880/path/to/dir/
+
+# With basic auth
+$ curl -u admin:secret http://localhost:8880/path/to/dir/
 ```
 
 ### UI usage
+
 **Directory index**
 
 The directory index access URL is the same as the API's access URL(Such as `http://localhost:8880/image/a/b/c/`). Just type the URL in the browser, and you'll see what's inside.
 
 > ![Index](_img/index.png)
 
-**File upload**
+**File upload (batch)**
+
+Click the "Upload" button to open the upload dialog. You can drag and drop or select multiple files for batch upload.
+
 > ![Upload](_img/upload.png)
 
+**Create directory**
+
+Click the "New Folder" button to create a new directory in the current path.
+
 ## Build
 ```bash
 $ make build
 ```
-It will be output a binary in the `tmp` directory named with `fileserver`
+It will output a binary in the `tmp` directory named `fileserver`.
 
 ## Development
 ```bash
 $ make dev
 ```
-It will run a air server to watch code change and reload the server.
+It will run an air server to watch code change and reload the server.

main.go

@@ -3,30 +3,37 @@ package main
 import (
 	"flag"
 	"fmt"
-	"github.com/aix3/fileserver/server"
 	"net/http"
 	"runtime/debug"
+
+	"github.com/aix3/fileserver/server"
 )
 
 type config struct {
 	port     int
 	basedir  string
 	certFile string
 	keyFile  string
+	username string
+	password string
 }
 
 var defaultConfig = config{
 	port:     8880,
 	basedir:  ".",
 	certFile: "",
 	keyFile:  "",
+	username: "",
+	password: "",
 }
 
 func init() {
 	flag.IntVar(&defaultConfig.port, "port", defaultConfig.port, "which port to listen on")
 	flag.StringVar(&defaultConfig.basedir, "basedir", defaultConfig.basedir, "which directory to serve on")
 	flag.StringVar(&defaultConfig.certFile, "tls-cert", defaultConfig.certFile, "TLS cert file location")
 	flag.StringVar(&defaultConfig.keyFile, "tls-key", defaultConfig.keyFile, "TLS key file location")
+	flag.StringVar(&defaultConfig.username, "user", defaultConfig.username, "basic auth username")
+	flag.StringVar(&defaultConfig.password, "pass", defaultConfig.password, "basic auth password")
 }
 
 func main() {
@@ -41,7 +48,12 @@ func main() {
 		Fs: fs,
 	}
 
-	mux.Handle("/", server.NewCompHandler(ui, fs))
+	handler := &server.BasicAuthHandler{
+		Username: defaultConfig.username,
+		Password: defaultConfig.password,
+		Next:     server.NewCompHandler(ui, fs),
+	}
+	mux.Handle("/", handler)
 
 	addr := fmt.Sprintf(":%d", defaultConfig.port)
 

server/auth.go

@@ -0,0 +1,30 @@
+package server
+
+import (
+	"crypto/subtle"
+	"net/http"
+)
+
+type BasicAuthHandler struct {
+	Username string
+	Password string
+	Next     http.Handler
+}
+
+func (h *BasicAuthHandler) ServeHTTP(w http.ResponseWriter, r *http.Request) {
+	if h.Username == "" && h.Password == "" {
+		h.Next.ServeHTTP(w, r)
+		return
+	}
+
+	user, pass, ok := r.BasicAuth()
+	if !ok ||
+		subtle.ConstantTimeCompare([]byte(user), []byte(h.Username)) != 1 ||
+		subtle.ConstantTimeCompare([]byte(pass), []byte(h.Password)) != 1 {
+		w.Header().Set("WWW-Authenticate", `Basic realm="fileserver"`)
+		http.Error(w, "Unauthorized", http.StatusUnauthorized)
+		return
+	}
+
+	h.Next.ServeHTTP(w, r)
+}

server/fs_handler.go

@@ -43,6 +43,9 @@ func (h *FSHandler) serve(w http.ResponseWriter, r *http.Request) (int, error) {
 	case http.MethodDelete:
 		return h.serveDelete(w, r)
 	case http.MethodPost:
+		if r.URL.Query().Get("action") == "mkdir" {
+			return h.serveMkdir(w, r)
+		}
 		return h.serveCreate(w, r, true)
 	case http.MethodPut:
 		return h.serveCreate(w, r, true)
@@ -191,6 +194,27 @@ func (h *FSHandler) serveCreate(w http.ResponseWriter, r *http.Request, override
 	return http.StatusCreated, nil
 }
 
+func (h *FSHandler) serveMkdir(w http.ResponseWriter, r *http.Request) (int, error) {
+	name := r.URL.Query().Get("name")
+	if name == "" {
+		return http.StatusBadRequest, fmt.Errorf("missing 'name' query parameter")
+	}
+
+	target := path.Join(r.URL.Path, name)
+	targetAbs := h.join(target)
+
+	if _, err := os.Stat(targetAbs); err == nil {
+		return http.StatusConflict, fmt.Errorf("%q already exists", target)
+	}
+
+	if err := os.MkdirAll(targetAbs, os.ModePerm); err != nil {
+		return http.StatusInternalServerError, err
+	}
+
+	w.WriteHeader(http.StatusCreated)
+	return http.StatusCreated, nil
+}
+
 func (h *FSHandler) serveOption(w http.ResponseWriter, r *http.Request) (int, error) {
 	return http.StatusNotImplemented, errors.New("not implemented")
 }

web/src/components/CreateDirDialog.tsx

@@ -0,0 +1,67 @@
+import Button from "@mui/material/Button";
+import Dialog from "@mui/material/Dialog";
+import DialogActions from "@mui/material/DialogActions";
+import DialogContent from "@mui/material/DialogContent";
+import DialogTitle from "@mui/material/DialogTitle";
+import TextField from "@mui/material/TextField";
+import {useState} from "react";
+import axios from "axios";
+
+export interface CreateDirDialogProps {
+    open: boolean
+    onClose: () => void
+    onSuccess: () => void
+}
+
+export default function CreateDirDialog(props: CreateDirDialogProps) {
+    const [name, setName] = useState("")
+    const [error, setError] = useState("")
+    const [loading, setLoading] = useState(false)
+
+    const handleSubmit = () => {
+        if (!name.trim()) {
+            setError("Directory name is required")
+            return
+        }
+        setLoading(true)
+        setError("")
+
+        axios.post(`${window.location.pathname}?action=mkdir&name=${encodeURIComponent(name.trim())}`)
+            .then(() => {
+                props.onSuccess()
+            })
+            .catch((err) => {
+                setError(err.response?.statusText || "Failed to create directory")
+                setLoading(false)
+            })
+    }
+
+    return (
+        <Dialog open={props.open} fullWidth={true} maxWidth="sm">
+            <DialogTitle>Create Directory</DialogTitle>
+            <DialogContent>
+                <TextField
+                    autoFocus
+                    margin="dense"
+                    label="Directory Name"
+                    fullWidth
+                    variant="outlined"
+                    value={name}
+                    onChange={(e) => {
+                        setName(e.target.value)
+                        setError("")
+                    }}
+                    error={!!error}
+                    helperText={error}
+                    onKeyDown={(e) => {
+                        if (e.key === "Enter") handleSubmit()
+                    }}
+                />
+            </DialogContent>
+            <DialogActions>
+                <Button onClick={props.onClose} disabled={loading}>CANCEL</Button>
+                <Button onClick={handleSubmit} disabled={loading || !name.trim()}>CREATE</Button>
+            </DialogActions>
+        </Dialog>
+    )
+}