【报错】(webRTC):navigator.mediaDevices undefined

最近做了一个通过webRTC实现在线视频功能的网页,在自己的电脑上用localhost打开两个网页是没问题的,但是设置了一个简单的HTTP请求的NodeJS服务器之后,在局域网中用ip地址访问就不行了,浏览器会弹出 navigator.mediaDevices undefined 的错误。

网上搜了蛮多的,终于找到了原因:

通过 MediaDevices.getUserMedia() 获取用户多媒体权限时,需要注意其只工作于以下三种环境:

  • localhost 域
  • 开启了 HTTPS 的域
  • 使用 file:/// 协议打开的本地文件

如果当前文档未安全加载,navigator.mediaDevices 将为 undefined,并且不能使用getUserMedia()。

所以对应的解决方案也出来了:

1. 创建HTTPS服务器,用HTTPS协议的方式发送请求。

2. 在HTTP服务器上,可设置Chrome 的相应参数:

  • 在chrome浏览器的地址栏中输入: chrome://flags/#unsafely-treat-insecure-origin-as-secure,将该 flag 切换成 enable 状态;
  • 在输入框中填写需要开启的域名或地址,如果有多个,则以逗号分隔;
  • 重启浏览器后生效。

第二种方式只适合自己测试用,亲测可行~ 撒花~

### 如何解决 Maven 项目中 `org.webrtc:google-webrtc:1.0.32006` 依赖缺失问题 当遇到 `org.webrtc:google-webrtc:1.0.32006` 依赖无法找到的情况时,可以采取以下措施来解决问题。 #### 配置仓库地址 确保项目的构建配置文件正确指定了所需的仓库位置。对于 Gradle 构建工具,在根目录下的 `build.gradle.kts` 文件内添加特定的 Maven 仓库: ```kotlin dependencyResolutionManagement { repositoriesMode.set(RepositoriesMode.FAIL_ON_PROJECT_REPOS) repositories { maven { url = uri("https://raw.githubusercontent.com/alexgreench/google-webrtc/master") } google() mavenCentral() } } ``` 上述设置会优先尝试从指定的 GitHub 地址下载 WebRTC 库,并且还会检查 Google 的官方存储库以及中央 Maven 存储库[^1]。 #### 更新版本号 确认使用的版本号是最新的稳定版。如果当前使用的是较旧或不存在的版本,则可能会导致依赖解析失败。根据最新信息显示,应该使用如下声明方式引入该依赖项: ```groovy implementation 'org.webrtc:google-webrtc:1.0.32006' ``` 此命令适用于 Groovy DSL 编写的 build 脚本;如果是 Kotlin DSL 则应写作 `implementation("org.webrtc:google-webrtc:1.0.32006")`[^4]。 #### 清理缓存并重新同步 有时本地缓存中的数据可能已损坏或是过期,这也会引起依赖加载错误。执行清理操作可以帮助排除此类情况带来的干扰。可以通过 IDE 提供的功能或者命令行运行相应的指令来进行清理工作。例如,在 Android Studio 中可以选择菜单栏里的 “File -> Invalidate Caches / Restart”,也可以通过终端输入 gradlew clean 命令完成同样的目的。 另外需要注意的是,某些情况下即使远程服务器上有资源可用,但如果之前有过查找失败的经历,那么这些记录会被保存到本地磁盘上作为缓存的一部分而阻止后续成功的请求被处理。因此建议删除 `.gradle/caches/modules-2/files-2.1/org.webrtc/google-webrtc/*` 下的相关条目后再重试一次同步过程[^5]。 #### 添加额外的镜像源 考虑到网络连接不稳定等因素可能导致访问默认仓库的速度慢甚至不可达的问题,可以在 settings.xml 或者 buildscript 中增加阿里云或其他国内常用的 Maven 镜像站点链接以提高获取速度和成功率: ```xml <mirrors> <mirror> <id>aliyun</id> <name>Aliyun Maven</name> <url>https://maven.aliyun.com/repository/public</url> <mirrorOf>*</mirrorOf> </mirror> </mirrors> ``` 以上 XML 片段适合于 Apache Maven 用户;而对于采用 Gradle 的开发者来说则需调整为对应的语法结构[^3]。
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值