javascript - 如何使用 laravel 保存裁剪后的头像

Question

所以我的网站(用 laravel 5 构建)允许用户上传图像，裁剪它(使用croppie.js)，但问题是 - 我得到的裁剪图像是基于 64 数据 URI，我不知道如何上传它。

我的试验: 1.最初我使用表单来发布它 - 但现在我得到了base64 URI，我不能将它放在一些<input>中表单中的元素，如下所示:

<form.....>

	<div class="actions"> 
	    <button class="file-btn"> 
	        <div>Upload</div>
	        <input name="original" type="file" id="upload"/> 
	    </button> 
	    <div class="crop"> 
	        <div id="upload-demo"></div> 
	    </div> 
	    <div id="result"></div> 
	</div>
	<input id="image" type="hidden" name="image"> 

</form>

如果我可以将生成的 base64 URI 绑定(bind)到隐藏输入，那就完美了!但我就是做不到..

我可以将 base64 发送到 Controller - 然后呢？我应该将很长的字符串存储在数据库中，还是在服务器端生成图像，然后存储在服务器中？

似乎第一种方法更容易，但我已经谷歌搜索了 4 个小时但没有得到答案......

Answer 1

• 裁剪图片，生成base64 uri
• 将 base64 uri 发布到 Laravel 端点
• 在服务器端解码 base64 uri 并存储图像

这应该有助于解码部分:

Convert Base64 string to an image file?