我应该如何构造对Vue.js上传的后端响应?

时间:2019-07-16 16:12:18

标签: php express vue.js file-upload axios

(上下文:使用管理门户构建公司网站,允许用户创建新的团队成员,工作等,并使Web应用程序反映这些更改。)

我有一个托管在服务器上的Vue.js Web应用程序(例如GoDaddy或BlueHost),并且我希望能够将pdf和图像上传到同一服务器,然后在Web应用程序中的其他位置引用这些文件。 我对前端很满意,并且已经弄清楚如何制作一个上载组件,该组件允许选择文件,然后选择axios帖子。

这是我的困惑开始的地方...

首先,我想必须可以将文件上传到我的服务器并将其存储在这里。

接下来,我认为我应该能够在服务器上的某个位置放置一些代码(PHP或Express或其他内容)以接受这些存储请求。

最后,我认为代码可能需要放在Web应用程序的根目录中,以便Web应用程序可以轻松地引用它。

(旁注:我已经尝试过Google Cloud Functions,虽然它们可以让我将图像存储在Firebase中,但我不知道如何在Web应用程序中引用这些照片。我还尝试了使用Express进行设置一个api端点,但是通过Postman进行的每个发布请求都使我停滞不前,而且不确定如何解决它。)

有人可以从axios帖子中概述出应该发生的事情,并让我对它的结构看起来有一个基本的了解吗?

我愿意学习实现这一目标所需的一切。

1 个答案:

答案 0 :(得分:0)

按照here所述,使用axios在post方法中使用'Content-Type': 'multipart/form-data'标头将文件发送到服务器

使用multer npm处理将文件上传到服务器。

示例链接here