Uploading signaturepad bitmap to remote server

Question

I am working on an Android app that includes a signaturepad.

I would like to upload the resulting bitmap to a remote server.

I haven´t found any resources that show how to manage this bitmap and how to convert it to a uploadable format.

This is the function that gets the signaturepad bitmap, and the needed function to upload it to a remote server:

  btnFirmar.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {


                Bitmap signatureBitmap = mSignaturePad.getSignatureBitmap();



                uploadBitmap(signatureBitmap);//WHAT TO DO WITH THIS...




            }
        });

score 0 · Answer 1 · answered Jan 27 '18 at 08:02

I have solved it as follows, using the Volley Library:

 private void uploadBitmap() {

        dialog = new ProgressDialog(getActivity());
        dialog.setMessage("Uploading Signature...");
        dialog.setCancelable(false);

        jsonObject = new JSONObject();
        Bitmap image = signatureBitmap;
       dialog.show();
        ByteArrayOutputStream byteArrayOutputStream = new ByteArrayOutputStream();
        image.compress(Bitmap.CompressFormat.JPEG, 100, byteArrayOutputStream);
        String encodedImage = Base64.encodeToString(byteArrayOutputStream.toByteArray(), Base64.DEFAULT);
        try {
            jsonObject.put(Utils.imageName, numero);
            jsonObject.put(Utils.image, encodedImage);
        } catch (JSONException e) {
            Log.e("JSONObject Here", e.toString());
        }
        JsonObjectRequest jsonObjectRequest = new JsonObjectRequest(Request.Method.POST, Utils.urlUpload, jsonObject,
                new Response.Listener<JSONObject>() {
                    @Override
                    public void onResponse(JSONObject jsonObject) {
                        Log.e("Message from server", jsonObject.toString());
                      dialog.dismiss();
                    //    messageText.setText("Image Uploaded Successfully");
                        Toast.makeText(getActivity(), "Signature Uploaded Successfully", Toast.LENGTH_SHORT).show();
                    }
                }, new Response.ErrorListener() {
            @Override
            public void onErrorResponse(VolleyError volleyError) {
                Log.e("Message from server", volleyError.toString());
                dialog.dismiss();
            }
        });
        jsonObjectRequest.setRetryPolicy(new DefaultRetryPolicy(5000,
                DefaultRetryPolicy.DEFAULT_MAX_RETRIES,
                DefaultRetryPolicy.DEFAULT_BACKOFF_MULT));
        Volley.newRequestQueue(getActivity()).add(jsonObjectRequest);


    }

score 0 · Answer 2 · edited Jun 12 '19 at 17:30

What is the process? For C#, I'm trying to get image and send by HTTP client, perhaps, on the server only get a blank image, this is the code on the Xamarin Forms:

            <forms:SignaturePadView 
            BackgroundColor="Transparent"
            StrokeColor="Blue"
            StrokeWidth="3"
            HeightRequest="250"
            Name="Signature"
        />

And in the View Model:

Stream image = await Signature.GetImageStreamAsync(SignatureImageFormat.Png);

To send:

var bytes = new byte[image.Length];
                await image.ReadAsync(bytes, 0, (int)image.Length);
                string imageBase64 = Convert.ToBase64String(bytes);

On the request:

try
        {
            var client = new HttpClient();
            var response = await client.PostAsync(urlBase,
                new StringContent(string.Format(
                "imgSign={0}",
                imageBase64),
                Encoding.UTF8, "application/x-www-form-urlencoded"));

            if (!response.IsSuccessStatusCode)
            {
                return response.ToString();
            }
            else
            {
                var response = await response.Content.ReadAsStringAsync();
                return response;
            }

        }
        catch
        {
            return null;
        }

Server receives by a Post Request and using file_puts_contents to send image on folder:

if (isset ($image = $_POST['imgSign'])) {
    $dateNow = date("d-m-Y");
    $imageName = 'Id'.$dateNow;
    $image = $_POST['imgSign'];
    $path = "../images/$imageName.png";

    if(file_put_contents($path,base64_decode($image))){
        ...update DB
    }
}

Uploading signaturepad bitmap to remote server

2 Answers2