Android WebView:在Android客户端上传图片。无法在服务器端JavaScript中获取文件类型

时间:2015-02-02 07:56:00

标签: android webview image-uploading

我已经测试了stackOverFlow上的所有可用代码,但它仍无效。

我使用Android 4.4.4并使用WebView将图像上传到服务器网页,但无法获取服务器JavaScript代码中的文件类型

alert("type:" + input.files[0].type);  

如果我添加文件类型检查代码,则会失败。

我已在桌面设备(Ubuntu)Chrome,Firefox和iOS UIWebView上对其进行了测试。所有这些都有效。服务器端将打印文件类型。 只有Android 4.4.4 WebView失败。

服务器 upload_file.html

<!DOCTYPE html>
<html>
    <head>
        <script type="text/javascript" language="Javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
    </head>
    <body>
        <input type='file' class="imageUpload" multiple="true" />
        <div class="imageOutput"></div>

        <script language="javascript" type="text/javascript">
            $images = $('.imageOutput')

            $(".imageUpload").change(function(event){
                readURL(this);
            });

            function readURL(input) {

                if (input.files && input.files[0]) {
                    alert("type:" + input.files[0].type);        

                    $.each(input.files, function() {
                        var reader = new FileReader();
                        reader.onload = function (e) {           
                            alert("path:" + e.target.result);
                            $images.append('<img src="'+ e.target.result+'" />')
                        }
                        reader.readAsDataURL(this);
                    });
                }
            }
        </script>
    </body>
</html>

客户端(Android) MainActivity.java

public class MainActivity extends Activity {

    private static final int FILE_CHOOSER_RESULT_CODE = 1;

    WebView mWebView;

    private ValueCallback<Uri> mUploadMessage;

    private Context mContext;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        mContext = this;

        mWebView = (WebView) findViewById(R.id.webview);
        mWebView.setWebViewClient(new CustomWebViewClient());

        mWebView.setWebChromeClient(new WebChromeClient() {
            public void openFileChooser(ValueCallback<Uri> uploadMsg, String acceptType, String capture){


                mUploadMessage = uploadMsg;

                MainActivity.this.startActivityForResult(Intent.createChooser(intent, "File Chooser"), FILE_CHOOSER_RESULT_CODE);

                Intent intent = new Intent(Intent.ACTION_PICK,android.provider.MediaStore.Images.Media.EXTERNAL_CONTENT_URI);
                startActivityForResult(intent, FILE_CHOOSER_RESULT_CODE);

            }
        });
        WebSettings webSettings = mWebView.getSettings();
        webSettings.setJavaScriptEnabled(true);
        CookieManager.setAcceptFileSchemeCookies(true);
        CookieManager cookieManager = CookieManager.getInstance();
        cookieManager.setAcceptCookie(true);
        mWebView.loadUrl("http://192.168.1.30/upload_file.html");
    }

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

        if(requestCode == FILE_CHOOSER_RESULT_CODE) {
            if(mUploadMessage == null)
                return;
            Uri result = intent == null || resultCode != RESULT_OK ? null : intent.getData();
            Log.d("Ting", "after result:" + result);
            mUploadMessage.onReceiveValue(result);
            mUploadMessage = null;
        }
    }

    private class CustomWebViewClient extends WebViewClient {
    }

任何人都有想法如何获取正确的文件类型?

感谢。 埃里克

2 个答案:

答案 0 :(得分:1)

在Android 2.2中开始支持Android WebView中的文件上传。它工作正常,直到4.3(包括在内)。 4.4没有文件上传支持,只在5.0中重新引入。

但是,如果你仔细看看Android 4.4,你会发现在4.4.3和4.4.4版本中已经(部分)修复了这个问题。

这两个版本再次提供文件上传支持。但是,缺点是这两个版本的文件扩展名将被删除,因此MIME类型始终为application/octet-stream

您可以查看此库:

https://github.com/delight-im/Android-AdvancedWebView

以下是检查文件上传可用性的方法:

https://github.com/delight-im/Android-AdvancedWebView/blob/ecff154ef390a0dbdb5337bd5dea2055205c104f/Source/src/im/delight/android/webview/AdvancedWebView.java#L1011

答案 1 :(得分:0)

你可以从Uri获得realPath。然后使用methed Uri.from(文件文件)获取新的Uri.At最后,使用new uri可以获得文件扩展名