为什么Nginx无法在AJAX请求中使用base64图像（Laravel，Javascript，Nginx）

Question

All other AJAX requests (signIn, SignUp, basicInformation, educationDetail etc) successfully done, but when I upload profile picture (base64) and send to laravel controller then nginx server doesn't work and return error... I don't know where I missed something.. I increase upload file size and also increase buffer size but all time response same. Please help me ...

Cropped Image function in .js

 jQuery('.cropped_image').on('click', function (ev) {           
    $image_crop.croppie('result', {
            type: 'canvas',
            size: 'viewport'
    }).then(function (response) {
        if(response != "data:image/png;base64,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"){
            html = '<img id="croped-image-source" src="' + response + '" />';
            jQuery("#cropped-image-preview-section").html(html);
            profilePictureTemp = response;
            isPicSet = true;
            let data = new FormData();
            data.append('profile_picture',response);
            jQuery.ajax({
                method: "POST",
                url: "/imag-store",
                data: data,
                cache: false, 
                contentType: false,
                processData: false,
                headers: {
                    'X-CSRF-TOKEN': jQuery('meta[name="csrf-token"]').attr('content')},
                beforeSend: function () {
                    jQuery('#btn_submit').addClass('hidden');
                    jQuery('#loaderClass').removeClass('hidden');
                    console.log("Before Sending");
                },
                success: function (response) {
                    console.log('success');
                    console.log(response);




                },
                error: function (jqXHR, exception) {
                    var msg = '';
                    if (jqXHR.status === 0) {
                        msg = 'Not connect.\n Verify Network.';
                    } else if (jqXHR.status == 404) {
                        msg = 'Requested page not found. [404]';
                    } else if (jqXHR.status == 500) {
                        msg = 'Internal Server Error [500].';
                    } else if (exception === 'parsererror') {
                        msg = 'Requested JSON parse failed.';
                    } else if (exception === 'timeout') {
                        msg = 'Time out error.';
                    } else if (exception === 'abort') {
                        msg = 'Ajax request aborted.';
                    } else {
                        msg = 'Uncaught Error.\n' + jqXHR.responseText;
                    }
                    jQuery('#btn_submit').removeClass('hidden');
                    jQuery('#loaderClass').addClass('hidden');
                    console.log(msg);
                }

            });
        }

    });
}); 

web.php

Route::post('/imag-store','ExpertInfoController@storeProfilePicture');

ExpertInfoController.php

 public function storeProfilePicture(Request $request){
$data = $request->get('experts_profile_picture'); 
if(substr($data, 11, strpos($data, ';')-11) == "png"){
  $data = str_replace('data:image/png;base64,', '', $data);
 $data = str_replace(' ', '+', $data);
 $filename = 'experts_img'
               .rand()
                .'_'.time()
              .".png";

   $year = date("Y");
    $month = date("m");
    $path = PUBLIC_PATH_TO_STORE_IMAGE.'/images/experts/'.$year.'/'.$month.'';
     echo "Now entering create";
     echo ($path);

     $file = self::makeDirectory($path,0777,true,true);
      $file_path = $path.'/'.$filename;
      file_put_contents($file_path,base64_decode($data));
      $pic = str_replace(PUBLIC_PATH_TO_STORE_IMAGE,'',$file_path);
        }
        else{
            $pic = $request->get('experts_profile_picture');
        }
  $info = new ExpertInfo;
 $info->experts_profile_picture = $pic;
$info->save();
}

helloexperts.conf

server {
        client_max_body_size 20m;

        listen       80;

        server_name  helloexperts.dev;

        root        /var/www/vhosts/helloexperts.com/httpdocs/html/public;

        add_header X-Frame-Options "SAMEORIGIN";
         add_header X-XSS-Protection "1; mode=block";
        add_header X-Content-Type-Options "nosniff";
        # Load configuration files for the default server block.
        include /etc/nginx/default.d/*.conf;

        location / {
        try_files $uri $uri/ /index.php$is_args$args;
        #try_files $uri $uri/ /index.php?$query_string;
        root         /var/www/vhosts/helloexperts.com/httpdocs/html/public;
        }
        index  index.php index.html index.htm;
        charset utf-8;


        location = /favicon.ico { access_log off; log_not_found off; }
        location = /robots.txt  { access_log off; log_not_found off; }
#       #add_header 'Access-Control-Allow-Origin' '*';


  error_page 404 /404.html;
            location = /40x.html {
        }

        error_page 500 502 503 504 /50x.html;
            location = /50x.html {
        }
location ~ \.php$ {
         root         /var/www/vhosts/helloexperts.com/httpdocs/html/public;
        try_files $uri =404;
        fastcgi_param REMOTE_ADDR $http_x_real_ip;
        fastcgi_pass   127.0.0.1:9000;
        fastcgi_index  index.php;
        fastcgi_param  SCRIPT_FILENAME  $document_root$fastcgi_script_name;


        #client_header_buffer_size 64k;
        #large_client_header_buffers 4 64k;


       fastcgi_buffer_size 128k;
            fastcgi_buffers 256 16k;
            fastcgi_busy_buffers_size 256k;
            fastcgi_temp_file_write_size 256k;



        fastcgi_param PHP_VALUE "upload_max_filesize = 20M \n post_max_size = 20M";
         add_header 'Access-Control-Allow-Origin' '*';
        include        fastcgi_params;
# add_header 'Access-Control-Allow-Origin' '*';
    }
 location ~ /\.(?!well-known).* {
        deny all;
    }

Answer 1

Can you confirm the route by doing

php artisan route::list

. if the route does not exist try these commands .

php artisan cache:clear

php artisan route:cache

hope it helps. cheers!

Update i see the issue is in your code.you can use the following code to get the image from input . (i assume thats what you are trying to do)

$base64img = $request->input('image');

        if($base64img){
            // get the base-64 from data
            $file = substr($base64img, strpos($base64img ,",")+1);

            // decode base64 string
            $image = base64_decode($file); 

            $pos = strpos($base64img, ';');
            $imageType = explode('/', substr($base64img, 0, $pos))[1];