首页 > 其他分享 >electron loadURL加载http协议(或内网)环境下使用navigator.mediaDevices.getUserMedia API.

electron loadURL加载http协议(或内网)环境下使用navigator.mediaDevices.getUserMedia API.

时间:2024-07-14 14:54:16浏览次数:10  
标签:loadURL mediaDevices http key ssl electron https 内网

场景

我使用的electron 27版本。

众所周知,navigator.mediaDevices.getUserMedia API只能在https环境下使用,在非https环境下使用时navigator.mediaDevices会返回undefined。除了例外的这几种情况。
例外的几种情况在MDN 安全上下文文章中进行了说明说明了。
大致意思是在https,file,localhost这几种协议下会认为是安全的上下文。

第一种方式:使用chromium的命令行开关来控制(亲测没问题)。

app.whenReady前加载前加载以下Chromium命令行开关来控制那些是安全上下文(可以逗号分隔的列表形式提供多个来源)。

const { app, ... } = require("electron");
...
app.commandLine.appendSwitch('unsafely-treat-insecure-origin-as-secure', 'http://www.demo.com,http://domain2.com,http://domain3.com');

第二种方式:就是使用签名证书来进行签名地址(这里使用自签名证书的方式)。

-- 创建本地私有密钥
openssl genrsa -out ssl.key 2048
 
-- 按提示输入即可
openssl req -new -key ssl.key -out ssl.csr
 

-- 创建证书crt
openssl x509 -req -days 1460 -in ssl.csr -signkey ssl.key -out ssl.crt
 

-- 创建证书pem
openssl dhparam -out ssl.pem 2048

Nginx关于ssl的配置


server {
    listen 443   ssl;
    ssl_certificate                          /etc/nginx/ssl/ssl.crt;
    ssl_certificate_key                        /etc/nginx/ssl/ssl.key;
    ssl_session_timeout 5m;
    ssl_protocols TLSv1.2;
    ssl_ciphers EECDH+AESGCM:EDH+AESGCM:AES256+EECDH:AES256+EDH:!aNULL:!eNULL:!EXPORT:!DES:!RC4:!MD5:!PSK:!KRB5:!aECDH:!EDH+3DES;
}

see

  1. https://developer.mozilla.org/en-US/docs/Web/API/MediaDevices/getUserMedia
  2. https://developer.mozilla.org/en-US/docs/Web/Security/Secure_Contexts
  3. 使用命令行开关运行 Chromium
  4. Chromium支持的命令行全部开关
  5. Chromium官方

标签:loadURL,mediaDevices,http,key,ssl,electron,https,内网
From: https://www.cnblogs.com/XingXiaoMeng/p/18301279

相关文章

  • 第二部分:关键技术领域的开源实践【内网穿透FRP】
    FRP简介FRP(FastReverseProxy)作为一种高性能的内网穿透工具,支持TCP、UDP、HTTP、HTTPS等多种协议。可以将内网服务以安全、便捷的方式通过具有公网IP节点(云服务器)的中转暴露到公网。为什么使用FRP?以下是一些常见的企业级应用场景:远程办公和远程桌面允许员工从外部网......
  • 渗透测试基础--内网转发
    在渗透测试中,当我们获得了外网服务器(如web服务器,ftp服务器,mali服务器等等)的一定权限后发现这台服务器可以直接或者间接的访问内网。此时渗透测试进入后渗透阶段,一般情况下,内网中的其他机器是不允许外网机器访问的。这时候,我们可以通过端口转发(隧道)或将这台外网服务器设置成为......
  • 【Android面试八股文】谈谈OkHttp框架的原理(深度剖析源码)
    文章目录一、OkHttp介绍二、OkHttp使用流程三、OkHttp的分发器Dispatcher3.1Dispatcher3.2同步请求3.3异步请求四、OKHttp的请求流程五、分发器线程池六、拦截器责任链6.1责任链模式6.1.1故事背景6.1.2责任链模式实现6.2OkHttp的拦截器流程......
  • ipv4、ipv6家庭宽带内网穿透
    为什么要内网穿透作为开发人员,经常需要远程家里、公司或者客户的电脑,又或者有什么其他需求如接口调试、局域网内打印机公网访问、家庭nas等,这些都需要在公网访问局域网内部的设备。远程桌面可能很多人都用过向日葵、TeamViewer等,可免费使用,但可能会限分辨率和限制流量。内......
  • Windows&Linux搭建frp内网穿透(自用)
    Linux服务器搭建服务端1、下载官方frp包,软件是开源的,下载链接:https://github.com/fatedier/frp/releases根据自己的版本需求,自行下载对应的版本号,本文章以0.37版本为例wget-chttps://github.com/fatedier/frp/releases/download/v0.37.1/frp_0.37.1_linux_amd64.tar.gz2.......
  • 设计模式:从HttpServletRequestWrapper了解装饰者模式
    从一个参数处理的问题开始为了满足安全测试,需要给系统追加防XSS注入的功能,关于此类安全的问题,一般的解决方案就是在请求到达Controller之前,使用Web框架的Filter或者Spring本身的拦截器对HttpServletRequest对象的参数进行处理:@ComponentpublicclassMyInterceptorimpleme......
  • JAVA利用HttpClient进行POST请求(HTTPS)
    finalHttpClientUtilhttpClientUtil=newHttpClientUtil();finalMap<String,String>map=Maps.newHashMap();map.put("username",workNo);map.put("password",passwd);finalStringresultStr......
  • 浅谈HTTP中Get与Post的区别
    Http定义了与服务器交互的不同方法,最基本的方法有4种,分别是GET,POST,PUT,DELETE。URL全称是资源描述符,我们可以这样认为:一个URL地址,它用于描述一个网络上的资源,而HTTP中的GET,POST,PUT,DELETE就对应着对这个资源的查,改,增,删4个操作。到这里,大家应该有个大概的了解了,GET一般用于获取/......
  • 推荐几个免费的http mock接口
    在前后端分离开发架构下,经常遇到调用后端数据API接口进行测试、集成、联调等需求,比如:(1)前端开发人员很快开发完成了UI界面,但后端开发人员的API接口还没有完成,不能进行前后端数据接口对接和联调,很容易影响开发进度。前端开发人员用的比较多的开源组件有mock.js,但该组件缺乏界面管理......
  • 【史上最全面ESP32教程】http通信
    文章目录前言HTTP协议是什么?HTTP协议的特点HTTP协议的常见应用esp32使用http通信通信流程基础使用HTTPClient常用的函数函数介绍:`voidend(void);``boolconnected(void);``voidsetReuse(boolreuse);``voidsetUserAgent(constString&userAgent);``voidsetAuthor......