python實現文件夾目錄展示

前兩天一個老同學突然找我，說他想實現一個文件夾目錄展示的功能，難道是Windows的自帶的文件管理器不香嗎？

既然不是那啥的，都好說。既然想實現這個功能，非常炫酷的，咱們做不出來，一個簡單的功能還是可以做出哦來，畢竟網上的資源這麼多，想改編一個還是可以的。

一、分析

要想實現這個功能，肯定要包含前端和後端這兩個部分，那麼web框架主流的django和flask。這個功能是一個比較簡單的功能，也就沒有必要使用django這個重量級的了，使用flask就可以了。

二、開始編碼

分析完成後也就可以開始編碼了。

打開pycharm，新建工程，選擇flask

然後，新建app.py 文件，填入如下內容：

import os
from pathlib import Path
from flask import Flask, send_from_directory, url_for, jsonify, request, render_template, current_app, abort, g, send_file
from flask_httpauth import HTTPBasicAuth
from flask_bootstrap import Bootstrap

print(str((Path(__file__).parent / Path('ydf_dir')).absolute()))
app = Flask(__name__)
app.config['JSON_AS_ASCII'] = False
app.config['REFRESH_MSEC'] = 1000
auth = HTTPBasicAuth()

bootstrap = Bootstrap(app)


@app.route('/favicon.ico')
def favicon():
    print(Path(__file__).parent / Path('ydf_dir/').absolute())
    return send_from_directory(str(Path(__file__).parent / Path('ydf_dir/').absolute()),
                               'log_favicon.ico', mimetype='image/vnd.microsoft.icon')


@app.route("/ajax0/<path:fullname>/")
def info0(fullname):
    fullname = f'/{fullname}'
    position = int(request.args.get('position'))
    current_app.logger.debug(position)
    # if os.path.isfile(full_name):
    #     fo = open(full_name,encoding='utf8')
    #     content  = fo.read()
    #     return content
    # else :
    #     return "There is no log file"

    with open(fullname, 'rb') as f:
        try:
            if position == 0:
                f.seek(-50000, 2)
            else:
                f.seek(position, 0)
        except Exception:
            current_app.logger.exception('讀取錯誤')
            f.seek(0, 0)
        content_text = f.read().decode()
        # nb_print([content_text])
        content_text = content_text.replace('\n', '<br>')
        # nb_print(content_text)
        position_new = f.tell()
        current_app.logger.debug(position_new)
        # nb_print(len(content_text))

        return jsonify(content_text=content_text, position=position_new)


@app.route("/ajax/<path:fullname>/")
def info(fullname):
    fullname = f'/{fullname}'
    position = int(request.args.get('position'))
    current_app.logger.debug(position)
    # if os.path.isfile(full_name):
    #     fo = open(full_name,encoding='utf8')
    #     content  = fo.read()
    #     return content
    # else :
    #     return "There is no log file"

    with open(fullname, 'rb') as f:
        try:
            if position == 0:
                f.seek(-50000, 2)
            else:
                f.seek(position, 0)
        except Exception:
            current_app.logger.exception('讀取錯誤')
            f.seek(0, 0)
        lines = f.readlines()
        content_text = ''
        for line in lines:
            line = line.strip().decode()
            if '- DEBUG -' in line:
                color = '#00FF00'
            elif '- INFO -' in line:
                color = '#00FFFF'
            elif '- WARNING -' in line:
                color = 'yellow'
            elif '- ERROR -' in line:
                color = '#FF00FF'
            elif '- CRITICAL -' in line:
                color = '#FF0033'
            else:
                color = ''
            content_text += f'<p style="color:{color}"> {line} </p>'

        # content_text = f.read().decode()
        # # nb_print([content_text])
        # content_text = content_text.replace('\n', '<br>')
        # # nb_print(content_text)
        position_new = f.tell()
        current_app.logger.debug(position_new)
        # nb_print(content_text)

        return jsonify(content_text=content_text, position=position_new)


