分享我使用两年的极简 网页记事本

下面文章已经过时,新版在「技焉洲」更新: 分享我使用两年的极简 网页记事本 – 技焉洲 (vfly2.com)

放在新站点「技焉洲」的原因: 承飞之咎与技焉洲 – 承飞之咎 (vfly2.com)




若无单独说明,按照文章代码块中命令的顺序,一条一条执行,即可实现目标。
适用系统:Debian 系发行版,包括 Ubuntu 和 Armbian,其他发行版按流程稍改命令一般也可。

走通预计时间:10 分钟(Docker) 或 25 分钟(原生部署)


可以访问这个实例: https://forward.vfly.app/index.php ,试试怎么样,公开使用的网页记事本。

minimalist-web-notepad

image.png

这个网页记事本是我 2 年前玩机子初期的一大驱动力。当时主要从手机上浏览信息,刚转变到在电脑上处理信息,需要一种简便的渠道在两者之间传递文本、网址。

网盘太重,微信需要验证,tg 很好,但在找到这个记事本后,都是乐色,这就是最好的全平台传递文本的工具。

极简 网页记事本,是一个使用浏览器访问的轻量好用的记事本,专注于文本记录。

Github:pereorga/minimalist-web-notepad: Minimalist Web Notepad (github.com)


使用方法

  1. 访问网页: https://forward.vfly.app/index.php
  2. 它会随机分配 5 个字符组成的地址,如 https://forward.vfly.app/5b79m ,如果想指定地址,只需要访问时手动修改,如 https://forward.vfly.app/this_is_a_path 。下面以 5b79m 为例。
  3. 在上面编辑文本
  4. 等待一会(几秒,取决于延迟),服务端就会存储网页内容到名为 5b79m 的文件里。
  5. 关闭网页,如果关闭太快,会来不及保存,丢失编辑。
  6. 在其他平台再访问同样的网址,就能剪切内容了 ٩۹(๑•̀ω•́ ๑)۶

只要不关闭过快和在两个网页同时编辑,它都能很好地工作。因为极简,项目作者不会考虑增加多余功能。

webnote-in-phone_compressed.webp

在远控其他电脑时,用这个先传递命令,在目标电脑上使用,非常方便,而且适应性强。多个手机之间也一样。或者用于临时传送敏感数据,避免受到平台审查。

使用 Docker 安装 网页记事本

GitHub 的 Docker 分支: pereorga/minimalist-web-notepad at docker (github.com)

Docker 分支很久没更新了,文章最后一节是「解析 minimalist-web-notepad 的 Docker 分支」,可以参考从而使用最新版主分支创建 Docker 镜像。

官方 Docker 分支的部署

全复制并执行,一键创建工作目录并开放端口

myserve="webnote"
sudo ufw allow 8088/tcp comment $myserve && sudo ufw reload
cd ~/myserve/
wget https://github.com/pereorga/minimalist-web-notepad/archive/refs/heads/docker.zip
unzip docker.zip && mv minimalist-web-notepad-docker webnote
cd webnote

根据注释自定义,然后执行,一键创建 docker-compose.yml 文件

cat > docker-compose.yml << EOF
---

version: "2.4"
services:
  minimalist-web-notepad:
    build: .
    container_name: webnote
    restart: always
    ports:
     - "8088:80"
    volumes:
     - ./_tmp:/var/www/html/_tmp
EOF

前面的 5b79m 就存储在 _tmp 中。

