问题标签 [filepond]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
1 回答
911 浏览

javascript - Filepond无法在本地保存文件

我需要为新网站获取一个简单的文件上传解决方案。我正在尝试 Filepond 进行上传和一个小程序将文件保存到本地文件系统。

我在一台全新的 Ubuntu LTS 18 机器上浏览了以下代码。

https://codeunshackled.com/2018/11/03/React-File-Uploader-With-Node-Express/

Filepond 不提供错误详细信息,显示消息“上传期间出错”。我曾尝试使用 onerror 事件,但console.log似乎没有被触发。服务器和前端都在不同端口的同一个 Linux 机器上。

有一种替代服务器方法使用所谓的PHP Boilterplate via vagrant。那里的虚拟机无法启动,对于小文件上传解决方案来说看起来太麻烦了。

我已成功使用以下 Nodejs 代码上传文件并保存。但是,如果我尝试将 Filepond 指向该服务器,它只会给出相同的模棱两可的消息,“上传期间出错”。

0 投票
0 回答
895 浏览

php - 使用带有 Filepond 和 Php 后端的 reactjs 上传文件

在对 reactjs 中的文件上传进行了一些研究之后,我遇到了 Filepond,它似乎是一个很棒的解决方案,并且实际上可以处理我使用 Yii2(php) 框架在我的应用程序中上传文件时所需的一切。

我已经安装了 FillPond 并按照https://itnext.io/uploading-files-with-react-and-filepond-f8a798308557所示的基本教程进行操作,它对我很有用。

我实际上可以将文件从这里上传到我的 Yii2 框架中并成功保存。

现在,我希望能够与其他表单数据一起上传和提交表单中的文件。我不知道这是否可能?如果是,请问我该怎么做?

我还看到了裁剪和调整大小的选项,我对使用它们非常感兴趣。我如何使用这个插件,因为我看不到如何安装或集成它们。(我已经成功安装了预览版)。

注意:我已经阅读了整个https://pqina.nl/filepond/docs/patterns/api/filepond-instance并且看到了诸如 instantUpload 之类的属性,以及诸如 processFile 之类的函数。但是当我尝试整合它们时,它们不仅结果很好,也不会像我想要的那样工作

这是我的渲染代码

我的提交功能

我的 Yii2 API 看起来像这样

请对此的任何想法将不胜感激。

0 投票
0 回答
541 浏览

reactjs - 如何使用 FIlepond 编码插件获取编码文件数据

我正在尝试获取编码的 base64 数据并将其与其他表单字段一起传递

0 投票
2 回答
2335 浏览

javascript - How to define an initial image preloaded in filepond?

I'm doing a laravel view of the editing of a record, which has an image associated with it, and I need it to appear preloaded inside the input file, so that if you submit, the same image is sent, or if you want to change it.

Now it shows like this

enter image description here

But I should show in this way enter image description here

0 投票
0 回答
563 浏览

node.js - 使用 FilePond 和 multer (expressjs) 上传文件时出错

我编写了一个使用 FilePond 文件上传器的反应应用程序,但无法让 multer 接受来自 filepond 的请求,它总是返回 500 错误。

如果我使用标准文件上传控件,则服务器接受请求并且文件上传正常。

有人对可能导致这种情况的原因有任何想法吗?

谢谢

这是我的 server.js 代码:

0 投票
1 回答
1245 浏览

javascript - FilePond React Crop 插件

我正在尝试在后端使用 Firebase 为 React.js 实现 Filepond 库的插件。关于实现裁剪插件的文档很薄。我想做的就是对添加为个人资料图片的每张图像强制采用 1:1 的裁剪比例,但是使用当前代码,它挂在Waiting for size - Loading...

在此处的文档中提到,提示结合使用转换插件来获取裁剪功能,但不确定如何使用该create()功能来获取此功能。

有没有按照我的意图实施作物的例子?或者有人可以告诉我他们是如何让它工作的吗?谢谢!

代码:

0 投票
1 回答
700 浏览

reactjs - react-filepond 如何实现获取删除/选择的文件并处理它们并上传?

我正在使用react-filepond实现一个应用程序,一旦用户选择/删除文件,我需要获取 uris(用于文件)以从端点(服务器)上传,然后使用这些 uris 上传到我们的存储。 (同时也向用户显示上传进度)

正在使用onupdatefiles道具发送 getURIs 请求,然后使用 onprocessfile/onprocessfilestart 使用检索到的 URI 上传这些文件,这是最好的方法吗?

还有我们在onprocessfileprogress(file,progress)中得到的 progess 参数有什么用?它可以用于将进度反馈回filepond组件吗?

0 投票
1 回答
171 浏览

reactjs - react-filepond 实现在文件浏览器中仅查看支持的文件类型

我已经在 React 中为 .fbx 文件实现了文件类型验证,并在 fileValidateTypeDetectType 中完成了自定义文件类型检测。此外,对于我的应用程序,我希望用户在选择文件时只能在文件浏览器中看到 fbx 文件。有没有办法添加一个接受道具,比如在 HTML 文件输入中,这样用户只能在文件浏览器中查看 fbx 文件

0 投票
1 回答
2457 浏览

javascript - Filepond提取base64反应js

尝试从图像上传中获取 base64 并将其发送到服务器。使用其他值,我可以获得隐藏输入的值。Api 配置为一次获取​​ 2 个文件,因此我此时无法单独处理上传

从上传图像的值映射“数据”时遇到问题,我尝试了简单的映射方法,但仍然失败。

我的代码如下

0 投票
1 回答
605 浏览

reactjs - ReactJS + NodeJS 服务器 + Filepond 上传文件

我有一个简单的 reactJS 应用程序。在这个应用程序中,我有一个正在测试 Filepond 组件的网页。我还有一个 nodeJs 服务器,文件上传时由 Filepond 组件调用。这是定义 Filepond 组件时的代码:

我想要的是?1 - 上传单个PDF文件 2 - 上传文件时将uploadId传递给服务器

怎么了?=> 文件已上传,但不考虑接受的FileTypes="application/pdf" 因为我可以选择任何文件,无论其类型如何

=> 我无法传递/获取 uploadId 值

关于如何实现这 2 点的任何帮助?

除了这两点,该组件运行良好,我能够正确上传文件。

谢谢,

此致