@app.route("/view/<path:fullname>")
def view(fullname):
    view_html = '''
    <html>
    <head>
    <title>查看 %s </title>
    <script type="text/javascript" src="http://libs.baidu.com/jquery/2.1.1/jquery.min.js">
    </script>
    </head>
    <body>
    <div id="result"></div>
    <hr>
    <button οnclick="toggle_scroll()"> 自動滾動瀏覽器滾動條 </button>
    &nbsp;
    <div style="display: inline" id="auto_scroll_stat">ON</div>
    <button id= "runButton"  style="margin-left:300px" οnclick="startOrStop()"> 運行中 </button>
    <button id= "runButton"  style="margin-left:300px" > <a href="/%s/d" download="%s">下載 %s</a></button>
    </body>
    <script>
    var autoscroll = "ON";
    toggle_scroll = function(){
        if(autoscroll == "ON") autoscroll = "OFF";
        else autoscroll = "ON";
    }
    var position = 0;
    function downloadFile(){

    }
    get_log = function(){
     $.ajax({url: "/%s/a", data: {"position":position} ,success: function(result){
        console.debug(4444);
        var resultObj = result;
        console.debug(6666);
        //var html = document.getElementById("div_id").innerHTML;
        var html = $("#result").html();
        var  htmlShort = html.substr(-40000);
        console.debug(htmlShort);
        document.getElementById("result").innerHTML = htmlShort || "";
        console.debug($("#result").html());
        $("#result").append( resultObj.content_text);
        console.debug(resultObj.position);
        position = resultObj.position;
        if(autoscroll == "ON")
            window.scrollTo(0,document.body.scrollHeight);
        $("#auto_scroll_stat").text(autoscroll);
     }});
    }
    iid = setInterval(get_log,%s);
    status = 1;
    function startRun(){
            $("#runButton").text("運行中");
            iid = setInterval(get_log,%s);
            status = 1;
        }

    function stopRun(){
        $("#runButton").text("停止了");
        clearInterval(iid);
        status = 0;
    }
    function startOrStop(){
        if(status == 1){
            stopRun();}
        else
            {startRun();}
    }
    </script>
    </html>
    '''
    # return view_html % (logfilename,logfilename,logfilename,logfilename,logfilename, REFRESH_MSEC, REFRESH_MSEC)
    return render_template('/log_view_html.html', fullname=fullname)


@app.route('/download/<path:fullname>', )
def download_file(fullname):
    current_app.logger.debug(fullname)
    return send_file(f'/{fullname}')
    # return send_from_directory(f'/{logs_dir}',
    #                            filename, as_attachment=True, )


@app.route('/scan/', )
@app.route('/scan/<path:logs_dir>', )
def index(logs_dir=''):
    current_app.logger.debug(logs_dir)
    file_ele_list = list()
    dir_ele_list = list()
    for f in (Path('/') / Path(logs_dir)).iterdir():
        fullname = str(f).replace('\\', '/')
        if f.is_file():
            # current_app.logger.debug(str(f).replace('\\', '/')[1:])
            # current_app.logger.debug((logs_dir, str(f).replace('\\','/')[1:]))
            current_app.logger.debug(str(f))
            current_app.logger.debug(url_for('download_file', fullname=fullname[0:]))
            # current_app.logger.debug(url_for('download_file', logs_dir='', filename='windows_to_linux_syn_config.json'))
            file_ele_list.append({'is_dir': 0, 'filesize': os.path.getsize(f) / 1000000,
                                  'url': url_for('view', fullname=fullname[1:]), 'download_url': url_for('download_file', fullname=fullname[1:]), 'fullname': fullname})
        if f.is_dir():
            fullname = str(f).replace('\\', '/')
            dir_ele_list.append({'is_dir': 1, 'filesize': 0,
                                 'url': url_for('index', logs_dir=fullname[1:]), 'download_url': url_for('index', logs_dir=fullname[1:]), 'fullname': fullname})

    return render_template('dir_view.html', ele_list=dir_ele_list + file_ele_list, logs_dir=logs_dir)


@app.template_filter()
def file_filter(filefullname, file_name_part):
    if file_name_part == 1:
        return str(Path(filefullname).parent)
    if file_name_part == 2:
        return str(Path(filefullname).name)


