2

I am doing a project like Social media using Laravel and Vue. Here people can post up to 10 photos at a time. But I want them resized before uploading using javascript. So that I converted them into base64 string image and then send them to Laravel intervention to make image and store them.

It works when I post 1/2 or 3 photos. But It shows "405 Method Not Allowed" when I upload more than 3 photos.

Where the problems exactly occurs ? Is base64 string is too large for payload?

My route Route::post('/user/post/submit', 'PostController@storePost');

My axios post method in Vue 

if (this.textInput != null || this.uploadedImages.length > 0) {

    axios.post("/user/post/submit", this.file).then(res => {
      //

    });
  }

My Base64 string

const vm = this;
  if (vm.uploadedImages.length > 0) {
    for (var i = 0; i < vm.uploadedImages.length; i++) {
      let attachment = vm.uploadedImages[i][0];

      var base64_str = attachment.replace('data:image/png;base64,', '');
      var base64_str_rep = base64_str.replace(' ', '+');
          if(base64_str_rep){
            console.log(base64_str_rep)
            vm.file.append("images["+i+"]", base64_str_rep);
          }


    }
  }
Reidwanul Bari Zion
  • 91
  • 2
  • 8
  • This is a long shot, but maybe this is caused by the size of the request. Did you try to use smaller images to see if it works. It should return 413 if the size is too large. – Radu Diță Mar 04 '19 at 09:42
  • For 5 small size images it works. But not for medium size images. But I am compressing all the images to width 600px using canvas. My aim is to upload any size images but that will be compress to 600px width images. – Reidwanul Bari Zion Mar 04 '19 at 10:06
  • Then your problem is related to the maximum allowed size for a post request. Try to increase that limit. Look over this answer https://stackoverflow.com/questions/6135427/increasing-the-maximum-post-size – Radu Diță Mar 04 '19 at 10:23
  • Ok thanks. I will check this also. – Reidwanul Bari Zion Mar 04 '19 at 11:04

0 Answers0