Android Upload Image to Server using Volley Tutorial

Uploading images to our server is a very frequently used thing. In most of the apps, we need user avatar, i.e. user profile image. So here is Android Upload Image to Server Tutorial.
In this post, we will see how we can upload images from our Android app to our server. Then we will also see how do we fetch the uploaded images back to our android application. So let’s begin.

Tools Required

  • Xampp/Wamp as for the server end I am going to use PHP and MySQL.
  • Android Studio, it is obvious that we need it for building our application

Creating Database and RESTful API

Database

Here, we will upload and store the image file to our server’s directory, and in the database, we will save the path to the image with some tags for that picture. So the first thing here we need is the database.

  • Go to localhost/phpmyadmin and create the following table names images in your database.
upload image to server
Database Table
  • To create the above-given table, you can use the following SQL Query.

  • Once you have the database table, you can start building the API.

API

  • Now create a folder inside c:/xampp/htdocs (the root directory if you are using xampp), you can name this folder anything. I have created a folder named MyApi.
  • Inside the folder create a file named api.php and write the following php code.

  • Now we need to test the API.

Testing the API

  • For testing our API I am here using POSTMAN, but you can use any tool you want.
upload image to server api
Upload Image to Server API
  • So, the upload call is perfect. Now let’s test the fetch images call.

upload image to server api

  • It is perfect as well. Now we can jump on Android Side.

Android Upload Image to Server using Volley

Creating an Android Project

  • Now, we will create a new Android Studio project with an Empty Activity.
  • As we are going to use Volley first, we will add it to the project.

Adding Volley

  • Come inside dependencies block of app level build.gradle file and add volley here, as shown below.

  • Now sync your project.

Adding Permissions

  • We also need Internet and Read Storage permission. So inside AndroidManifest.xml add these permissions.

User Interface

  • Now come inside activity_main.xml and put the following xml code.

  • The above code will generate the following layout.
upload image to server interface
Upload Image to Server Interface
  • The layout is very simple, we have an EditText and a Button only.

Defining EndPoints

  • We will create a separate class to store our URL Endpoints. Remember using localhost will not work and you need to find the ip of your xampp. You can find the ip using ipconfig command in windows and ifconfig in linux/mac.
  • Create a class named EndPoints and write the following code here.  

Volley MultiPart Request

  • Here, we need to perform a multipart request. But the problem is volley doesn’t support multipart request directly. So that is why we need our Custom Volley Request. I found this code on GitHub and made little modifications. I am thankful to the author for his contribution.
  • Create a class named VolleyMultipartRequest and write the following code.

Upload Image to Server

  • Now the last thing is uploading the image, and we will do it inside MainActivity.java.

  • That’s it now you can try running your application.
Android Upload Image to Server
Android Upload Image to Server
  • So upload is working fine. Now the next step is fetching the uploaded images back.

Getting the Images Back to our Application

  • We already created the API call to get all the uploaded images.

android download image from server

  • Now we can use this URL to get the images back. I have already posted a tutorial about this. So for this part you can visit the below tutorial.

Building a RecyclerView with Images and Text

Android Upload Image to Server Source Code

  • If you are having any trouble following the post, then you can get my source code as well.

So that’s it for this Android Upload Image to Server tutorial friends. If you have any confusion, query or question, just comment it below. And if you think this post is useful please SHARE it with your friends. Thank You 🙂

27 thoughts on “Android Upload Image to Server using Volley Tutorial”

  1. yo!! bruh. . If I wanna update users image based on their email then will this code work for me, with little changes like insert will change to update tags will change to email ?? and can i change this part of code with email since I’m using sqlite to store users data on android after registration.
    “protected Map getParams() throws AuthFailureError {
    Map params = new HashMap();
    params.put(“tags”, tags);
    return params;
    }”

    Reply
  2. thank you !!!!!!!!!!
    the code is working very much perfect i need a code for uploading the captured images to the server please help me out with the code plsssssssssssssssssssssssssss

    Reply
  3. hi
    when i run app its shows uninstall and force stop buttons, nothing happen after doing both. pls rply asap. thank you in dvance

    Reply
  4. Hi,
    Your code works fine on localhost. I Tried uploading the same on my server. It is not working.
    Can you please help me in this

    Reply
  5. hi belal, i used this code but consistently i am facing these errors.. why these files are not importing in my studio?

    In AndroidmultipartEntity activity :

    public AndroidMultiPartEntity(final ProgressListener listener) {
    super(this);
    this.listener = listener;
    }

    public AndroidMultiPartEntity(final HttpMultipartMode mode,
    final ProgressListener listener) {
    super(this);
    this.listener = listener;
    }

    public AndroidMultiPartEntity(HttpMultipartMode mode, final String boundary,
    final Charset charset, final ProgressListener listener) {
    super(this.mode, boundary, charset);
    this.listener = listener;
    }

    Reply
  6. Good day Sir. The tutorial was very helpful. However, After I’m done doing what you taught, I am having trouble inserting the images via phone and i can’t see any error either. I can’t see the new uploaded images in the database. The postman was working fine though.

    Reply
  7. good tutorial. but how can we resize image before upload? because when i resize image in bitmap.compress to become 50, the file size still same. thanks

    Reply
  8. com.android.volley.VolleyError: java.lang.NullPointerException: Attempt to invoke virtual method ‘boolean android.graphics.Bitmap.compress(android.graphics.Bitmap$CompressFormat, int, java.io.OutputStream)’ on a null object reference

    Reply
  9. Thanks for the tuto it works perfectly, yet i’m facing a problem when i try to use it in kotlin , it shows constant errors, i’d like to know if there’s the same tuto but in kotlin.

    Thanks

    Reply

Leave a Comment