浏览器摄像头拍照并裁剪上传(原创)

所属分类:媒体,输入,其他-音频和视频,上传,独立的部件

 14652  118  查看评论 (19)
分享到微信朋友圈
X
浏览器摄像头拍照并裁剪上传(原创) ie兼容12

注:您的设备一定要有摄像头,并在网页预览时允许访问设备!

更新时间:2021-01-19 00:33:50

// 完成上传   图片为base64 
$("#main__submit").click(function() {
    var ahis = $(this);
    console.log(cropper.getDataURL());
    ahis.hide(); //修改/url为后台地址,获取data参数,头像为base64编码字符,占用空间较小可直接存数据库。或者通过转码为字节存为文件即可 
    $.post("/url", {
        data: cropper.getDataURL()
    }, function(data) {
        ahis.show();
        ahis.html("OK");
    });
})
相关插件-音频和视频,上传,独立的部件

jQuery+HTML5类似百度音乐网页播放器代码

一款jQuery+HTML5类似百度音乐网页播放器代码免费下载,在HTML5盛行的今天,jQuery+HTML5取代了大量的程序开发工作,一款类似百度音乐播放器代码,功能灰常强大!支持火狐、IE9以上等支持HTML5+CSS3浏览器。(兼容测试:FireFox、Chrome、Safari、Opera等支持HTML5/CSS3浏览器)
  音频和视频
 56580  464

简单的音乐播放器

手写原生态的音乐播放器 代码注释全,修改方便,可以参考一下
  音频和视频
 36999  357

一个交互式的动画SVG(鼓)工具包

有关如何使用GSAP和jQuery创建动画和交互式SVG鼓套件的教程。
  音频和视频
 32103  440

jQuery视频弹窗插件

样式已经写好,使用方法也简单。
  音频和视频
 65902  468

讨论这个项目(19)回答他人问题或分享插件使用方法奖励jQ币 评论用户自律公约

    江辞 0
    2022/2/15 16:52:05
    怎么向数据库里面保存啊

    回复
    Mirror Lake 0
    2021/8/23 3:09:39
    大哥这个怎么修改保存的图片大小和质量啊
        橘子0
        2024/2/8 10:43:20
        咋设置的 解决了吗
    回复
    ′ .湮 ?_ 0
    2021/5/18 9:41:28
    请问下怎么换成后置摄像头?
        杜福忠 、 0
        2021/5/25 15:18:35
        https://www.baidu.com/s?ie=UTF-8&wd=webcam%20%E5%90%8E%E7%BD%AE%E6%91%84%E5%83%8F%E5%A4%B4
    回复
    浮生若梦 2amor 0
    2021/3/1 17:21:35
    可以调用后置摄像头吗
        杜福忠 、 1
        2021/3/6 15:37:26

        搜索: webcam 后置摄像头  就可以看到很多写法。

        video: { facingMode: { exact: "environment" }
        ┈━ㄔ☆0
        2021/3/9 9:47:00
        大神,这个调用后置摄像头的代码放在哪里
        じ☆①仟零①液...0
        2022/7/17 21:39:54
        解决了没有?我也想要弄后置摄像头?
        じ☆①仟零①液...0
        2022/7/18 8:39:44

        我实现了,加在设置里面:

        $(function() {
            Webcam.set({
                width: 320,
                height: 320,
                image_format: 'png',
                jpeg_quality: 300,
                constraints: {
                    facingMode: 'environment'
                }
            });
        
            Webcam.attach('#camera');
            window.setInterval("scan()", 5000);
        });
        じ☆①仟零①液...0
        2022/7/18 9:12:22
        有个问题,我用来做扫一扫,不能自动聚焦,识别起来费力。
    回复
    加油2021 0
    2021/2/18 12:04:12
    这个是用flash的么? 没有flash能用不能?
        西瓜0
        2021/2/18 13:39:08
        不是flash,js实现。放心使用flash早就淘汰了
    回复
    彭久灵5704803654 0
    2021/1/26 21:55:59
    大神,传到FTP的方法能不能具体写下,小弟水平太菜,总是失败。
        杜福忠 、 0
        2021/2/5 20:00:40
        第一次上传插件,这么多人喜欢哈~ 因为这个是基于浏览器的,没有后台,很多方式可以上传,我刚查了资料JS的话有个 jsftp 插件,网上有很多资料,搜索一下这个词,很多教程
    回复
    nybuunn 0
    2021/1/19 9:54:07

    不错  不错  这个好

        杜福忠 、 0
        2021/2/5 20:04:48
        Thanks?(?ω?)?
    回复
    Dave Krinsky 0
    2021/1/19 0:38:25

    太牛逼了。 要的就是你

        杜福忠 、 0
        2021/2/5 20:04:26
        感谢收藏~ 第一次来网站上传。最近有客户要这个功能,也是在网上找了一圈,没有找到完全匹配的。就让前端写了一个样式, 再共享上来了,大家用的着就好😀
    回复
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
取消回复