通过Javascript将图像从android原生相机上传到服务器答案

【问题标题】：Upload image to the server from android native camera via Javascript通过Javascript将图像从android原生相机上传到服务器
【发布时间】：2017-01-09 09:14:46
【问题描述】：

我的html页面的小提琴jsfiddle

现在使用它我可以在安卓设备中打开本机相机。

但我无法保存图像，然后将此图像发送到服务器，以便我可以将其保存在我的数据库中。

从设备库中选择图片发送并保存到服务器后，我可以做什么？

打开使用的原生相机功能：

 function choosePhoto() {
        var file = Android.choosePhoto();
        window.alert("file = " + file);
    }

【问题讨论】：

您是否在询问如何将选定的图像发送到数据库？它是什么类型的数据库？

标签： javascript android html webview

【解决方案1】：

参考您提出的相关问题，检查我的答案 https://stackoverflow.com/a/41570241/3518278

我的回答包括如何打开相机并从设备中获取图像并将其设置在 html 中。

在您的这种情况下，您可以使用 js/jQuery 从视图获取图像并执行 ajax/http 请求以将其发布/放置到服务器。在您的情况下，您不需要来设置图像，您可以将数据保存在变量中并直接将其发布到服务器或将图像设置为隐藏的并继续。

因此您将使用以下代码通过 JSInterface 获取图像并将其发送到 html

                    // Get the image data in a byte array
                    File imageFile = new File(imagePath);
                    Bitmap bitmap = Util.convertImageFileToBitmap(imageFile.getAbsolutePath(), Constants.IMAGE_COMPRESSED_WIDTH, Constants.IMAGE_COMPRESSED_HEIGHT);
                    ByteArrayOutputStream stream = new ByteArrayOutputStream();
                    bitmap.compress(Bitmap.CompressFormat.JPEG, 70, stream);
                    byte[] bytes = stream.toByteArray();

                    // get the base 64 string of the image which was converted to a byte array above
                    final String imgBase64String = Base64.encodeToString(bytes, Base64.NO_WRAP);

                    runOnUiThread(new Runnable() {
                        @Override
                        public void run() {
                            mWebView.loadUrl("javascript:imageData('" + imgBase64String + "')");
                        }
                    });

您的 html 将包含以下 sn-p

function imageData(data){
    document.getElementById('displayImage').setAttribute( 'src', 'data:image/png;base64,'+data );        
  }

可以在此处找到涵盖您正在寻找的功能的示例项目

https://drive.google.com/drive/folders/0BwRMp8dK9LMLeEo5cTlXVE9ZUW8?usp=sharing

【讨论】：