热搜词
发表于 2021-10-10 18:04:03 | 显示全部楼层 |阅读模式

php-file-browser 基于PHP开发的可生成静态页面的在线文件浏览器


截图演示

界面.png

作者:jokin1999
下载地址:

https://github.com/file-browser/php-file-browser


常见问题:

1.静态模式(index.html)启用方法

tool.php程序文件默认是动态模式,如果需要静态模式把下面的一段代码中的 IS_CLI === FALSE 改为 IS_CLI !== FALSE 即可。


// 生成静态文件与运行

if (IS_CLI === FALSE) {

  echo $tpl;

}else{

  // 相对路径不允许设置index.html保存位置

  $filename = isset($config['static_file']) && !empty($config['static_file']) ? $config['static_file'] : './index.html';

  file_put_contents($filename, $tpl);

}


2.解决中文网址内容不显示问题

含有中文字符的网址链接被转为Unicode编码后, 在手机版浏览器打开,子目录不显示中文,仍为Unicode编码,并且子目录内的文件也不显示的解决方法:

00.png

在index.tpl文件中查找如下一段 JavaScript  代码:

path = path.substring(0, 1) == '#' ? path.substring(2) : path;  

在此行下面添加一行如下代码:

path = decodeURI(path);


添加完成后,此段完整代码如下:

      function opendir(path = '') {

        path = path.substring(0, 1) == '#' ? path.substring(2) : path;

        path = decodeURI(path);

        console.log('open: ' + path);

        location.href = '#/' + path;

        $('#list').html('');

        if (path == '') {

          arr = list;

          $('#nav').html($('#nav_item').html().replace('{{__NAME__}}', '根目录').replace('{{__PATH__}}', ''));

        }else{

          var sp = path.split('/');

          var arr = list;

          var nav_path = '';

          var nav_item = '';

          $('#nav').html($('#nav_item').html().replace('{{__NAME__}}', '根目录').replace('{{__PATH__}}', ''));

          $.each(sp, function(key, value){

            nav_path = (nav_path == '' ? nav_path : nav_path + '/') + value;

            nav_item = '/ ' + value;

            $('#nav').html($('#nav').html() + $('#nav_item').html().replace('{{__NAME__}}', nav_item).replace('{{__PATH__}}', nav_path));

            arr = arr[value];

          });

        }

01.png



3.英文长文件名不自动换行问题

文件列表页中,但显示屏的宽度不足以显示文件名时,如果是中文长文件名会自动换行显示,英文和数字长文件名则不自动换行。


英文长文件名.png


解决方法:

在index.tpl文件中查找如下一段 div 代码:

<div id="content" >

在此行代码中内联一个css样式:

<div id="content" style="word-break: break-all;">

添加完成后,此段完整代码如下:

            <div id="content" style="word-break: break-all;">

              <table class="table table-hover">

                <thead>

                  <tr>

                    <th scope="col">文件名</th>

                    <th scope="col">操作</th>

                  </tr>

                </thead>

                <tbody id="list">

                </tbody>

              </table>

            </div>


4.给文件名称添加超链接方法

文件列表中的所有文件标题都没有超链接,如果是图片、PDF、txt之类的可在线预览的文件,只能通过右侧下载按钮,下载到本地后才能浏览,无法实现通过浏览器在线预览,给文件名称添加超链接可解决此问题,方法如下:

在index.tpl文件中查找id标识为"list_item" 的一段  template 标签代码,把其中的   {{__NAME__}} 添加超链接即可,添加后代码如下:

    <template id="list_item">

      <tr>

        <th scope="row">

        <i class="fas {{__ICON__}} fa-fw"></i>

        <a href="{{__PATH__}}" target="_blank" >

          {{__NAME__}}

      </a>

        </th>

        <td>

          {{__DOWNLOAD__}}

          {{__VIDEO__}}

          {{__AUDIO__}}

          {{__FILE__}}

        </td>

      </tr>


    </template>



5.json相关

生成的json是所有目录与文件,导航是根据这个json文件进行无刷新切换目录的,这个json文件在新版本自动集成在静态文件中了,不再外挂。


全部评论2
灰儿 发表于 2021-10-14 09:18:57 | 显示全部楼层
# php-file-browser

基于PHP开发的可生成静态页面的在线文件浏览器

[GitHub forks]
https://img.shields.io/github/fo ... r?style=flat-square
https://github.com/file-browser/php-file-browser/network

[GitHub issues]
https://img.shields.io/github/is ... r?style=flat-square
https://github.com/file-browser/php-file-browser/issues

[GitHub tag (latest by date)]
https://img.shields.io/github/v/tag/file-browser/php-file-browser?style=flat-square



## 特性介绍
- 现代化设计风格
- 极简操作
- 无刷新更新页面
- 可过滤显示文件与文件夹
- 可自定义标题
- 可自定义子标题
- 可自定义关于与鸣谢
- 可设置是否显示多媒体下载按钮
- 支持环境变量设置
- 支持扫描目录自定义
- 支持代码压缩
- 支持远程模板(仅推荐在静态模式使用)
- 支持index.html文件保存位置自定义
- 支持`jsDelivr`加速下载(仅GitHub部署有效)

## 依赖
- PHP > 7.0

## 环境变量设置
- 所有`.config.example`文件中的设置项都可以覆盖设置
- 使用全部大写的设置项键值加上前缀`FB_`即可覆盖

例如配置项 title
```
KEY: FB_TITLE
VALUE: 欲设置的标题
```

## 静态模式使用方法(推荐)

**自建**
- 修改`.config`配置
- 增加文件至根目录
- 运行`tool.php`生成`index.html`文件

**GitHub Action**
- 修改`.config`配置
- 增加文件至根目录
- 提交`GitHub`
- 等待`Action`提交`gh-pages`分支
- 开启`Pages`

## 动态模式使用方法
- 修改`.config`配置
- 将`tool.php`重命名为`index.php`

## 国内访问加速
- 配置`Action`
- 登录`vercel.com`
- 导入项目
- 绑定域名
- 将该域名设置分支为`gh-pages`
- 再次触发Deploy即可生效

## 环境变量设置
- 查看`.config`文件中需要修改的配置项
- 配置项全部大写并加上前缀`FB_`
- 如`FB_TITLE`
- 设置环境变量后需要再次运行Action生效

## 版本重大修改说明
### 2.0.0

- 远程模板版本不再与主程序版本一致
- 远程模板优先使用CDN方式获取
- **配置文件不兼容1.x.x版本**



回复

使用道具 举报

回复
您需要登录后才可以回帖 登录 | 注册

本版积分规则

QQ|Archiver|手机版|小黑屋|管理员之家 ( 苏ICP备2023053177号-2 )

GMT+8, 2024-11-24 00:22 , Processed in 0.168739 second(s), 28 queries .

Powered by Discuz! X3.5

Cpoyright © 2001-2024 Discuz! Team