Создание веб-приложения, которое может работать с локальными файлами

Question

Я хотел бы создать приложение (локальное, а не онлайн) с использованием интерфейсной веб-технологии для пользовательского интерфейса, приложение просто отображает PDF-файлы и имеет несколько текстовых полей, которые пользователь может заполнить в отношении текущегоПросматривая PDF, пользователь может затем экспортировать свои заметки и путь к файлу в документ в формате CSV.

comment about file, some more notes, C:\somefolder\doc1.pdf

comment about file, some more notes, C:\somefolder\doc2.pdf

MyВо-первых, JavaScript не может получить доступ к локальной файловой системе, поэтому я использовал форму загрузки файла, которая работала, за исключением того, что пути к файлам были показаны как пути к файлам BLOB-объектов, а не как фактический путь к системному файлу.Помимо этого, мое «приложение» работало как задумано.

Я пошел и изучил Flask в надежде использовать python для внутреннего интерфейса, что прекрасно работает, за исключением случаев, когда я передаю путь к файлу в pdf C:\SomeFolder\doc1.pdf внутриатрибут src для Chrome говорит, что он не может получить доступ к локальным файлам.Так что я вернулся к sqaure one!

Как я могу создать это приложение с локальным доступом к файлам?

Answer 1

Если вам нужен доступ к локальным файлам, вы можете создать конечную точку в колбе, которая запускает графический диалог с файлами.Это работает только потому, что ваше приложение размещено локально.Вы можете использовать либо tkinter, либо собственный Windows API, используя win32ui.

Если вы используете стандартный формат Flask:

from app import app

@app.route('/file_select', methods=['GET', 'POST'])
def file_select():
    from tkinter import Tk
    from tkinter.filedialog import askopenfilename
    root = Tk()
    root.withdraw()
    # ensure the file dialog pops to the top window
    root.wm_attributes('-topmost', 1)
    fname = askopenfilename(parent=root)
    return jsonify({'filepath': fname})

или используете win32ui API

@app.route('/file_select', methods=['GET', 'POST'])
def file_select():
    import win32ui
    winobj = win32ui.CreateFileDialog(1, ".pdf", "", 0, 
        "PDF Files (*.pdf)|*.pdf|All Files (*.*)|*.*|")
    winobj.DoModal()
    return jsonify({'filepath': winobj.GetPathName()})

Теперь просто добавьте кнопку, которая указывает на маршрут /file_select, и вы откроете диалоговое окно файла через локальный сервер python и вернете выбранный файл.

Answer 2

Предполагая, что вы заходите на страницу через http://localhost:8080/page или что-то в этом роде, вы должны обслуживать свой контент с помощью этого подхода.По сути, вместо того, чтобы предоставлять файлы в качестве путей в локальной файловой системе, вы должны создать маршрут приложения и связать его с обработчиком, а не извлечь соответствующий PDF из локальной файловой системы, а затем отправить обратно ответ, содержащий Content-Type: application/pdf в HTTPЗаголовки ответа и байты файла PDF в теле ответа.

Чтобы не дублировать чужое решение для описанного подхода, я бы рекомендовал взглянуть на этот ответ для "Колбаобработка PDF как отдельной страницы ".

Поскольку вы технически отправляете ответ обратно с localhost - или с любым именем, которому вы его обслуживаете - вместо того, чтобы пытаться загрузитьЛокальный файл непосредственно с веб-страницы клиента, Chrome не должен выдавать никаких жалоб.

Конечно, стоит отметить, что при определении файла для загрузки следует руководствоваться рекомендациями.ничего больше, чем учебный проект.В любой законной системе, которая выполняла подобные действия, было бы необходимо выполнить проверку запрошенных файлов, чтобы гарантировать, что злонамеренный пользователь не злоупотребляет приложением для утечки файлов из локальной файловой системы, помимо тех файлов, которые предназначены для обслуживания.(Для этого у вас обычно может быть элемент src, содержащий параметр, для которого задан хэш / уникальный идентификатор файла, который затем отображается в некоторой базе данных на правильный путь к файлу. В качестве альтернативы вы можете использоватьпараметр в src, который содержит имя файла без полного пути, а затем убедитесь, что предоставленное пользователем значение для этого параметра в запросе не содержит никаких символов вне кодировки, например [a-zA-Z0-9_-].) В конечном счете,Похоже, что это конкретное предупреждение не относится к вашему делу, но все же предоставляет его на тот случай, если кто-нибудь еще прочтет это в будущем.