在上传不工作之前,Android webview中的图像预览

时间:2013-11-13 07:11:47

标签: javascript android jquery android-webview

我正在制作一个Android webview应用程序,我在这里面临一个问题。 我想在上传之前在网页上预览我的图像 这是我使用的html and java script代码。

<!DOCTYPE html>
<html>
<head>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>


<script type="text/javascript">

$(document).ready(function(){
    var preview = $(".upload-preview img");

    $(".file").change(function(event){
       var input = $(event.currentTarget);
       var file = input[0].files[0];
       var reader = new FileReader();
       reader.onload = function(e){
           image_base64 = e.target.result;
           preview.attr("src", image_base64);
       };
       reader.readAsDataURL(file);
    });
});

</script>

</head>

<body>
<div class="upload-preview">
    <img />
</div>
<input class="file" name="logo" type="file">

</body>
</html>

这里是fiddle

它几乎适用于所有浏览器(即Firefox,Chrome和IE),没有任何错误或警告。这是firefox的快照(在上传前显示预览) enter image description here

现在每当我尝试在Android webview中打开它时,它都没有显示图像预览 它显示了这样的东西

enter image description here

我不知道什么是错的,我已启用javascript并包含jquery。它有一天让我疯狂。

这是我的android webview代码。

package net.kaosfield.wv1;

import my.functions.MyFunctions;
import android.net.Uri;
import android.os.Bundle;
import android.annotation.SuppressLint;
import android.app.Activity;
import android.content.Intent;
import android.util.Log;
import android.view.KeyEvent;
import android.view.Menu;
import android.webkit.ValueCallback;
import android.webkit.WebChromeClient;
import android.webkit.WebViewClient;
import android.webkit.WebSettings;
import android.webkit.WebView;
import android.webkit.JsResult;
import android.content.Intent;
import com.google.android.gcm.GCMRegistrar;

public class MainActivity extends Activity {

Activity activity = MainActivity.this;

private WebView webView = null;

private ValueCallback<Uri> uploadMessage;

private final static int FILECHOOSER_RESULTCODE = 1;

private static String registrationId = "";

private MyFunctions myFunctions;

@Override
protected void onActivityResult(int requestCode, int resultCode,
        Intent intent) {
    if (requestCode == FILECHOOSER_RESULTCODE) {
        if (uploadMessage == null)
            return;
        Uri result = intent == null || resultCode != RESULT_OK ? null
                : intent.getData();
        uploadMessage.onReceiveValue(result);
        uploadMessage = null;
    }
}

@SuppressLint("SetJavaScriptEnabled")
@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);

    myFunctions = new MyFunctions(activity);

            webView = (WebView) findViewById(R.id.webview);
    webView.setInitialScale(myFunctions.setWebViewScale());

    WebSettings webSettings = webView.getSettings();
    webSettings.setJavaScriptEnabled(true);
    webView.setWebViewClient(new WebViewClient() {
        public boolean shouldOverrideUrlLoading(WebView view, String url) {
            if (url.startsWith("net.kaosfield.wv1:")) {
                Log.d("wv1", url);
                return true;
            }
            return false;
        }

        @Override
        public void onPageFinished(WebView view, String url) {
            Log.d("wv1", "onPageFinished");
            String argument = "d.e.f";
            view.loadUrl("javascript:alert(window.method(\"" + argument
                    + "\"))");
        }
    });
    webView.setWebChromeClient(new WebChromeClient() {
        @Override
        public boolean onJsAlert(WebView view, String url, String message,
                JsResult result) {
            if (message.equals("net.kaosfield.wv1")) {
                try {
                    Log.d("wv1", "url: " + url + ", message: " + message);
                    return true;
                } finally {
                    result.confirm(); // in order not to alert
                }
            } else {
                return false;
            }
        }

        // For Android 3.0+
        @SuppressWarnings("unused")
        public void openFileChooser(ValueCallback<Uri> uploadMsg) {
            uploadMessage = uploadMsg;
            Intent i = new Intent(Intent.ACTION_GET_CONTENT);
            i.addCategory(Intent.CATEGORY_OPENABLE);
            i.setType("image/*");
            MainActivity.this.startActivityForResult(
                    Intent.createChooser(i, "File Chooser"),
                    FILECHOOSER_RESULTCODE);
        }

        // For Android 3.0+
        @SuppressWarnings("unused")
        public void openFileChooser(ValueCallback<Uri> uploadMsg,
                String acceptType) {
            uploadMessage = uploadMsg;
            Intent i = new Intent(Intent.ACTION_GET_CONTENT);
            i.addCategory(Intent.CATEGORY_OPENABLE);
            i.setType("image/*");
            MainActivity.this.startActivityForResult(
                    Intent.createChooser(i, "File Browser"),
                    FILECHOOSER_RESULTCODE);
        }

        // For Android 4.1
        @SuppressWarnings("unused")
        public void openFileChooser(ValueCallback<Uri> uploadMsg,
                String acceptType, String capture) {
            uploadMessage = uploadMsg;
            Intent i = new Intent(Intent.ACTION_GET_CONTENT);
            i.addCategory(Intent.CATEGORY_OPENABLE);
            i.setType("image/*");
            MainActivity.this.startActivityForResult(
                    Intent.createChooser(i, "File Chooser"),
                    MainActivity.FILECHOOSER_RESULTCODE);
        }
    });

     webView.loadUrl("http://blue.genetechz.com/qadir/test.php");
}

@Override
public boolean onCreateOptionsMenu(Menu menu) {
    // Inflate the menu; this adds items to the action bar if it is present.
    getMenuInflater().inflate(R.menu.main, menu);
    return true;
}

@Override
public boolean onKeyDown(int keyCode, KeyEvent event) {
    // Check if the key event was the Back button and if there's history
    if ((keyCode == KeyEvent.KEYCODE_BACK) && webView.canGoBack()) {
        webView.goBack();
        return true;
    }
    // If it wasn't the Back key or there's no web page history, bubble up
    // to the default
    // system behavior (probably exit the activity)
    return super.onKeyDown(keyCode, event);
}

}

1 个答案:

答案 0 :(得分:3)

您必须在onActivityRestult上进行此更改,因为从库中返回的网址不正确:

@Override
protected void onActivityResult(int requestCode, int resultCode,
        Intent intent) {
    if (requestCode == FILECHOOSER_RESULTCODE) {

        if (uploadMessage == null)
            return;

        Uri result = intent == null || resultCode != RESULT_OK ? null
                : intent.getData();
        if (result!=null){

            String filePath = null;

            if ("content".equals(result.getScheme())) {

                Cursor cursor = this.getContentResolver().query(result, new String[] { android.provider.MediaStore.Images.ImageColumns.DATA }, null, null, null);
                    cursor.moveToFirst();   
                    filePath = cursor.getString(0);
                    cursor.close();

            } else {

                filePath = result.getPath();

            }

            Uri myUri = Uri.parse(filePath);
            uploadMessage.onReceiveValue(myUri);

        } else {

            uploadMessage.onReceiveValue(result);

        }

        uploadMessage = null;
    }
}

现在,即使您从图库中选择了图片,它也会返回一个file:///格式的网址。