javascript - 在没有JQuery的情况下将图像存储在数据库中

美好的一天堆高车，

我正在开发一个Web项目，在该项目中我们重新创建了类似于gmail的社交媒体网站。我正在使用网络摄像头使用JS拍照，并将照片写到名为img的var中，如下所示：

var img    = canvas.toDataURL("image/png");

我们需要在PHP中使用PDO来访问数据库。或者，我们可以使用AJAX，但是严格禁止使用JQuery。我的问题是，如何将DataURL存储在数据库中？所有在线教程都使用JQuery。

更新：

我按照以下建议的步骤进行操作，但是当我单击“捕捉”按钮时，它仍然仅拍摄图片，没有URL或什么都没有。

function sendimagetourl(image)
        {
            var xhttp = new XMLHttpRequest();
            xhttp.onreadystatechange = function()
            {
                if (this.readyState == 4 && this.status == 200)
                {
                    alert( this.resoponseText);
                }
            }
            xhtp.open("GET", "saveimage.php?url="+image, true);
            xhttp.send();
        }
        //Stream Video
        if (navigator.mediaDevices && navigator.mediaDevices.getUserMedia)
        {
            navigator.mediaDevices.getUserMedia({video: true}).then(function(stream) {
            video.src = window.URL.createObjectURL(stream);
            video.play();
            });
        }
        //Snap Photo
        var canvas = document.getElementById('canvas');
        var context = canvas.getContext('2d');
        var video = document.getElementById('video');

        document.getElementById("snap").addEventListener("click", function() {context.drawImage(video, 0, 0, 800, 600);var image = canvas.toDataURL("image/png"); sendimagetourl(image);});

看来我有点傻瓜。有两个小的输入错误，似乎发送的数据在url中是不可见的。感谢您的所有帮助！

最佳答案

您可以使用javascript ajax

var xhttp = new XMLHttpRequest();
  xhttp.onreadystatechange = function() {
  if (this.readyState == 4 && this.status == 200) {
    alert( this.responseText);
  }
};
xhttp.open("GET", "saveimage.php?url="+url, true);
xhttp.send();

关于javascript - 在没有JQuery的情况下将图像存储在数据库中，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/40100726/