php – Cara mengambil ulang gambar webcam melalui kamera ponsel

Saya membuat formulir di mana para tamu mengambil gambar melalui kamera ponsel mereka sebelum mengirimkan formulir. Jadi webcam berfungsi dengan baik di desktop/komputer tetapi di perangkat seluler saya perhatikan ketika Ambil Ulang Gambar tombol diklik di ponsel akan membuka galeri file alih-alih memulai kamera webcam lagi. Para tamu wajib mengambil gambar melalui kamera ponsel mereka. Saya juga memerlukan bantuan untuk mengirimkan gambar yang diambil sebagai gambar produk woocommerce, saya bekerja dengan plugin frontend pengguna wordpress.

jQuery(document).ready(function ($) {
var fileSelectorID = webcam_params.fileSelectorID;
Webcam.set({
    width: 640,
    height: 480
});

var webcamActive = false;

function captureImage() {
    Webcam.snap(function (data_uri) {
        var $imageElement = $('<img id="captured-image" />');
        $('#' + fileSelectorID).after($imageElement);
        $imageElement.attr('src', data_uri);

        Webcam.reset();
        webcamActive = false;

        $('#retake-button').show();
        $('#capture-button').hide();

        saveImageOnServer(data_uri);
    });
}

function retakePicture() {
    $('#captured-image').remove();
    $('#capture-button').show();
    $('#retake-button').hide();

    if (!webcamActive) {
        Webcam.attach('#' + fileSelectorID);
        webcamActive = true;
    }
}

function saveImageOnServer(imageData) {
    $.ajax({
        url: ajaxurl,
        type: 'POST',
        data: {
            action: 'save_webcam_image',
            captured_image_data: imageData
        },
        success: function (response) {
            console.log(response);
        },
        error: function (error) {
            console.error(error);
        }
    });
}

function initializeWebcam() {
    Webcam.attach('#' + fileSelectorID);

    var $captureButton = $('<button id="capture-button">Capture</button>');
    $('#' + fileSelectorID).after($captureButton);

    var $retakeButton = $('<button id="retake-button" style="display:none;">Retake Picture</button>');
    $('#' + fileSelectorID).after($retakeButton);

    $captureButton.on('click', function () {
        captureImage();
    });

    $retakeButton.on('click', function () {
        retakePicture();
    });
}

initializeWebcam();

$('#' + fileSelectorID).on('click', function () {
    if (!webcamActive) {
        initializeWebcam();
        webcamActive = true;
    }
});

});