Hi all,
In today’s tutorial I will show you how to send an image to server using POST method in ANDROID.
Uploading an image to server is a basic requirement in many of our application.
Sending data to server which is using a PHP Script is already explained in this example .
Now in this example I will show you how to send an image file.
For that first we have to read the file, put it in nameValuePairs and then send using HttpPost.
I have already shown you three other methods on uploading a file to server. If you want you can check these posts.
- How to Upload Multiple files in one request along with other string parameters in android?
- Uploading audio, video or image files from Android to server.
- How to upload an image from Android device to server? – Method 4
These are for downloading files from the server.
- How to Download an image in ANDROID programatically?
- How to download a file to your android device from a remote server with a custom progressbar showing progress?
if you want to use the android using php and mysql
please check these posts.
Add Permission
Add “android.permission.INTERNET” permission to your AndroidManifest.xml file.
Note
You need to add the below to your build.gradle since Apache library is deprecated by Google.
android {
useLibrary ‘org.apache.http.legacy’
}
build.gradle
Our Sample build.gradle may look like this.
apply plugin: 'com.android.application' android { compileSdkVersion 23 buildToolsVersion "23.0.3" defaultConfig { applicationId "com.coderzheaven.uploadimage" minSdkVersion 21 targetSdkVersion 23 versionCode 1 versionName "1.0" } buildTypes { release { minifyEnabled false proguardFiles getDefaultProguardFile('proguard-android.txt'), 'proguard-rules.pro' } } } android { useLibrary 'org.apache.http.legacy' } dependencies { compile fileTree(dir: 'libs', include: ['*.jar']) testCompile 'junit:junit:4.12' compile 'com.android.support:appcompat-v7:23.2.1' compile 'com.android.support:design:23.2.1' }
Layout
Our Sample XML layout will look like this.
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" android:paddingBottom="@dimen/activity_vertical_margin" android:paddingLeft="@dimen/activity_horizontal_margin" android:paddingRight="@dimen/activity_horizontal_margin" android:paddingTop="@dimen/activity_vertical_margin" app:layout_behavior="@string/appbar_scrolling_view_behavior" tools:context="com.coderzheaven.uploadimage.MainActivity" tools:showIn="@layout/activity_main"> <Button android:id="@+id/btnSelect" android:layout_width="match_parent" android:layout_height="wrap_content" android:text="Select Image" /> <ImageView android:id="@+id/imgView" android:layout_width="300dp" android:layout_height="300dp" android:layout_gravity="center" /> <Button android:id="@+id/btnUpload" android:layout_width="match_parent" android:layout_height="wrap_content" android:text="Upload Image" /> <TextView android:id="@+id/txtStatus" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_marginTop="20dp" android:gravity="center" android:text="" android:textColor="@android:color/holo_green_light" /> </LinearLayout>
Android Source Code
We will have a separate class for sending image.
Create a class named “UploadImageApacheHttp” and copy the below contents to it.
Before that, download the Base64 file from here which encodeBytes in Base64 Format.
Add it to your project.
File Upload Utility class
package com.coderzheaven.uploadimage; import android.graphics.Bitmap; import android.os.Handler; import android.util.Log; import org.apache.http.HttpResponse; import org.apache.http.NameValuePair; import org.apache.http.client.HttpClient; import org.apache.http.client.entity.UrlEncodedFormEntity; import org.apache.http.client.methods.HttpPost; import org.apache.http.impl.client.DefaultHttpClient; import org.apache.http.message.BasicNameValuePair; import org.apache.http.util.EntityUtils; import java.io.ByteArrayOutputStream; import java.util.ArrayList; public class UploadImageApacheHttp { public static final String TAG = "Upload Image Apache"; public void doFileUpload(final String url, final Bitmap bmp, final Handler handler){ Thread t = new Thread(new Runnable() { @Override public void run() { Log.i(TAG, "Starting Upload..."); final ArrayList<NameValuePair> nameValuePairs = new ArrayList<NameValuePair>(); nameValuePairs.add(new BasicNameValuePair("image", convertBitmapToString(bmp))); try { HttpClient httpclient = new DefaultHttpClient(); HttpPost httppost = new HttpPost(url); httppost.setEntity(new UrlEncodedFormEntity(nameValuePairs)); HttpResponse response = httpclient.execute(httppost); String responseStr = EntityUtils.toString(response.getEntity()); Log.i(TAG, "doFileUpload Response : " + responseStr); handler.sendEmptyMessage(1); } catch (Exception e) { System.out.println("Error in http connection " + e.toString()); handler.sendEmptyMessage(0); } } }); t.start(); } public String convertBitmapToString(Bitmap bmp){ ByteArrayOutputStream stream = new ByteArrayOutputStream(); bmp.compress(Bitmap.CompressFormat.PNG, 90, stream); //compress to which format you want. byte[] byte_arr = stream.toByteArray(); String imageStr = Base64.encodeBytes(byte_arr); return imageStr; } }
Now the Activity that implements it.
Note : Make sure you select the image from the Gallery, because this demo is designed for selecting from Gallery.
MainActivity
package com.coderzheaven.uploadimage; import android.content.Intent; import android.database.Cursor; import android.graphics.Bitmap; import android.net.Uri; import android.os.Bundle; import android.os.Handler; import android.os.Message; import android.provider.MediaStore; import android.support.v7.app.AppCompatActivity; import android.support.v7.widget.Toolbar; import android.util.Log; import android.view.View; import android.widget.Button; import android.widget.ImageView; import android.widget.TextView; import java.io.IOException; public class MainActivity extends AppCompatActivity implements View.OnClickListener { public static final String TAG = "Upload Image"; // I am using my local server for uploading image, you should replace it with your server address public static final String UPLOAD_URL = "http://coderzheaven.com/sample_file_upload/upload_image.php"; public static final String UPLOAD_KEY = "upload_image"; private int PICK_IMAGE_REQUEST = 100; private Button btnSelect, btnUpload; private TextView txtStatus; private ImageView imgView; private Bitmap bitmap; private Uri filePath; private String selectedFilePath; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar); setSupportActionBar(toolbar); imgView = (ImageView) findViewById(R.id.imgView); btnSelect = (Button) findViewById(R.id.btnSelect); btnUpload = (Button) findViewById(R.id.btnUpload); txtStatus = (TextView) findViewById(R.id.txtStatus); btnSelect.setOnClickListener(this); btnUpload.setOnClickListener(this); } Handler handler = handler = new Handler() { @Override public void handleMessage(Message msg) { Log.i(TAG, "Handler " + msg.what); if (msg.what == 1) { txtStatus.setText("Upload Success"); } else { txtStatus.setText("Upload Error"); } } }; private void showFileChooser() { Intent intent = new Intent(); intent.setType("image/*"); intent.setAction(Intent.ACTION_GET_CONTENT); startActivityForResult(Intent.createChooser(intent, "Select Image"), PICK_IMAGE_REQUEST); } @Override protected void onActivityResult(int requestCode, int resultCode, Intent data) { super.onActivityResult(requestCode, resultCode, data); if (requestCode == PICK_IMAGE_REQUEST && resultCode == RESULT_OK && data != null && data.getData() != null) { filePath = data.getData(); selectedFilePath = getPath(filePath); Log.i(TAG, " File path : " + selectedFilePath); try { bitmap = MediaStore.Images.Media.getBitmap(getContentResolver(), filePath); imgView.setImageBitmap(bitmap); } catch (IOException e) { e.printStackTrace(); } } } public String getPath(Uri uri) { String[] projection = {MediaStore.Images.Media.DATA}; Cursor cursor = managedQuery(uri, projection, null, null, null); int column_index = cursor.getColumnIndexOrThrow(MediaStore.Images.Media.DATA); cursor.moveToFirst(); return cursor.getString(column_index); } private void uploadImage() { UploadImageApacheHttp uploadTask = new UploadImageApacheHttp(); uploadTask.doFileUpload(UPLOAD_URL, bitmap, handler); } @Override public void onClick(View v) { if (v == btnSelect) showFileChooser(); else { txtStatus.setText("Uploading Started..."); uploadImage(); } } }
Note : You should do networks operations inside a thread only.
AND you cannot modify UI elements inside a UIThread only.
However you can put in your own package but don’t forget to change the package name otherwise you will get error.
Server part
Create a folder named Upload_image_ANDROID in your htdocs folder and inside that create a file named upload_image.php and copy this code into it.
I am saying the htdocs folder because I am using XAMPP. You change this according to your use.
< ?php $base=$_REQUEST['image']; $binary=base64_decode($base); header('Content-Type: bitmap; charset=utf-8'); $file = fopen('uploaded_image.jpg', 'wb'); fwrite($file, $binary); fclose($file); echo 'Image upload complete!!, Please check your php file directory……'; ?>
Now run your program and check the folder in which your php file resides.
Note: Make sure your server is running.
Here I am uploading the icon image itself.
If you want to upload another file in your SDCARD you have to change this line to give the exact path
Bitmap bitmap = BitmapFactory.decodeResource(getResources(),R.drawable.icon);
For example if I have to upload a file residing in my SDCARD I would change the path like this.
Bitmap bitmap = BitmapFactory.decodeFile("/sdcard/android.jpg");
Source Code
You can download the complete Android studio Source Code from here.
Please send your comments to coderzheaven@gmail.com
Just what I was looking for, appreciate it for posting .
Hi, Please could you tell me what i need to use for main.xml file, thankyou
Lucy
Hello Lucy..
The main.xml file is for the interface. Since in this example it shows how to upload an image to server there is actually no need of an interface. You can put anything in the main.xml file. For example you can have a button which when clicked will upload the image, then put the code provided inside the button click, that’s all.
You have to provide a layout for the setContentView() otherwise the program will not run.
Hi James,
Thanks for the quick response, I confess, i’m an android newbie 🙁
Would you be ever so kind as to help me out getting this to work, i guess all i need is the main.xml with a button that will upload the image, and the code to know that the button is there.
Hope you can help, you can email me if you wish
Thankyou
Lucy
@Lucy : Please wait for the answer we will contact you shortly.
Pingback: How to Download an image in ANDROID programatically? | Coderz Heaven
Very nice tutorial:)
Thank u .Nice Tuto:)
I would like to uploade many images..
How can I give a name for each image?
Pingback: How to Upload Multiple files in one request along with other string parameters in android? | Coderz Heaven
Thanks.
It helps me so much
I prefer to send it just as a byte array
I don’t code for the server.
Thanks a lot
but i have problem with Base64.encodeBytes(byte_arr);
it gives me error :S
Did you include the file Base64.java.
Hi, I have the same problem with Peter gabra, and I have include the Base64.java in the src, could you help me to fixed it?
Did you download the complete source code. Try changing the filename to something else and change accordingly in the main file.
Hi, thanks my problem solve now. I want to ask about base 64, because it just possible to send the image with small size, is there possible to send the image in big size to server using base64?
thanks
hei james nice tutorial. I am a newbie for android. May i have the full source code for this? and also i cannot find the “get picture from sd card gallery” thing like a picker in your code. so how do i pick the pic from my gallery?
Hi,,
Nice post … But I have question what about image captured by Image and store it at Media.EXTERNAL_CONTENT_URI location.
Thanks
It works fine, thanks.
On the server the image gets “uploaded_image” filename.
I’m sending to the server a file from my device’s sd card, it works ok (I have to downsize it though because I get out of memory error)
I want the file name to be the same as the original, how can I do that??
Hey LamprosGk : If you want the filename as such then try this example
http://coderzheaven.com/2011/08/how-to-upload-multiple-files-in-one-request-along-with-other-string-parameters-in-android/
or try this
http://coderzheaven.com/2011/08/uploading-audio-video-or-image-files-from-android-to-server/
Thanks James
I’ve found out how to do it..
(passed the file name in nameValuePairs to the php file
Thank you very very very much!!! This has been a tremendous help!
I’d just like to add one small comment. I would suggest resizing the image before sending it the server because otherwise if the image is too big, it is very likely that you’ll get an out of memory exception.
Bitmap resizedDishImage = Bitmap.createScaledBitmap(dishImage, 150, 150, false);
Hello,
I tried your code and it works fine with a local server, but with a remote server it doesn’t work 🙁
Have you an idea why ?
No, it works perfectly with any server. Please check your server address or anyother parameters you are sending.
hlo sir, is it possible to upload image on cpanel server with this code
yes, ofcourse.
Hello,
Very nice post. Is there a way I can do this using a web app instead of an installed app?
thank you!
I cant see the php code.
Sorry Hari that was problem with my syntax highlighter, please check the post again.
Hello James,
Thanks for the reply. Its working very fine. Thanks man
Hi,
the encodeBytes method is giving me an error saying “encodedBytes is undefined for type Base64” . i have downloaded the Base64 class, and inserted it into my project..could you please help me????
hey this “Bitmap bitmap = BitmapFactory.decodeFile(“/sdcard/mypic.jpg”);” does not work, do you have any idea why?
but if it works whrn i used Bitmap bitmap = BitmapFactory.decodeResource(getResources(),R.drawable.icon);
This is because you don’t have mypic.jpg in that path.
hi i run ur apps successfully…result also displayed successfully.Image upload complete!!, Please check your php file directory……But my doubt is where is uploaded file is saved..how is know the above image is successfully uploaded…where i see the image after successful completion…
The uploaded file will be saved in the uploads directory in your server where your php file is located.
I can’t view the uploaded image, do I need to change anything in the php code, if so pls tell what are the things to be changed , Thank you
Do you have proper permissions in your upload folder?
Wooow… thanku so much. It works great. And how can I upload an image which is captured? where I have modify in this code…?
hi!
can anyone suggest me an alternative to above server side phpscript.
Any help will be appreciated..
hi,
its so excellent tutorial…..i m getting a problem……i want to upload an image on jboss server……what i has to bb done on jboss server……what code i hv to write there…….plz any one guide me………..
hi guys
can i ask qustion?
did i need to write code to start xampp for android?
because i didnt sure cellphone can work?
No Steven, there is no connection between starting the xampp server and android. if your http request have to reach the server, xampp should be on and running.
Hi James
I am Sorry ,Could you tell me
I just need to put the upload_image.php this file to htddocs folder in xampp
Did I need to set any about website?
oh I know where is my problem.
if you want to connection and run in Android cellphone.
Your IP must be entity.
otherwise you can,t connection, this is message for dont understand other guys.
No you can test it locally. The post describes how to work with it locally. If you have a server then put the file in the right place and just change the UR.
i am able to sleect both the files..but when i hit StartUpload button, the upload process dialog box shows for 1 sec and then the error message is shown saying “Unfortunately the process pack.coderzheaven” has stopped.
i have added the internet permission in manifest also.. my Wamp server is On..also i have used localhost instead of 10.0.2.2 in the code.. Can u plz tell me where i am going wrong ?
what is the reason for the error in the logcat? please check that and paste it here.
package pack.coderzheaven;
what is this thing ?
and how come i dint see any package from the coding above ?
example like : package com.sample.testing
opps sorry, when i see the coding above the package seems to be appear as something like this,
span id=”IL_AD1″ class=”IL_AD” package /span pack.coderzheaven;
i only see it as “package pack.coderzheaven;’
after i dropped comment..
Sorry Kyle, that was the problem with the syntax highlighter.
pls help me error
ERROR Permission denied
That’s the problem with you server. Check the permissions.
How to download pictures that i have just uploaded in this localserver i tried putting back in for example ‘http://192.168.1.3/Upload_image_ANDROID/upload_image.php’ where i presume i uploaded but didnt work
Change 192.168.1.3 to 127.0.0.1
I am getting error as null. Bitmap.compress is not working.Can you plz help me..
echo ‘Image upload complete!!, Please check your php file directory……’;
sir i have a problem.. how can we view the image($file) in our page. because u can view the image only in the php..
this is my code
echo ‘$file’ …
code is not workng
http://www.coderzheaven.com/uploading-downloading-files-android/ Try this link. You have to upload the image back or download the image and show it in an imageView.
I have an app that captures an image and displays it.how do I upload the captured image?thanks
You will get the image inside onActivityResult() function. From there save it in a temporary file and then upload using the above example.
Great tutorial 🙂 i am getting ERROR null(showing in toast).Plz help me out…….
So I am …
I have traced that the application stopped at the following statement.
HttpResponse response = httpclient.execute(httppost);
The httppost information is correct. Any idea?
Thanks a lot!
Give internet permission in the Manifest file.
Pingback: Best way to store camera clicked pics on android? : Android Community - For Application Development
Pingback: how to send photo from android device to FTP server : Android Community - For Application Development
setContentView(R.layout.main);
I am getting error on this line and all other lines where R is present
There is R.java file in my gen folder i always get error on this please help!
setContentView(R.layout.main);
you have to chage “main ” according to the name of your xml file .for example : activity_main.xml ,..
After Uploading a file in mnt/sd card to mySQL ,Dialog box is still being uploading..Do I need to remove files in my Gallery (Emulator)???I am not getting Output
great tutorial! but I have a stupid question..
“How does the server know where this image uploaded to?”
I added in the SQL statement for tables and columns. good news is the image string had successfully changed to the image path(eg. sdcard/…../sample.png)
but bad news is.. my server’s image folder does not contain that image that i just uploaded.. may i know which code did i missed out? or what went wrong?
no error code given.. only success all the way..
Server will not know where to upload the files. The folder to upload the file is written by you in the PHP file.
I can’t view the uploaded image, do I need to change anything in the php code, if so pls tell what are the things to be changed , Thank you
Do you have the proper upload location in code?
pls tell me in which line should we provide the upload location
I haven’t changed anything in this code, where should I change, Thank you
Pingback: PHP to ASP.NET code migration | BlogoSfera
I already have the Internet Permission in manifest.Always i try to upload the file i get:
07-23 14:46:12.681: I/System.out(16675): Error in http connection android.os.NetworkOnMainThreadException
Sometimes make a jpg file in server with the name but with 0 size.
About this line: HttpResponse response = httpclient.execute(httppost);
Wait for the response?or make a threat?
It can be the size of the pic to upload?there is a limit?
I tried with small icon pic but nothing.
Hello segen
Do the uploading inside a thread, because on newer versions of android it will not allow network operations to be done in the main thread. Update UI elements inside the thread from another runonUIThread only. Otherwise the application will crash.
I have made an edit to reflect the changes.
Nice work man, Thanks, This is exactly I was looking for. I want to save the file in the root folder but it is toasting the message permission denied. I guess I need to be the super user. How can we do it? Do we need to change in Android or the PHP code.
One more question I need to take pictures from camera and send it without saving it in the phone memory location. I have a code running which takes pictures every 10 Sec but I need to integrate with this, So instead of using BitmapFactory.decodeResource(getResources(),R.drawable.icon); what shall I use?
Regards
Abhishek
Great tutorial, but I get an error on line 33; The method encodeBytes(byte[]) is undefined for the type Base64 and I have the Base64.java in my package. Can you help me out?
Sorry my line 33 is your line 30
Please tell me how can i assign a variable name to my image file which is being uploaded?
please tell me how can i change the name of my image file which is being uploade?
Thank
Hi James, do you have the code to retrieve the image and display it in a listview?
check this code.
http://www.coderzheaven.com/2012/09/23/simplest-lazy-loading-listview-android-data-populated-mysql-database-php/
Hello, I’m having a little trouble with this program. It is with this line:
HttpResponse response = httpclient.execute(httppost);
it says:
Description Resource Path Location Type
Syntax error on tokens, TypeArgumentList1 expected instead NewSpotActivity.java /AndroidConnectingToPhpMySQL/src/com/example/androidhive line 142 Java Problem
Can you show me the source code of main.xml layout of project you use?
great tutorial and it works !! thank you James.
And i have a question ,well i’m triying to follow the speed of the upload .I already did it with the download and it worked .
while ((count = input.read(data)) != -1) {
total += count;
long endtTime = System.currentTimeMillis();
long passed;
passedTime =endtTime – startTotalTime;
// publishing the progress….
// After this onProgressUpdate will be called
publishProgress(“”+(int)((total*100)/lenghtOfFile));
Log.i(“log_lenghtOfFile”,lenghtOfFile+”” );
Log.i(“log_total”,total+”” );
Log.i(“log_ourcentage”,(int)((total*100)/lenghtOfFile)+”” );
Log.i(“log_passed_time”,passedTime +”” );
}
but i had a problem with the uploading i need to get :
t= 10 s uploded data =10byte /total data
t =45 uploaded data =150byte/total data (for example )
Ididn’t found where i could follow the rate of uploading ,i tryed to do that in base64,but it didn’t work.
please if you have an idea help me.
hey i m new to android development, i want to do my final year project based on this. can u plz send me complete code with main.xml and menifest.xml.. plzz mail me the code as soon as possible. ur help is very iportant for me. plz
Thank you very much………thanks a loooooooooooooot..
God bless you
Pingback: how to send the image in an ImageView to a php server? - PHP Solutions - Developers Q & A
Where to see the uploaded image?
Check the directory specified in the code.
is it necessary to use
header('Content-Type: bitmap; charset=utf-8');
or can we remove that?
didn’t try removing it.
Silly me.. I forgot to change the request tag in the PHP script. Working perfect now. Thanks for this. It’s just what I needed. Simple enough for me to understand and a good starting point. Next I will try to assign a specific file name, put the file name in my database, and also retrieve the image back to my list view.
OK. Great
Notice: Undefined index: image in C:\wamp\www\Upload_image_ANDROID\upload_image.php on line 2
i found this error while running server part code and i also run this code on wamp
Hi how to upload both image file and string details from android to server using post methode with basic namevalue pairs can u give some sample code please.
You can simply copy paste the code into an Activity and it will work.
excellent tutorial have to do a lot of changes but at the end code works….
if you don’t the errors then follow these steps..
1
permission (internet)(read external storage) in manifest file
2
download base64 file to your project package where image file is placed
3
then some exceptions that android studio will handle as well
4
thanks to JAMES nice tutorial…..
5
setContentView(here put you xml file just and rest is fine…just run the code now and image will be uploaded to the website through app…:)….. )
6
some may have errors regarding gradle build
use sdk min 8 max 21
This is great, Thank you!! Could you please post both php files??
Hi Gabriel, which is the second php file you are asking about?