FilePicker can't get file path in web. (当使用web打开方式时，文件选择器无法获取选择的文件路径)

[lasifea]

Duplicate Check

• I have searched the opened issues and there are no duplicates

Describe the bug

It runs properly on the desktop, but can't load image on the web. Finally, I found the path attribute of FilePickerFile is None, so how could I load image from local files if it runs on the web?

Code sample

Code

    def filepicker_close_event(self, e: ft.FilePickerResultEvent):
        """文件选择对话框关闭时触发的事件"""
        if e.files is not None:
            print(e.files)
            img_obj = e.files[0]

            with open(img_obj.path, 'rb') as f:
                img_data = f.read()
            img_b64 = b64encode(img_data).decode('utf-8')
            self.image.src_base64 = img_b64
            self.image.data = img_obj.name

To reproduce

I made a simple example.

import flet as ft


def main(page: ft.Page):
    """问题测试"""
    page.horizontal_alignment = ft.CrossAxisAlignment.CENTER
    page.vertical_alignment = ft.MainAxisAlignment.CENTER

    def btn_click_event(e: ft.ControlEvent):
        dialog = ft.FilePicker(on_result=dialog_close_event)
        page.overlay.append(dialog)
        page.update()
        dialog.pick_files('选择文件')

    def dialog_close_event(e: ft.FilePickerResultEvent):
        print(e.files)
        page.overlay.remove(e.control)
        page.update()

    btn = ft.ElevatedButton('打开文件框', on_click=btn_click_event)

    page.add(btn)


ft.app(main, view=ft.AppView.WEB_BROWSER)

Expected behavior

No response

Screenshots / Videos

Captures

Operating System

Windows

Operating system details

Windows10

Flet version

0.23.2

Regression

I'm not sure / I don't know

Suggestions

No response

Logs

Logs

[Paste your logs here]

Additional details

No response

[lk-itween]

https://flet.dev/docs/controls/filepicker#save_file 👈This indicates that this function is only valid on the desktop platform.

By combining on_upload event, files can be uploaded to your local current working directory.

This function might only returns the file name and does not actually retrieve the file, it is impossible to know the exact location of the file from the web.

I hope Flet team can provide a better solution.
A possible solution:

def main(page: Page):
    page.horizontal_alignment = CrossAxisAlignment.CENTER
    page.vertical_alignment = MainAxisAlignment.CENTER

    def upload_event(e: FilePickerUploadEvent):
        """use handler function"""

    def result_event(e: FilePickerResultEvent):
        if e.page.web:
            # pre upload file
            e.control.data = e.files[0].name
            file = FilePickerUploadFile(e.files[0].name, e.page.get_upload_url(e.files[0].name, 3600))
            e.control.upload([file])
        else:
            # handler function
            pass

    filepicker_dialog = FilePicker(on_result=result_event, on_upload=upload_event)
    page.overlay.append(filepicker_dialog)
    page.update()

    filepicker_dialog.pick_files(
        initial_directory='.',  # only desktop platform
        file_type=FilePickerFileType.CUSTOM,
    )

[lasifea]

https://flet.dev/docs/controls/filepicker#save_file 👈This indicates that this function is only valid on the desktop platform.

By combining on_upload event, files can be uploaded to your local current working directory.

This function might only returns the file name and does not actually retrieve the file, it is impossible to know the exact location of the file from the web.

I hope Flet team can provide a better solution. A possible solution:

def main(page: Page):
    page.horizontal_alignment = CrossAxisAlignment.CENTER
    page.vertical_alignment = MainAxisAlignment.CENTER

    def upload_event(e: FilePickerUploadEvent):
        """use handler function"""

    def result_event(e: FilePickerResultEvent):
        if e.page.web:
            # pre upload file
            e.control.data = e.files[0].name
            file = FilePickerUploadFile(e.files[0].name, e.page.get_upload_url(e.files[0].name, 3600))
            e.control.upload([file])
        else:
            # handler function
            pass

    filepicker_dialog = FilePicker(on_result=result_event, on_upload=upload_event)
    page.overlay.append(filepicker_dialog)
    page.update()

    filepicker_dialog.pick_files(
        initial_directory='.',  # only desktop platform
        file_type=FilePickerFileType.CUSTOM,
    )

Thanks!