@app.context_processor
def dir_processor():
    def format_logs_dir_to_multi(logs_dir):
        parent_dir_list = list()
        pa = Path(f'/{logs_dir}')
        while True:
            parent_dir_list.append({'url': url_for('index', logs_dir=pa.as_posix()[1:]), 'dir_name': pa.name[:]})
            pa = pa.parent
            if pa == Path('/'):
                parent_dir_list.append({'url': url_for('index', logs_dir=''), 'dir_name': '根目錄'})
                break
        return parent_dir_list

    return dict(format_logs_dir_to_multi=format_logs_dir_to_multi)


@auth.verify_password
def verify_password(username, password):
    if username == 'root' and password == '123456':
        return True
    return False


@app.before_request
@auth.login_required
def before_request():
    pass


if __name__ == "__main__":
    # main()
    print(app.url_map)

    app.run(host="0.0.0.0", threaded=True)

上面的這段代碼，需要注意的，應用運行在默認端口號5000端口，登入的用戶名是root，密碼是123456。

接下來再創建模板文件：
dir_view.html

{% extends 'bootstrap/base.html' %}

{% block title %} {{ logs_dir }} {% endblock %}
{% block scripts %}
    {{ super() }}
    <script>
        (function ($) {
            //插件
            $.extend($, {
                //命名空間
                sortTable: {
                    sort: function (tableId, Idx) {
                        var table = document.getElementById(tableId);
                        var tbody = table.tBodies[0];
                        var tr = tbody.rows;

                        var trValue = new Array();
                        for (var i = 0; i < tr.length; i++) {
                            trValue[i] = tr[i];  //將表格中各行的信息存儲在新建的數組中
                        }

                        if (tbody.sortCol == Idx) {
                            trValue.reverse(); //如果該列已經進行排序過了，則直接對其反序排列
                        } else {
                            //trValue.sort(compareTrs(Idx));  //進行排序
                            trValue.sort(function (tr1, tr2) {
                                var value1 = tr1.cells[Idx].innerHTML;
                                var value2 = tr2.cells[Idx].innerHTML;
                                return value1.localeCompare(value2);
                            });
                        }

                        var fragment = document.createDocumentFragment();  //新建一個代碼片段，用於保存排序後的結果
                        for (var i = 0; i < trValue.length; i++) {
                            fragment.appendChild(trValue[i]);
                        }

                        tbody.appendChild(fragment); //將排序的結果替換掉之前的值
                        tbody.sortCol = Idx;
                    }
                }
            });
        })(jQuery);
    </script>
{% endblock %}

