Help, because I'm losing my mind.
I built an API using Laravel 5.1, and my app uses AngularJS (1.4.5) that communicates with the API. FabricJS plugin creates a Base64 encoded image from a canvas, and I want to send it using AJAX post method to a Laravel post route.
My post data in Javascript looks something like this:
var postData = {
image: "data:image/png;base64,iVBORw0KGgoAAAA(...)",
data: (some arrays and objects)
Now, when I post the data, it's about 2 MB with the image data. On post to Laravel route (post route, no trailing slashes), Laravel returns a 301 Moved Permanently (in Firefox 40.0.2), and in Google Chrome, Network tab displays 301 error followed by error 405 Method Not Allowed with an error in Laravel's RouteCollection.php on line 201.
Post JSON is valid (checked), and post works fine when I don't post the image data (parameter is set to image: null).
Server PHP version is 5.6.12.
Error seemingly gets output when I upload large JPEG files (like, compression 100 or 98). PHP settings says my upload limit is 20MB.
On the other hand, that same post works when the image is a JPEG, full HD, saved from Photoshop with Save for Web..., compression 80 with progressive option enabled.
WORKAROUND
Colleague and I tried this and it worked for us: for some reason, Laravel doesn't like full image data as a string, example:
data:image/png;base64,iVBORw0KGgoAAAA(...)
Solution is to break down that to actual base64 encoded string (in this case iVBORw0KGgoAAAA(...)) and from first part, and pass the file type as another parameter.
So the Javascript object (from top of post) would be something like this:
var postData = {
image: "iVBORw0KGgoAAAA(...)",
imageType: "png",
data: (some arrays and objects)
Using PHP, we reassemble the entire image string (if "png" prepend "data:image/png;base64," to image) and (in our case) use Intervention Image plugin and save image to a directory on a server.
