├── .dockerignore
├── .gitattributes
├── .gitignore
├── .prettierignore
├── .prettierrc.json
├── Dockerfile
├── LICENSE
├── README.md
├── client
├── App.svelte
├── components
│ ├── Header.svelte
│ ├── LogLine.svelte
│ ├── LogLines.svelte
│ ├── SearchBar.svelte
│ └── Toggle.svelte
├── global.d.ts
├── main.ts
├── pages
│ └── Logs.svelte
├── stores
│ ├── logs.ts
│ ├── search.ts
│ ├── settings.ts
│ └── sources.ts
├── types
│ └── CircularBuffer.ts
└── utils.ts
├── dist
└── public
│ ├── favicon.png
│ ├── global.css
│ └── index.html
├── go.mod
├── go.sum
├── images
├── image-1.png
└── image-2.png
├── package-lock.json
├── package.json
├── pkg
└── logging
│ └── logging.go
├── rollup.config.js
├── server
├── config.go
├── main.go
├── serverconfig.go
└── sources.go
├── tsconfig.json
├── utils
└── generate_logs.js
└── web-tail.config.toml
/.dockerignore:
--------------------------------------------------------------------------------
1 | node_modules
2 | npm-debug.log
3 |
--------------------------------------------------------------------------------
/.gitattributes:
--------------------------------------------------------------------------------
1 | * text eol=lf
2 |
--------------------------------------------------------------------------------
/.gitignore:
--------------------------------------------------------------------------------
1 | /node_modules/
2 | /dist/*
3 | !/dist/public
4 | /dist/public/build
5 | *.zip
6 | *.log
7 | web-tail-*/
8 | src/common/wasm/target/*
9 |
10 | .DS_Store
11 |
--------------------------------------------------------------------------------
/.prettierignore:
--------------------------------------------------------------------------------
1 | dist
2 | web-tail-*/
3 | .github/*
4 | server/*
5 | pkg/*
6 | README.md
7 |
--------------------------------------------------------------------------------
/.prettierrc.json:
--------------------------------------------------------------------------------
1 | {}
2 |
--------------------------------------------------------------------------------
/Dockerfile:
--------------------------------------------------------------------------------
1 | FROM golang:1.23 AS buildgo
2 | WORKDIR /app
3 | COPY . .
4 | RUN CGO_ENABLED=0 go build -o ./build/server ./server
5 |
6 |
7 | FROM node:22 AS buildjs
8 | WORKDIR /app
9 | COPY . .
10 | RUN npm ci
11 | RUN npm run build:js
12 |
13 |
14 | FROM alpine:3
15 | WORKDIR /app
16 | ENV ASSETS=/app/dist/public
17 | COPY --from=buildgo /app/build/server /app/server
18 | COPY --from=buildjs /app/dist /app/dist
19 | EXPOSE 4444
20 | ENTRYPOINT ["/app/server"]
21 |
--------------------------------------------------------------------------------
/LICENSE:
--------------------------------------------------------------------------------
1 | MIT License
2 |
3 | Copyright (c) 2022 Denis Mishankov
4 |
5 | Permission is hereby granted, free of charge, to any person obtaining a copy
6 | of this software and associated documentation files (the "Software"), to deal
7 | in the Software without restriction, including without limitation the rights
8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9 | copies of the Software, and to permit persons to whom the Software is
10 | furnished to do so, subject to the following conditions:
11 |
12 | The above copyright notice and this permission notice shall be included in all
13 | copies or substantial portions of the Software.
14 |
15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21 | SOFTWARE.
22 |
--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 | # Web tail
2 |
3 | [](https://github.com/newteller/web-tail/actions/workflows/ci.yml)
4 | [](https://www.codefactor.io/repository/github/mishankov/web-tail)
5 |
6 | Web application to view lines from file on local system or on remote server built with [Svelte](https://github.com/sveltejs/svelte)
7 |
8 | 
9 |
10 | ## Installation
11 |
12 | Download and unpack `web-tail-[platform].zip` from [latest release](https://github.com/newteller/web-tail/releases/latest)
13 |
14 | Docker image is also available [here](https://github.com/newteller/web-tail/pkgs/container/web-tail)
15 |
16 | ## Configuration
17 |
18 | In unpacked folder edit `web-tail.config.toml` file
19 |
20 | - `port` - port that Web tail will run on. Defaults value is `4444`
21 | - `allowedOrigins` - list of allowed origins for WebSocket connections. Defaults value is ["*"] which allows all origins
22 | - `servers` - reusable servers configuration
23 | - `name` - name of server to use in `sources` configs
24 | - `host` - host of remote server. Mandatory field for source types `ssh:*`
25 | - `port` - port of remote server. Mandatory field for source types `ssh:*`
26 | - `username` - username for ssh connection to remote server. Mandatory for source types `ssh:*`
27 | - `password` - password to authenticate on remote server. Either this or `privateKeyPath` is mandatory for source types `ssh:*`
28 | - `privateKeyPath` - path to file with private key to authenticate on remote server. Either this or `password` is mandatory for source types `ssh:*`
29 | - `sources` - list of sources to tail lines from
30 | - `name` - name of source. Mandatory field
31 | - `type` - type of source. Possible values: `local:file`, `local:docker`, `ssh:file`, `ssh:docker`. Mandatory field
32 | - `path` - path to file. Mandatory field for source types `*:file`
33 | - `serverName` - name of a server from `servers` list
34 | - `containerId` - Docker container ID. Mandatory field for source types `*:docker`
35 | - `host` - host of remote server. Mandatory field for source types `ssh:*`
36 | - `port` - port of remote server. Mandatory field for source types `ssh:*`
37 | - `username` - username for ssh connection to remote server. Mandatory for source types `ssh:*`
38 | - `password` - password to authenticate on remote server. Either this or `privateKeyPath` is mandatory for source types `ssh:*`
39 | - `privateKeyPath` - path to file with private key to authenticate on remote server. Either this or `password` is mandatory for source types `ssh:*`
40 |
41 | ## Usage
42 |
43 | 
44 |
45 | Options from left to right:
46 |
47 | - Dropdown to select one of sources from `web-tail.config.toml`
48 | - Search field. Matching results will be selected. Search is case insensitive by default
49 | - `Filter` toggle. If enabled only lines with matching results are shown
50 | - `.*` toggle. If enabled treats text in search field as regular expression
51 | - `Aa` toggle. If enabled makes search case sensitive
52 | - `Reverse` toggle. If enabled latest lines shown on top
53 | - Max lines field. How much lines will be shown
54 |
55 |
56 | ## Development
57 |
58 | Set environment variable `ASSETS=dist/public` before doing `go run ./server` to use preemtively compiled assets
59 |
--------------------------------------------------------------------------------
/client/App.svelte:
--------------------------------------------------------------------------------
1 |
4 |
5 |
31 | {@html lineToShow}
32 |
33 |
34 |
56 |
--------------------------------------------------------------------------------
/client/components/LogLines.svelte:
--------------------------------------------------------------------------------
1 |
55 |
56 |
57 | {#each logsToShow as logLine (logLine.id)}
58 |
59 | {/each}
60 |
61 |
46 | goToSearchResult("previous")} title="Previous line with search result"><
48 | goToSearchResult("next")} title="Next line with search result">>
49 |
50 |
51 |
--------------------------------------------------------------------------------
/client/components/Toggle.svelte:
--------------------------------------------------------------------------------
1 |
11 |
12 | {label}
13 |
14 |
43 |
--------------------------------------------------------------------------------
/client/global.d.ts:
--------------------------------------------------------------------------------
1 | ///
52 | Web tail | {source}
53 |
54 |
55 |
56 |
57 |
58 |
60 |
--------------------------------------------------------------------------------
/client/stores/logs.ts:
--------------------------------------------------------------------------------
1 | import { writable } from "svelte/store";
2 | import {
3 | CircularBuffer,
4 | type CircularBufferItem,
5 | } from "../types/CircularBuffer";
6 |
7 | export const logs = writable(new CircularBuffer(20));
8 | export const filteredLogs = writable[]>([]);
9 |
--------------------------------------------------------------------------------
/client/stores/search.ts:
--------------------------------------------------------------------------------
1 | import { writable } from "svelte/store";
2 |
3 | export const currentSearchLineId = writable("");
4 |
--------------------------------------------------------------------------------
/client/stores/settings.ts:
--------------------------------------------------------------------------------
1 | import { writable } from "svelte/store";
2 |
3 | interface Settings {
4 | filterLogs: boolean;
5 | regexFilter: boolean;
6 | caseSensitive: boolean;
7 | reverseLogs: boolean;
8 | logWindow: number;
9 | }
10 |
11 | const defaultSettings: Settings = {
12 | filterLogs: false,
13 | regexFilter: false,
14 | caseSensitive: false,
15 | reverseLogs: false,
16 | logWindow: 100,
17 | };
18 |
19 | function getSettingsFromStorage(): Settings {
20 | const settings = JSON.parse(localStorage.getItem("WebTailSettings"));
21 | if (settings === null) {
22 | localStorage.setItem("WebTailSettings", JSON.stringify(defaultSettings));
23 | return getSettingsFromStorage();
24 | } else {
25 | return settings;
26 | }
27 | }
28 |
29 | function saveSettingsToStorage(name: string, value: number | boolean) {
30 | const settings = getSettingsFromStorage();
31 | settings[name] = value;
32 | localStorage.setItem("WebTailSettings", JSON.stringify(settings));
33 | }
34 |
35 | const settingsFromStorage = getSettingsFromStorage();
36 |
37 | export const filterLogs = writable(settingsFromStorage.filterLogs);
38 | filterLogs.subscribe((value) => saveSettingsToStorage("filterLogs", value));
39 |
40 | export const regexFilter = writable(settingsFromStorage.regexFilter);
41 | regexFilter.subscribe((value) => saveSettingsToStorage("regexFilter", value));
42 |
43 | export const caseSensitive = writable(settingsFromStorage.caseSensitive);
44 | caseSensitive.subscribe((value) =>
45 | saveSettingsToStorage("caseSensitive", value)
46 | );
47 |
48 | export const reverseLogs = writable(settingsFromStorage.reverseLogs);
49 | reverseLogs.subscribe((value) => saveSettingsToStorage("reverseLogs", value));
50 |
51 | export const logWindow = writable(settingsFromStorage.logWindow);
52 | logWindow.subscribe((value) => saveSettingsToStorage("logWindow", value));
53 |
--------------------------------------------------------------------------------
/client/stores/sources.ts:
--------------------------------------------------------------------------------
1 | import { writable } from "svelte/store";
2 |
3 | export default function () {
4 | const loadingSources = writable(false);
5 | const sources = writable([]);
6 |
7 | async function get() {
8 | loadingSources.set(true);
9 | const response = await fetch("/sources");
10 | const data: Array = await response.json();
11 | sources.set(data);
12 | loadingSources.set(false);
13 | }
14 |
15 | get();
16 |
17 | return { sources, loadingSources };
18 | }
19 |
--------------------------------------------------------------------------------
/client/types/CircularBuffer.ts:
--------------------------------------------------------------------------------
1 | function getUniqueId() {
2 | return Date.now().toString(36) + Math.random().toString(36).slice(2);
3 | }
4 |
5 | export type CircularBufferItem = { id: string; item: ItemType };
6 |
7 | export class CircularBuffer {
8 | length: number;
9 | items: CircularBufferItem[] = [];
10 | lastPosition = -1;
11 |
12 | constructor(length: number) {
13 | this.length = length;
14 | }
15 |
16 | push(item: ItemType) {
17 | this.lastPosition = (this.lastPosition + 1) % this.length;
18 |
19 | if (this.items.length === this.length) {
20 | this.items[this.lastPosition].item = item;
21 | } else {
22 | this.items.push({ id: getUniqueId(), item: item });
23 | }
24 | }
25 |
26 | toArray(): Array<{ id: string; item: ItemType }> {
27 | if (this.lastPosition === this.items.length - 1) {
28 | return this.items;
29 | } else {
30 | return this.items.map(
31 | (_, position, array) =>
32 | array[(position + this.lastPosition + 1) % this.length]
33 | );
34 | }
35 | }
36 |
37 | setLength(newLength: number) {
38 | if (newLength > 0) {
39 | this.items = this.toArray().slice(0, newLength);
40 | this.lastPosition = this.items.length - 1;
41 | this.length = newLength;
42 | } else {
43 | this.items = [];
44 | this.lastPosition = -1;
45 | this.length = 0;
46 | }
47 | }
48 | }
49 |
--------------------------------------------------------------------------------
/client/utils.ts:
--------------------------------------------------------------------------------
1 | function escapeRegExp(string) {
2 | return string.replace(/[.*+?^${}()|[\]\\]/g, "\\$&"); // $& means the whole matched string
3 | }
4 |
5 | function smoothScroll(element: Element) {
6 | element.scrollIntoView({
7 | behavior: "smooth",
8 | block: "center",
9 | });
10 | }
11 |
12 | export { escapeRegExp, smoothScroll };
13 |
--------------------------------------------------------------------------------
/dist/public/favicon.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/newteller/web-tail/5c55790b5377dd7af9029abc6788254a698aa153/dist/public/favicon.png
--------------------------------------------------------------------------------
/dist/public/global.css:
--------------------------------------------------------------------------------
1 | html, body {
2 | position: relative;
3 | width: 100%;
4 | height: 100%;
5 | }
6 |
7 | body {
8 | margin: 0;
9 | padding: 0;
10 | box-sizing: border-box;
11 | font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
12 | }
13 |
--------------------------------------------------------------------------------
/dist/public/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Web tail
8 |
9 |