blobfile send image javascirpt code example

Example 1: upload bloob javascript

var fd = new FormData();
fd.append('fname', 'test.wav');
fd.append('data', soundBlob);
$.ajax({
    type: 'POST',
    url: '/upload.php',
    data: fd,
    processData: false,
    contentType: false
}).done(function(data) {
       console.log(data);
});

Example 2: upload blob to server

var file = $('#fileInput').get(0).files.item(0); // instance of File
$.ajax({
  type: 'POST',
  url: 'upload.php',
  data: file,
  contentType: 'application/my-binary-type', // set accordingly
  processData: false
});

Example 3: insert image as blob using ajax

index.php
						// image insert
                        $('#insert_form').submit(function(event){
                            event.preventDefault();
                            var image_name = $('#image').val();
                            if(image_name == '')
                            {
                                // alert("Please Select Image");
                                return false;
                            }
                            else
                            {
                                var extension = $('#image').val().split('.').pop().toLowerCase();
                                if(jQuery.inArray(extension, ['gif','png','jpg','jpeg']) == -1)
                                {
                                    alert("invalid image file")
                                    $('#image').val('');
                                    return false;
                                }
                                else
                                {
                                    $.ajax({
                                        url:"insertimage.php",
                                        method:"POST",
                                        data:new FormData(this),
                                        contentType:false,
                                        processData:false,
                                        success:function(data)
                                        {
                                             alert(data);
                                            fetch_data();
                                            $('#insert_form')[0].reset();
                                             $('#imageModal').modal('hide');
                                        }
                                    });
                                }
                            }
                        });




insertimage.php

if(isset($_POST["action"]))
    {

      if($_POST["action"] == "insert") // for insert image
      {
          $file = addslashes(file_get_contents($_FILES["image"]["tmp_name"]));
          $query = INSERT INTO table_name (column1) VALUES ('$image');
          if(!mysqli_query($connection, $query))
          {
              die(mysqli_error($connection));

          };
      }
    }