{% block content %}

    <div class="container" style="width: 80%">
        <span class="label label-default">常用文件夾</span>
        <a class="label label-primary" href="{{url_for('index',logs_dir='pythonlogs/')}}" target="_blank">pythonlogs/</a>
        <a class="label label-primary" href="{{url_for('index',logs_dir='data/supervisorout')}}" target="_blank">data/supervisorout/</a>
        <table class="table" id="table1">
            {#  <caption> / {{ logs_dir }} 的文件瀏覽</caption> #}
            <caption>  {% for dir_item in format_logs_dir_to_multi(logs_dir)|reverse %}
                /<a href="{{ dir_item.url }}" >  {{ dir_item.dir_name }}</a>
            {% endfor %}
                &nbsp;的文件瀏覽
            </caption>
            <thead>
            <tr>
                <th οnclick="$.sortTable.sort('table1',0)">
                    <button>名稱</button>
                </th>
                <th>

                </th>
                <th οnclick="$.sortTable.sort('table1',2)">
                    <button>文件大小</button>
                </th>
                <th>下載文件</th>
            </tr>
            </thead>
            <tbody>
            {% for ele in ele_list %}
                {% if ele.is_dir %}
                    <tr class="warning">
                        {% else %}
                    <tr class="success">
                {% endif %}

            <td><a href="{{ ele.url }}" >{{ ele.fullname | file_filter(2) }}</a></td>
            <td>{{ ele.last_modify_time }}</td>
            <td>{{ ele.filesize }} M</td>
            <td><a href="{{ ele.download_url }}" download={{ ele.fullname | file_filter(2) }}>下載 {{ ele.fullname | file_filter(2) }}</a></td>
            </tr>
            {% endfor %}

            </tbody>
        </table>


    </div>
{% endblock %}

log_view.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>查看 {{ fullname|  file_filter(2) }} </title>
    <script type="text/javascript" src="http://libs.baidu.com/jquery/2.1.1/jquery.min.js">
    </script>
</head>
<style>
    .page {
        background-color: #000000;
        color: #FFFFFF;
    }
</style>
<body class="page">

<div id="result"></div>
<hr>
<button οnclick="toggle_scroll()"> 自動滾動瀏覽器滾動條</button>
&nbsp;
<div style="display: inline" id="auto_scroll_stat">ON</div>
<button id="runButton" style="margin-left:300px" οnclick="startOrStop()"> 運行中</button>
<button style="margin-left:300px"><a href="{{ url_for('download_file',fullname=fullname) }}" download={{ fullname|  file_filter(2) }}>下載 {{ fullname|  file_filter(2) }} </a></button>
<script>
    var autoscroll = "ON";
    toggle_scroll = function () {
        if (autoscroll === "ON") autoscroll = "OFF";
        else autoscroll = "ON";
    };
    var position = 0;

    get_log = function () {
        $.ajax({
            url: "{{  url_for('info',fullname=fullname) }}", data: {"position": position}, success: function (result) {
                console.debug(4444);
                var resultObj = result;
                console.debug(6666);
                //var html = document.getElementById("div_id").innerHTML;
                var resultEle = $("#result");
                var html = resultEle.html();
                var htmlShort = html.substr(-50000);
                console.debug(htmlShort);
                document.getElementById("result").innerHTML = htmlShort;
                console.debug(resultEle.html());
                resultEle.append(resultObj.content_text);
                console.debug(resultObj.position);
                position = resultObj.position;
                if (autoscroll === "ON") {
                    window.scrollTo(0, document.body.scrollHeight);
                }
                $("#auto_scroll_stat").text(autoscroll);
            }
        });
    };
    iid = setInterval(get_log, {{ config.REFRESH_MSEC }});
    runStatus = 1;

    function startRun() {
        $("#runButton").text("運行中");
        iid = setInterval(get_log, {{ config.REFRESH_MSEC }});
        runStatus = 1;
    }

    function stopRun() {
        $("#runButton").text("暫停了");
        clearInterval(iid);
        runStatus = 0;
    }

    function startOrStop() {
        if (runStatus === 1) {
            stopRun();
        } else {
            startRun();
        }
    }
</script>


</body>
</html>

三、運行項目

這樣，整個項目變建立好了，開始運行項目：

點擊 http://127.0.0.1:5000/,你會發現登入失敗，因爲我們沒有給這個url添加路由，在登入地址後面加上scan，http://127.0.0.1:5000/scan/ 就可以看到我們想要的頁面了：

上面是文件夾，下面是目錄，而且還帶下載功能

一個使用python展示目錄的基本功能就實現了。

歡迎關注公衆號：壹家大數據，後臺回覆 “目錄”，獲取工程源碼。

python實現文件夾目錄展示

[轉帖]使用NMT和pmap解決JVM資源泄漏問題原創

Python實現大麥網搶票的四大關鍵技術點解析

Python 安裝庫指令大全

salesforce零基礎學習（一百三十八）零碎知識點小總結（十）

一款開源的.NET程序集反編譯、編輯和調試神器

關於接口協議，你必須要知道這些！

2020年上半年數據庫系統工程師考試

基於 Milvus + LlamaIndex 實現高級 RAG

【2024-05-21】以茶會友

k8s create configmap --from-file 的正確用法

IPV6詳解

ipv6 環境下完美使用scp

【1】linux 常用命令：ls

linux cp 實戰: 一次cp操作引發的災難

https://yachay.unat.edu.pe/blog/index.php?comment_area=format_blog&comment_component=blog&comment_co

linux以太網驅動總結