如何从webcam.js

时间:2018-03-20 14:27:54

标签: javascript php wordpress webcam.js

我遇到了代码遇到的麻烦,我希望有人可以带来一些亮点:)

我在一个项目中使用webcamjs,就像一个Wordpress网站内的小型CRM。我使用ACF创建了一个表单,我们填写了网站前端的表单,只有登录用户才能看到。

在会员页面中,我需要能够从网络摄像头拍摄照片,到目前为止,我已经开始使用网络摄像头并生成base64图像。

我现在需要做的是,能够将此图像上传到WordPress中的上传目录,并使用ACF插件将图像链接附加到字段“photo”,以便将所有信息放在一起。但这部分不起作用。

我想知道我是否正在JS代码中正确调用PHP文件,以及来自JS的信息是否转到PHP文件。

非常感谢任何帮助!

<script language="JavaScript">
                Webcam.set({
                    width: 640,
                    height: 480,
                    image_format: 'jpeg',
                    jpeg_quality: 90
                });
                Webcam.attach( '#members_camera' );

                function take_snapshot() {
                    // take snapshot and acquire image data
                    Webcam.snap( function(data_uri) {
                        // snap complete, image data is in 'data_uri'

                        Webcam.on( 'uploadProgress', function(progress) {
                            // Upload in progress
                            // 'progress' will be between 0.0 and 1.0
                        } );

                        Webcam.on( 'uploadComplete', function(code, text) {

                            location.reload();

                            // Upload complete!
                            // 'code' will be the HTTP response code from the server, e.g. 200
                            // 'text' will be the raw response content
                        } );

                        var postid = '<?php echo $postid ?>';
                        var url = '<?php echo get_stylesheet_directory_uri() . '/inc/webcam/uploader.php?postid='; ?>' + postid;

                        Webcam.upload( data_uri, url, function(code, text) {
                            // Upload complete!
                            // 'code' will be the HTTP response code from the server, e.g. 200
                            // 'text' will be the raw response content
                        } );
                    } );
                }
            </script>

这是“uploader.php”文件

require_once("../../../../../wp-load.php");

$name = date('YmdHis');
$imagename = $_SERVER['DOCUMENT_ROOT']."/wp-content/uploads/members_photos/".$name.".jpg";
move_uploaded_file($_FILES['webcam']['tmp_name'], $imagename);

$postid = $_GET['postid'];
update_field('foto', $imagename, $postid);

echo $postid;
echo $imagename;

1 个答案:

答案 0 :(得分:0)

我明白了!

问题在于我的&#34; uploader.php&#34;文件。它现在看起来像这样:

require_once('../../../../../wp-load.php');

$name = date('YmdHis');
$upload_dir = wp_upload_dir();
$imagename = $upload_dir['basedir'] . '/members_photos/' . $name . '.jpg';

move_uploaded_file($_FILES['webcam']['tmp_name'], $imagename);

$home_url = home_url();
$member_pic_url = $home_url . '/wp-content/uploads/members_photos/' . $name . '.jpg';

$postid = $_GET['postid'];
update_field('foto', $member_pic_url, $postid);

我还必须手动创建目录。因此,如果有人有更好的解决方案,我愿意接受它:)