如何使用 NativeScript 3 捕获图像并发送到远程服务器

Question

我是 NativeScript 的新手，我正在尝试使用相机模块捕获图像（这工作正常），并将其转换为 base64（这不起作用）并 POST 到服务器。

我用谷歌搜索了好几天。如果您能提供任何帮助，我们将不胜感激。

我已经尝试了大约 160 亿种不同的方法，这是我当前的代码：

 viewModel.takePicture1 = function() {
    camera.requestPermissions();
    var isAvailable = camera.isAvailable(); 
    console.log(isAvailable);

    var options = { width: 640, keepAspectRatio: true, saveToGallery: false };


    camera.takePicture().then(function (img) { 
        try{
            var imageData = img.toBase64String("jpeg"); // fails here
            console.log(imageData);
        }catch(err){
            console.log("Error: "+err);
        }

        http.request({
            url: "http://[server address]/lab/ns_exp/upload_test.php",
            method: "POST",
            headers: { "Content-Type": "application/base64" },
            content: imageData
        }).then(function() { 
            console.log("Upload successful");
        }).catch(function(e) { 
            console.log("Unsuccessful upload", e);
        });
    });
}//

哦，我确实想表明我没有使用 angular（很明显），所以请不要提供这样做的答案。 :)（Vuejs 抵制）

Answer 1

这里的关键是base64需要知道图像是JPEG，以及图像应该是什么质量。代码应如下所示：

camera.takePicture(cameraOptions)
    .then(imageAsset => {
        imageSource.fromAsset(imageAsset).then(res => {
            myImageSource = res;
            var base64 = myImageSource.toBase64String("jpeg", 100);

以防万一以后有人发现这个并想知道如何将图像 (UI) and/or 图像 (base64) 放入 observableArray，这是我的完整函数：

viewModel.takePhoto = function(){
    var self = this;
    camera.requestPermissions();
    var cameraOptions = { width: 640, keepAspectRatio: true, saveToGallery: false };
    camera.takePicture(cameraOptions)
    .then(imageAsset => {
        imageSource.fromAsset(imageAsset).then(res => {
            myImageSource = res;
            var base64 = myImageSource.toBase64String("jpeg", 100);

            self.photoData.push({"data": base64});

            var image = new imageModule.Image();
            image.src = imageAsset;

            self.photoUI.push({"src": image.src});
            listView.refresh();
        })
    }).catch(function (err) {
        console.log("Error -> " + err.message);
    });
}

如何使用 NativeScript 3 捕获图像并发送到远程服务器

How can I use NativeScript 3 to capture image and send to a remote server

nativescript

nativescript-plugin