Selasa, 28 Agustus 2012

Android Upload File Gambar ke Web (Pemrograman Android)

Kali ini Penulis ingin membagi Pengetahuan tentang Cara Membuat Aplikasi untuk Mengupload File Gambar atau Dokumen dengan Android ke Server Web.

Pertama-tama, siapkan dahulu Kode Program di Web Server. Misalnya kia gunakan Web Server XAMPP Apache dengan bahasa PHP. Maka kita siapkan file untuk menerima hasil upload. Misal dengan nama web-receiver-upload\receiver-upload.php :


<?php

$target_path = "dokumen/";

$target_path = $target_path . basename( $_FILES['uploadedfile']['name']);

if(move_uploaded_file($_FILES['uploadedfile']['tmp_name'], $target_path)) {
echo "File ". basename( $_FILES['uploadedfile']['name']).
" berhasil diupload";
} else{
echo "Terjadi kesalahan!";
}

?>



Buka Eclipse, buat Project Android Baru. Misalnya dengan Nama WebUploader dengan Nama Activity Utama MainActivity




Kemudian buatlah kelas baru.


Beri nama, misal dengan nama uploader


Tambahkan kode program berikut ini pada Class uploader tersebut :

package com.amijaya.webuploader;
import java.io.DataOutputStream;
import java.io.FileInputStream;
import java.io.InputStream;
import java.net.HttpURLConnection;
import java.net.URL;

import android.os.AsyncTask;
import android.widget.TextView;

public class uploader extends AsyncTask<Object, String, Object>
{
URL connectURL;
String params;
String responseString;
String fileName;
byte[] dataToServer;
FileInputStream fileInputStream;
TextView info;
void setUrlAndFile(String urlString, String fileName, TextView info)
{
this.info = info;
try
{
fileInputStream = new FileInputStream(fileName);
connectURL = new URL(urlString);
}
catch(Exception e)
{
publishProgress(e.toString());
}
this.fileName = fileName;
}
synchronized void doUpload()
{
String lineEnd = "\r\n";
String twoHyphens = "--";
String boundary = "*****";
try
{
publishProgress("Uploading...");
HttpURLConnection conn = (HttpURLConnection) connectURL.openConnection();
conn.setDoInput(true);
conn.setDoOutput(true);
conn.setUseCaches(false);
conn.setRequestMethod("POST");
conn.setRequestProperty("Connection", "Keep-Alive");
conn.setRequestProperty("Content-Type", "multipart/form-data;boundary="+boundary);
DataOutputStream dos = new DataOutputStream( conn.getOutputStream() );
dos.writeBytes(twoHyphens + boundary + lineEnd);
dos.writeBytes("Content-Disposition: form-data; name=\"uploadedfile\";filename=\"" + fileName +"\"" + lineEnd);
dos.writeBytes(lineEnd);
int bytesAvailable = fileInputStream.available();
int maxBufferSize = 1024;
int bufferSize = Math.min(bytesAvailable, maxBufferSize);
byte[] buffer = new byte[bufferSize];
int bytesRead = fileInputStream.read(buffer, 0, bufferSize);
while (bytesRead > 0)
{
dos.write(buffer, 0, bufferSize);
bytesAvailable = fileInputStream.available();
bufferSize = Math.min(bytesAvailable, maxBufferSize);
bytesRead = fileInputStream.read(buffer, 0, bufferSize);
}
dos.writeBytes(lineEnd);
dos.writeBytes(twoHyphens + boundary + twoHyphens + lineEnd);
fileInputStream.close();
dos.flush();
InputStream is = conn.getInputStream();
int ch;
StringBuffer buff = new StringBuffer();
while((ch=is.read())!=-1)
{
buff.append((char)ch);
}
publishProgress(buff.toString());
dos.close();
}
catch (Exception e)
{
publishProgress(e.toString());
}
}
@Override
protected Object doInBackground(Object... arg0) {
doUpload();
return null;
}
protected void onProgressUpdate(String... progress) {
this.info.setText(progress[0]);
    }
}



Kemudian buka file res/layout/main.xml. Desain tampilan utama sebagai berikut :


<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    >
<TextView  
    android:layout_width="fill_parent" 
    android:layout_height="wrap_content" 
    android:text="@string/hello"
    />
<TextView android:text="@+id/TextView01" android:id="@+id/TextView01" android:layout_width="wrap_content" android:layout_height="wrap_content"></TextView><Button android:text="Upload" android:id="@+id/Button01" android:layout_width="wrap_content" android:layout_height="wrap_content"></Button>

</LinearLayout>


Tambahkan satu buah TextView dan satu buah Button :


Kemudian untuk nanti mengetes program kita, siapkan dahulu HP / Tablet Android. Koneksikan ke PC / Laptop kita misal dengan Wireless atau Tethering. Kemudian pada Laptop / PC jalankan Start-Run- CMD. ketikkan perintah ipconfig untuk mengetahui IP Address milik Laptop/PC sebagai server.



Berdasarkan IP Address yang didapatkan, buka file src/..../MainActivity.java. Masukkan kode program berikut ini :


package com.amijaya.webuploader;

// http://cariprogram.blogspot.com
// nuramijaya@gmail.com
import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.Button;
import android.widget.TextView;

public class MainActivity extends Activity {
    /** Called when the activity is first created. */
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);
        
        Button button01 =(Button)findViewById(R.id.Button01);
        button01.setOnClickListener
        (
        new OnClickListener()
            {
           public void onClick(View v)
           {
            try
            {
            uploader upl = new uploader();
            upl.setUrlAndFile("http://192.168.43.150/web-receiver-upload/receiver-upload.php", "/sdcard/nexus7.jpg",(TextView)(findViewById(R.id.TextView01))); 
            //android.os.Environment.getExternalStorageDirectory() + "/nexus7.jpg";
           
            upl.execute();
            }
            catch(Exception e)
            {
            ((TextView)findViewById(R.id.TextView01)).setText(e.toString());
            }            
           }
            }
        );

    }
}



Jangan lupa buka file AndroidManifest.xml. Tambahkan permission untuk Mengakses Internet dan Read External Storage :


<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
      package="com.amijaya.webuploader"
      android:versionCode="1"
      android:versionName="1.0">
    <application android:icon="@drawable/icon" android:label="@string/app_name">
        <activity android:name=".MainActivity"
                  android:label="@string/app_name">
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />
                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>

    </application>
    <uses-sdk android:minSdkVersion="8" />
    <uses-permission android:name="android.permission.INTERNET" />
    <uses-permission android:name="android.permission.READ_OWNER_DATA" /> 
    <uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE"></uses-permission>
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE"></uses-permission>
</manifest> 



Oh ya, untuk pengetesan aplikasi, kita siapkan juga file yang akan diupload di SDCARD di HP/Tablet Addroid. Misalnya /sdcard/nexus7.jpg.


Untuk memastikan bahwa HP / Tablet bisa terhubung ke Server Web pada PC / Laptop. Buka Browser, ketikkan IP Address pada Browser Mobile Tersebut. Seharusnya Muncul sebagai berikut jika memakai Web Server XAMPP


Jalankan Aplikasi dari Eclipse ke HP/Tablet Android.


Klik Upload, hasilnya file /sdcard/nexus7.jpg berhasil diupload.


Project selengkapnya dapat didownload disini. Pada Google Docs, klik File-Download.

Semoga Bermanfaat.