将用户上传的图像保存到文件夹和/或服务器

时间:2018-07-18 08:03:25

标签: javascript reactjs canvas

我有一个应用程序,允许用户上传图像,裁剪图像以及其他数据,将其全部保存为html文件,以用作电子邮件的页脚。图像以base64的形式提供给他们。

但是事实证明,Outlook不支持此功能,因为它不接受b64数据作为img源。

所以我的想法是将裁剪后的图像保存到文件中,比如说/public/avatars/avatar.png并将其目录链接为源。但是我在寻找一种方法来使用JS将图像保存到文件时遇到麻烦。我允许的堆栈是JS和React,没有node.js。

我该怎么做?我可以将文件作为b64 ot画布元素之一使用,因此只要保存到文件中,我在这里就很灵活。

我也愿意接受其他解决方案。

1 个答案:

答案 0 :(得分:1)

您不能仅使用客户端语言保存文件。您必须将其保存到服务器,自己的服务器或外部服务器或AWS之类的服务中。

最好不要使用服务器端的解决方案(强烈)是使用API​​保存图像并从该API获取链接。然后,您可以使用此链接指向Outlook。

您可以免费使用https://aws.amazon.com/fr/cloudfront/一年,每月50Go和2 millon请求。

如果您每年的图片不超过300,000张,则可以使用此服务:https://cloudinary.com/pricing

您也可以使用https://www.deviantart.com/developers/,但这并不是服务的重点。

奇怪的解决方案:

请注意,您的FTP用户的登录名和密码将在您的代码源中提供。最低权限必须得到管理。

您可以使用此脚本从JS与FTP服务器对话(未经测试,但似乎可行):http://www.petertorpey.com/files/ae/scripts/FTPConnection.jsx

您可以尝试类似的方法:

var ftp = new FtpConnection("ftp://URL") ;
ftp.login("username", "password");

ftp.cd("FOLDER") // For move to folder
ftp.put(file,"FILE.PNG") ; // File must be a File JS Object

ftp.close() ;