构建并启动容器(完成后就可以访问网页了,通过 http://ip_addr_or_domain:8088 访问。将 ip_addr_or_domain 替换为服务器的 IP 或域名)

docker compose up -d

AhFei 构建的镜像部署

Docker 分支使用的基础镜像太大了,了解 PHP, httpd, alpine 的也可以参考下面的原生安装和对 Docker 分支的解析,创建 alpine 镜像,我没有创建成功。

下面是 AhFei 使用主分支构建的镜像。

myserve="webnote"
sudo ufw allow 80/tcp comment $myserve && sudo ufw reload  # 这里改用 80 端口,与前文不同
mkdir -p ~/myserve/$myserve && cd ~/myserve/$myserve
cat > docker-compose.yml << EOF
---

version: "2.4"
services:
  minimalist-web-notepad:
    image: ahfeil/minimalist-web-notepad:latest   # 这里改用 ahfei 的镜像
    container_name: webnote
    restart: always
    ports:
     - "80:80"
    volumes:
     - ./_tmp:/var/www/html/_tmp
    environment:
     # 这个用来指定访问记事本的域名,请自定义,或者注释掉不指定
     - MWN_BASE_URL=http://webnote.vfly2.com
     # 不指定的话,使用任何域名包括直接用 IP 都能访问,不太安全
     # 如果端口不是 80 ,比如是 8088,则要加上端口,如 http://webnote.vfly2.com:8088
EOF
docker compose up -d

像这样的配置,启动容器后,访问 http://webnote.vfly2.com 就能使用了。

为什么不提交 push 呢?

Docker 分支的结构不合理,不方便提交,另外,也不是什么大的改进。

原生安装 网页记事本

下面以域名 http://forward.vfly.app 为例。

安装 Apache2 和 PHP

sudo apt update && sudo apt upgrade && \
sudo apt install apache2
# sudo systemctl status apache2   # 检查状态
sudo apt install php libapache2-mod-php

访问 http://YOUR_IP_or_Domain/ 可以验证 Apache 是否正常工作,如果能看到欢迎页。

安装 PHP 后,重启 Apache 以加载 PHP module:

sudo systemctl restart apache2

检测 PHP 安装:

sudo bash -c 'echo "<?php phpinfo(); ?>" > /var/www/html/phpinfo.php'

访问 http://YOUR_IP_or_Domain/phpinfo.php 可以验证 php 是否安装成功。

如果不显示具体参数,只是空白页,左上角有一行 <?php phpinfo(); ?> ,多半是 PHP 模块没能在 Apache 成功开启,可能是与 MBM 模块冲突,无法开启,请自行询问 ChatGPT 或其他方式解决。

说个自己的经历。从 porkbun 白嫖的 .app 域名,用来解析这个服务的时候,怎么都打不开,还总是跳 HTTPS ,老半天才知道, .app 和 .net 似乎只能 HTTPS 。

创建目录和下载原文件

cd /var/www/ && \
sudo git clone https://github.com/pereorga/minimalist-web-notepad.git
# 改名并将目录赋予用户 www-data 以拥有读写权限
sudo mv minimalist-web-notepad webnote
sudo chown -R www-data:www-data /var/www/webnote

修改 $base_url = 'http://forward.vfly.app'; 就在第四行,必须修改为访问时的域名,如果后面要加 SSL,这里也要对应修改为 https 。

cd /var/www/webnote && sudo vim index.php

创建虚拟主机

如果要用 https,跳过这节,直接看下面一节

进入可用虚拟主机目录,复制示例配置文件,并编辑

cd /etc/apache2/sites-available   
sudo cp 000-default.conf web-notepad.conf
sudo vim web-notepad.conf

保证有下面的两行即可,记得修改域名和目录。

        ServerAdmin <邮箱随意>
        ServerName forward.vfly.app
        DocumentRoot /var/www/webnote

还要添加下面这部分

<Directory /var/www/webnote>
                Options Indexes FollowSymLinks MultiViews
                AllowOverride All
                Order allow,deny
                allow from all
</Directory>

启用虚拟主机

sudo a2enmod rewrite   # 开启mod_rewrite,
sudo a2ensite web-notepad.conf   # 启用虚拟主机
sudo systemctl reload apache2   # 重启apache2生效

这样就可以使用了,浏览器访问:http://YOUR_Domain/index.php

SSL

申请证书时,要使用root: sudo -i ,实际部署时,记得修改域名。

安装并启用acme.sh脚本(/home/skf/.acme.sh/acme.sh)(改邮箱)

apt install -y curl && curl https://get.acme.sh | sh -s email=vgamebox@outlook.com && cd ~ && source .bashrc

切换证书签发机构

acme.sh --set-default-ca --server letsencrypt

签发证书(改域名)

acme.sh  --issue -d forward.vfly.app --apache

安装证书(改域名)

acme.sh --install-cert -d forward.vfly.app \
--cert-file      /etc/ssl/certs/forward.vfly.app.cer \
--key-file       /etc/ssl/private/forward.vfly.app.key

开启acme.sh自动升级

acme.sh  --upgrade  --auto-upgrade

可以退出 root 用户了。

进入可用虚拟主机目录,复制另一个默认的,并编辑

cd /etc/apache2/sites-available   
sudo cp default-ssl.conf ssl-webnote.conf
sudo vim ssl-webnote.conf

保证有下面的两行即可,记得修改域名和目录。

        ServerAdmin <邮箱随意>
        ServerName forward.vfly.app
        DocumentRoot /var/www/webnote

还要添加下面这部分

<Directory /var/www/webnote>
                Options Indexes FollowSymLinks MultiViews
                AllowOverride All
                Order allow,deny
                allow from all
</Directory>

还有编辑证书位置

          SSLCertificateFile  /etc/ssl/certs/forward.vfly.app.cer
          SSLCertificateKeyFile /etc/ssl/private/forward.vfly.app.key

启用虚拟主机

sudo a2enmod rewrite ssl   # 开启mod_rewrite,ssl
sudo a2ensite ssl-webnote.conf   # 启用虚拟主机
sudo systemctl reload apache2   # 重启apache2生效

这样就可以使用了,浏览器访问:https://YOUR_Domain/index.php

如果出现文本框很小的情况,那是 $base_url 的没从 http 改成 https 。

迁移

数据都在 /var/www/webnote/_tmp 中,在新机子上重新部署一遍,复制这个目录到新机子上即可。

其他

如要开启认证访问。 编辑网站根目录下的.htaccess,去掉末尾四行的注释。

cd /var/www/webnote && sudo vim .htaccess

这四行取消注释

# AuthType basic
# AuthName "website.name"
# AuthUserFile "/var/www/webnote/update-path-to.htpasswd"   # 这里的路径自定义
# Require valid-user

再创建文件

sudo touch /var/www/webnote/update-path-to.htpasswd

然后添加账户即可(记得改 username,会提示输密码)

sudo htpasswd -c /var/www/webnote/update-path-to.htpasswd username

如要添加第二个,不要加-c,否则会覆盖第一个

其他类似项目

浏览器便签

很不错的项目,简单,虽然项目不更新了,但是功能基本完成。

GitHub: jonathontoon/manifest: An instant grid-based pinboard for note taking in your browser. (github.com)

image.png

Hasty Paste

一个文本粘贴工具,看着不错,有高亮,适合分享代码。

GitHub:enchant97/hasty-paste: A fast and minimal paste bin. (github.com)

解析 minimalist-web-notepad 的 Docker 分支

相比主分支, Docker 分支有四个新增的文件

  • Dockerfile
  • docker-compose
  • minimalist-web-notepad-entrypoint
  • notes.htaccess

利用最新版主分支,构建镜像的步骤如下:

前置准备

下载最新版主分支

wget https://github.com/pereorga/minimalist-web-notepad/archive/refs/heads/master.zip
unzip master.zip && rm master.zip
mv minimalist-web-notepad-master webnote
cd webnote

修改 index,改这两行为下面的

vim index.php
$base_url = getenv('MWN_BASE_URL') ?: '';
$save_path = getenv('MWN_SAVE_PATH') ?: '_tmp';

一键修改

sed -i "s/\$base_url = 'https:\/\/notes.orga.cat';/\$base_url = getenv('MWN_BASE_URL') ?: '';/g; s/\$save_path = '_tmp';/\$save_path = getenv('MWN_SAVE_PATH') ?: '_tmp';/g" ./index.php

创建 notes.htaccess (主分支目前已包含这个)

cat > notes.htaccess << EOF
<IfModule mod_authz_core.c>
    Require all denied
</IfModule>
<IfModule !mod_authz_core.c>
    Order allow,deny
</IfModule>
EOF

创建 entrypoint 文件

vim minimalist-web-notepad-entrypoint
#!/bin/sh
set -e

# Create save path
case "${MWN_SAVE_PATH:=_tmp}" in
  /*) NOTES_PATH="$MWN_SAVE_PATH" ;;
  *) NOTES_PATH="/var/www/html/$MWN_SAVE_PATH" ;;
esac
mkdir -p "$NOTES_PATH"
cp "/var/www/html/notes.htaccess" "$NOTES_PATH/.htaccess"
chown -R www-data:www-data "$NOTES_PATH"

# Run default entrypoint
exec docker-php-entrypoint "$@"

赋予执行权限

chmod +x minimalist-web-notepad-entrypoint

"$@" 是一个特殊变量,用于将在容器启动时传递给 docker-php-entrypoint 脚本的所有命令行参数传递过去。

例如,如果在运行容器时使用以下命令: docker run -it my_image arg1 arg2

那么 "$@" 将被展开为 arg1 arg2,并作为参数传递给 docker-php-entrypoint 脚本。这样可以确保容器内部的入口脚本能够正确处理传递的参数。

Dockerfile

先拉取基础镜像: php Tags | Docker Hub

docker pull php:7.4-apache
# docker run -it --rm php:7.4-apache bash
# 可以知道默认 workdir 是 /var/www/html

vim Dockerfile
FROM php:7.4-apache

# Import App and entrypoint file
COPY .htaccess index.php styles.css script.js favicon.ico favicon.svg notes.htaccess minimalist-web-notepad-entrypoint ./

# Set PHP configuration to production, then Set entrypoint for permissions
RUN cp /usr/local/etc/php/php.ini-production /usr/local/etc/php/php.ini && \
    mv minimalist-web-notepad-entrypoint /usr/local/bin/ && \
    a2enmod rewrite && \
    rm -rf /var/lib/apt/lists/*

ENTRYPOINT ["minimalist-web-notepad-entrypoint"]
CMD ["apache2-foreground"]

构建镜像

docker build -t ahfeil/minimalist-web-notepad:latest .

删除重建

docker stop webnote && docker rm webnote && docker rmi ahfeil/minimalist-web-notepad:latest

docker-compose.yml 文件中,把 build: . 换成 image: ahfeil/minimalist-web-notepad:latest 即可


原文链接: https://blog.vfly2.com/2023/08/a-minimalist-web-notepad-used-for-two-years/

版权声明:本博客所有文章除特別声明外,均为 AhFei 原创,采用 CC BY-NC-SA 4.0 许可协议。转载请注明来源 承飞之咎 (blog.vfly2.com)

保持更新 ٩(•̤̀ᵕ•̤́๑)ᵒᵏᵎᵎᵎᵎ 清晰可重复的实用技能,欢迎使用 RSS 订阅,也欢迎留言指正。

可在 Telegram 群组 https://t.me/vfly2 交流依文章步骤遇到的问题。

没有 RSS 订阅器的话,也可以关注公众号:承飞之咎 了解最新内容。

评论

  1. 5 月前
    2024-2-04 15:05:00

    如果是在网上暂存一份文本的话,可以看看这个项目. 不需要自己的服务器, 使用CloudFlare的免费的woker和KV.
    https://github.com/crazypeace/Url-Shorten-Worker
    演示站: https://pastebin.icdyct.cloudns.asia/tieludasiliqiuweiyue
    演示视频: https://www.youtube.com/watch?v=toBeb3DNpZc
    搭建教程: https://www.nodeseek.com/post-58723-1

  2. 4 月前
    2024-2-25 14:42:59

发送评论 编辑评论


				
|´・ω・)ノ
ヾ(≧∇≦*)ゝ
(☆ω☆)
(╯‵□′)╯︵┴─┴
 ̄﹃ ̄
(/ω\)
∠( ᐛ 」∠)_
(๑•̀ㅁ•́ฅ)
→_→
୧(๑•̀⌄•́๑)૭
٩(ˊᗜˋ*)و
(ノ°ο°)ノ
(´இ皿இ`)
⌇●﹏●⌇
(ฅ´ω`ฅ)
(╯°A°)╯︵○○○
φ( ̄∇ ̄o)
ヾ(´・ ・`。)ノ"
( ง ᵒ̌皿ᵒ̌)ง⁼³₌₃
(ó﹏ò。)
Σ(っ °Д °;)っ
( ,,´・ω・)ノ"(´っω・`。)
╮(╯▽╰)╭
o(*////▽////*)q
>﹏<
( ๑´•ω•) "(ㆆᴗㆆ)
😂
😀
😅
😊
🙂
🙃
😌
😍
😘
😜
😝
😏
😒
🙄
😳
😡
😔
😫
😱
😭
💩
👻
🙌
🖕
👍
👫
👬
👭
🌚
🌝
🙈
💊
😶
🙏
🍦
🍉
😣
Source: github.com/k4yt3x/flowerhd
颜文字
Emoji
小恐龙
花!
上一篇
下一篇