Hello friends,
I am trying to upload my gallery image on php server also I want to retrieve it and display on app.
please help me to upload image and display it.
Thank you
For file-uploads you should use the cordova-file-transfer plugin.
On you backend side you can store the image directly in a folder.
Then you can directly get the image over its path.
Another solution:
Put it in the database as a blob.
Allow to access the image over an url that points to an endpoint in your backend --> this simply returns the image.
The second approach is more dynamic if you want to handle access control to your static files.
1 Like
could you please give me an example/code of retrieving image and data from php server to app
1 Like
Hi @devmahesh,
In one of my project I am using this code… I used base64 format but not blob (to save base64 use longtext datatype)
This is my PHP code…
<?php
header('Access-Control-Allow-Origin: *');
include 'config.php';
$location = $_POST['directory'];
$uploadfile = $_POST['fileName'];
$uploadfilename = $_FILES['file']['tmp_name'];
$doctor_id = $_POST['doctor_id'];
$type = pathinfo($uploadfile, PATHINFO_EXTENSION);
$all_types = array('jpg', 'png', 'pcd', 'fpx', 'jpeg', 'gif', 'tif', 'tiff', 'jif', 'jifi', 'jp2', 'jpx', 'j2k', 'j2c');
$type = strtolower($type);
if (in_array($type, $all_types)) {
echo 'correct type';
if (move_uploaded_file($uploadfilename, $location . '/' . $uploadfile)) {
$imagedata = file_get_contents($location . '/' . $uploadfile);
$base64 = base64_encode($imagedata);
unlink($location . '/' . $uploadfile);
$image = 'data:image/' . $type . ';base64,' . $base64;
$link = mysql_connect($config['host'], $config['username'], $config['password']);
if (!$link) {
die('Could not connect: ' . mysql_error());
}
echo 'Connected successfully';
mysql_select_db($config['database'], $link);
$q = **Write your update or insert query here**;
$result = mysql_query($q);
echo $result;
} else {
echo 'Upload error!' . 'location: ' . $location;
}
} else {
echo 'wrong type file';
}
?>
Base 64 format reduces the work of download in mobile app…
for dispaly send the base64 data to the html img tag like this.
For upload I have used cordova image picker and file transfer.
$scope.user_id = window.localStorage.getItem('user_id');
$scope.doctor_id = window.localStorage.getItem('doctor_id');
window.imagePicker.getPictures(
function (results) {
for (var i = 0; i < results.length; i++) {
// Destination URL
var url = BASE_URL +'upload.php';
var targetPath = results[i];
// File name only
var filename = targetPath.split("/").pop();
var options_tosend = {
fileKey: "file",
fileName: filename,
chunkedMode: false,
mimeType: "image/jpg",
params: {'directory': 'upload', 'fileName': filename, 'doctor_id': $scope.doctor_id, 'user_id':$scope.user_id}
};
$cordovaFileTransfer.upload(url, targetPath, options_tosend).then(function (result) {
console.log("SUCCESS: " + JSON.stringify(result.response));
$ionicPopup.alert({
title: 'Success!',
template: 'Profile Image Changed Successfully'
});
$ionicLoading.hide();
}, function (err) {
console.log("ERROR: " + JSON.stringify(err));
$ionicPopup.alert({
title: 'Sorry!',
template: 'Profile Image not changed , Please try again'
});
$ionicLoading.hide();
}, function (progress) {
// PROGRESS HANDLING GOES HERE
$ionicLoading.show({
template: 'Updating Image...'
});
});
}
}, function (error) {
console.log('Error: ' + error);
},{
maximumImagesCount: 1,
width: 500,
height: 500,
quality: 10
}
);@nagrajunbn8
is it used in php application?
I want code that will be used in ionic framework.
is it possible to solve my problem.
Please help me
Thanks
Hi,
It is a Ionic mobile application with PHP webservices… Not PHP apllication…
See this example… If You still have any doubt … I can attach a example code… I am new to Ionic Fourm and I am not sure how to attach a .zip file here…
An example…
Step1: First for file upload use the code I have given… It will save image in database as a base64 code… Base64 code is very big so use Long Text datatype in the database
Ex : ( data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wBDAAUDBAQEAwUEBAQFBQUGBwwIBwcHBw8LCwkMEQ8SEhEPERETFhwXExQaFRERGCEYGh0dHx8fExciJCIeJBweHx7/2wBDAQUFBQcGBw4ICA4eFBEU… )
Step 2: Display of image…
Get the code from database and use it like this to display as a image…
<img src = {{ write the base 64 code }}>
Output :
Use the link to convert any image to base 64.
http://dopiaza.org/tools/datauri/index.php
In My code I have used this… Both are same…
$base64 = base64_encode($imagedata);
$image = 'data:image/' . $type . ';base64,' . $base64;@nagarjunbn8 I have tried your code, When I’m running application it works well but it doesn’t store or upload image data to database. Please help me to solve this problem.
If possible please send me your example code to my mail maheshbodhagire@gmail.com
Thank You
Hi,
I will add the basic working ionic project to my g-dive and add the link here as soon as possible.
1 Like
Hi,
Sorry I forgot ta add the link on Saturday. I have added a sql file inside in www directory .
Modifiy the url in controller and config.php in /www/server/config.php , it should work file…
https://drive.google.com/open?id=0B-mA7JU7SyK_TEFqRklDZHVLVVk
@nagarjunbn8 I have downloaded your code
It doesn’t work with me.
I have upload server folder to my server and created databse and table as you mentioned all things are done. Connection established successful but cant upload or download image with mysql queries.
when i’m trying to run php script for downloading or uploading image it shows me following error
Warning: mysql_fetch_array() expects parameter 1 to be resource, boolean given in /home/domain/public_html/ionic/server/download.php on line 17
in line no 17 i have
while($rs = mysql_fetch_array($result))
please help to resolve this
It should work fine . Check again
1 Like
@nagarjunbn8 It working dude…
Sorry I forget to change my database name…
but I have one query downloading and uploading working fine but my img is not stored in upload folder.
is it necessary to store image in upload folder?
Thank You so much.
Regards,
Mahesh
It is not needed to save the image in the upload folder .
If you need the image in upload folder for any future enhancements , just uncomment
unlink in the upload.php file.
Hi can you give me access to this link pleas
i have the same issue
Hi,
I guess its downloading … Please take a look again…
Hi, Thanks for your source. I checked it but on click pick image button , The app is closing also you haven’t initiated image picker in controller. Is there anything to change after downloading the project.
@nagarjunbn8
Thanks for the file
@dilipwk
but i have the same issue i can’t pick the image the app is automatically closing
Thank you