vList5+njs/moment 实用与使用

in 前后端开发 with 0 comment

(bilibili) 视频展示

右键 & 设置

音频

视频

图片

Markdown

explorerUI

列表模式

MomentPHP已经完工了很久,但是却没有可搭配的文件管理
我本来想要修改一些Github作品的,但是太复杂的懒得改,太烂的不屑改,兜兜转转没有进展
最后想起我的vList4项目,一咬牙,自己写!

特性

最简安装

注意:moment版本已经停止支持。以下内容只可在v1版本中使用

Github库

git clone https://github.com/imzlh/vList5
git clone https://github.com/imzlh/moment

moment文件夹 里的moment.php移动到 vList5文件夹
用记事本打开src/utils.ts这个文件

- | // API地址,除非前后端分离,请修改至"/"
5 | export const APP_API = 'http://localhost/@fs_api/';
6 | export const APP_NAME = 'ShineCloud';
7 | export const DEFAULT_FILE_ICON = '/icon/file.webp'
8 | export const DEFAULT_DIR_ICON = '/icon/dir.webp';
- | // 文件服务器地址,除非前后端分离,请修改至"/"
9 | export const FILE_PROXY_SERVER = 'http://localhost/';

执行程序!开始飙车!

php fileman.php

以下为新版本可用方法

下载release包后端文件
将vlist5.js 放在nginx文件夹下,并且修改配置文件,增加到server块中

js_import vlist5.js;
location = /@api/{
    js_content vlist5.main;
}

接下来修改应用根目录,默认是/mnt

修改

将release包解压到网站根目录dist文件夹请自己更改名称
建议使用前缀.使这个文件夹隐藏,如.list

最后,重启nginx,就可用快乐地开始使用啦

PS 修改配置:用记事本打开config.ts这个文件

-  | // 应用名称,显示在左上角
4  | export const APP_NAME = 'izCloud';
-  | // 默认文件图标,自定义:可以改成相对路径
5  | export const DEFAULT_FILE_ICON = I_File;
-  | // 默认文件夹图标,自定义:可以改成相对路径
6  | export const DEFAULT_DIR_ICON = I_DIR;
-  | // API地址,除非前后端分离,请修改请修改最后一行引号内至"/"
7  | export const APP_API = import.meta.env.DEV
   | ? 'http://192.168.1.1:81/@api/' 
   | : '/@api/';      // <--- HERE
-  | // 文件服务器地址,除非前后端分离,请修改最后一行引号内至"/"
10 | export const FILE_PROXY_SERVER = import.meta.env.DEV 
   | ? 'http://192.168.1.1:81/' 
   | : '';            // <--- HERE

已过期:MomentPHP API地址法则

关于FILE_PROXY_SERVER

关于API地址

vList的妙用

批量删除/重命名/移动

场景 设想你下载了一堆番剧文件和找来了一堆字幕,有简体、繁体、各种不同的命名。你甘心一个一个排序吗?

step

cue文件解析

你去网上下载了一张CD,结果是一个cue文件和一个长达1个小时,大小甚至超过了200MB的flac文件,你想要听一个片段,怎么办?
vList5中,双击打开即可

私密文件夹

有的时候,我们需要开放,也需要隐私。这个时候隐藏文件夹就出场了
比如屏蔽所有$开头的文件夹,打开 vlist.js

16 | /**
17 |  * 检验文件是否应该被隐藏
18 |  */
19 | const HIDE_FILES = (name) => name[0] == '.';

在19行添加即可,如

19 | const HIDE_FILES = (name) => name[0] == '.' || name[0] == '$';

甚至可以正则匹配,如隐藏所有图片

19 | const HIDE_FILES = (name) => name[0] == '.' || name.match(/\.(jpg|png|webp|jpeg)$/);

然后,我自己访问只需要 转到目录,输入隐藏的路径(文件夹)即可

隐藏

或者使用HASH大法,在路径上输入目录路径即可,如http://localhost:5173/#/.in/
完美!

|> 关于加密,我放在了 这篇文件 里讲述,更安全了哦

Responses