Как я могу использовать NativeScript 3 для захвата изображения и отправки на удаленный сервер

Я новичок в NativeScript, и я пытаюсь захватить изображение с помощью модуля камеры (это отлично работает) и преобразовать его в base64 (это не работает) и POST на сервер.

Я гуглил несколько дней. Любая помощь, которую вы можете оказать, будет безмерно признательна.

Я пробовал это около 16 миллиардов различных способов, и это мой текущий код:

 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)


person Jrhd437    schedule 23.06.2017    source источник
comment
Пробовали ли вы преобразовать источник изображения в изображение, как оно написано в документах камеры, и преобразовать это объект изображения в base64string? var image = new imageModule.Image(); image.src = imageAsset;   -  person Zigmas    schedule 24.06.2017
comment
Я нашел здесь решение (discourse.nativescript.org/t/tobase64string- doesnt-work / 1184/6). Очевидно, toBase64 должен знать, что изображение является jpeg, и ему нужен параметр для определения качества. Зигмас, я ценю твою готовность помочь. Решение, с которым я связался, требует, чтобы ваше предложение работало - так что вы меня на полпути. Я удивлен, как мало людей здесь для NativeScript.   -  person Jrhd437    schedule 26.06.2017
comment
Опубликуйте решение в качестве ответа и отметьте его соответствующим образом, чтобы другие пользователи могли наткнуться на тот же блокировщик.   -  person pkanev    schedule 27.06.2017


Ответы (1)


Ключевым моментом здесь является то, что base64 должен знать, что изображение является JPEG, и какого качества оно должно быть. Код должен выглядеть так:

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

На всякий случай, если кто-то обнаружит это позже и задастся вопросом о помещении изображения (UI) и / или изображения (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);
    });
}
person Jrhd437    schedule 30.06.2017