Mohd Azwan
Mohd Azwan

Reputation: 101

how to upload image using flutter and php in the MySQL

I wanna ask how can I post an image file to the MySQL using post method? Since what I did is only upload the file pathway and not the image.

my post request:

Future addProduct() async{

var url = 'http://10.0.2.2/foodsystem/addproduct.php';


http.post(url, body: {
  "productname": controllerName.text,
  "productprice": controllerPrice.text,
  "producttype": controllerType.text,
  "product_owner": globals.userId,
  "image": _image.path,
  //"image": _image.path.split('/').last,
});

my PHP code:

<?php

  include 'conn.php';


  $product_owner = $_POST['product_owner'];
  $productname = $_POST['productname'];
  $productprice = $_POST['productprice'];
  $producttype = $_POST['producttype'];
  $image = $_POST['image'];

  //$realImage = base64_decode($image);

  $connect->query("INSERT INTO product (product_name, product_price, product_type, product_owner, image) VALUES 
('".$productname."','".$productprice."','".$producttype."','".$product_owner."','".$image."')")


?>

my MySQL table

enter image description here

Upvotes: 1

Views: 11686

Answers (4)

Mohd Azwan
Mohd Azwan

Reputation: 101

This is the solution that I use to upload the image to the database. Basically, I am using the image path to save into MySQL. Then the image itself I save it in the htdoc folder and it works.

Flutter code: (important library need to be imported first)

import "package:async/async.dart";

import 'package:path/path.dart';

import 'dart:io';

import 'package:http/http.dart' as http;

Future addProduct(File imageFile) async{
// ignore: deprecated_member_use
var stream= new http.ByteStream(DelegatingStream.typed(imageFile.openRead()));
var length= await imageFile.length();
var uri = Uri.parse("http://10.0.2.2/foodsystem/uploadg.php");

var request = new http.MultipartRequest("POST", uri);

var multipartFile = new http.MultipartFile("image", stream, length, filename: basename(imageFile.path));

request.files.add(multipartFile);
request.fields['productname'] = controllerName.text;
request.fields['productprice'] = controllerPrice.text;
request.fields['producttype'] = controllerType.text;
request.fields['product_owner'] = globals.restaurantId;

var respond = await request.send();
if(respond.statusCode==200){
  print("Image Uploaded");
}else{
  print("Upload Failed");
}

PHP code:

<?php

  include 'conn.php';


  $image = $_FILES['image']['name'];
  $product_owner = $_POST['product_owner'];
  $productname = $_POST['productname'];
  $productprice = $_POST['productprice'];
  $producttype = $_POST['producttype'];

  $imagePath = "uploads/".$image;

  move_uploaded_file($_FILES['image']['tmp_name'],$imagePath);
  $connect->query("INSERT INTO product (product_name, product_price, product_type, product_owner, image) VALUES ('".$productname."','".$productprice."','".$producttype."','".$product_owner."','".$image."')");
//$connect->query("INSERT INTO product (product_name,image) VALUES ('".$productname."','".$image."')");

?>

Result in MySQL:

enter image description here

Result in htdoc folder:

enter image description here

Upvotes: 4

Asiri Hewage
Asiri Hewage

Reputation: 647

Yes, you can store images in the database, but it's not advisable in my opinion, and it's not general practice.

A general practice is to store images in directories on the file system and store references to the images in the database. e.g. path to the image,the image name, etc.. Or alternatively, you may even store images on a content delivery network (CDN) or numerous hosts across some great expanse of physical territory, and store references to access those resources in the database.

Images can get quite large, greater than 1MB. And so storing images in a database can potentially put unnecessary load on your database and the network between your database and your web server if they're on different hosts.

You'll need to save as a blob, LONGBLOB datatype in mysql will work.

CREATE TABLE 'test'.'pic' (
    'idpic' INTEGER UNSIGNED NOT NULL AUTO_INCREMENT,
    'caption' VARCHAR(45) NOT NULL,
    'img' LONGBLOB NOT NULL,
  PRIMARY KEY ('idpic')
)

its a bad practice but it can be done. Not sure if this code would scale well, though.

  $data = file_get_contents($_FILES['photo']['tmp_name']);

Upvotes: 0

Vinay Jain
Vinay Jain

Reputation: 428

You can actually store image in MySQL . It's primitive type is BLOB. it's useful if image size is less, as image can loaded fast. If image size is large then time to load it would be large hence it's not recommended to do so. Storing image path is still a better option.

Upvotes: 0

dshukertjr
dshukertjr

Reputation: 18612

You are actually correct about storing path of the image into MySQL instead of the actual image data. MySQL is not built to store image data.

You can send image data to the backend with the way they describe here: How to upload images and file to a server in Flutter?

Then once you receive the image data, you can store the image in a directory in the server. What you save in MySQL should only be a image path within the server or a URL to the image.

Upvotes: 1

Related Questions