从前端上传图像并将其显示在用户的个人资料页面上

Question

在我的网站上，我让注册会员创建多个个人资料，每个个人资料都有自己的头像。

在“创建个人资料”页面上，我有此输入来提交化身...

...并将其显示在“个人资料”页面上：

如何重新创建图片，如何从“创建配置文件”上传一幅图片并显示在“图片”页面上？

我知道每个页面的源文件在哪里，但是很遗憾，我无法重新创建它。

谢谢。

Answer 1

您需要3个步骤来上传图像文件，存储图像并将其发送给前端用户。

• 如果您的应用程序是SPA，并且您不想在用户浏览器中重新加载页面，则需要一个JS进程来从文件按钮读取文件并将其发送到服务器（通过AJAX作为FormData对象用于例）

• 然后，您的服务器应该能够处理formdata对象请求并从中读取文件内容。 完成后，您必须将其保存在安全的服务器端位置。

• 最后（再次使用SPA），您的服务器应能够在客户要求时回答图片数据

  • 当客户端询问时，服务器应能够提供头像的URL（例如，带有Restful API ）
  • 当客户端使用图像的url时，服务器应能够授予对图像的访问权限