问答博客资讯标签用户活动
logo极客观点logo项目管理logoHarmonyOS
javascript
前端
python
node.js
react
vue.js
php
laravel
go
人工智能
mysql
linux
ios
java
android
css
typescript
spring
程序员
logoONES 研发管理logo思否企业问答logo安谋科技 XPU

H5部署后 页面video媒体获取 navigator获取不到mediaDevices问题处理？？？

头像
双口吕?
    20513

    关于 http 页面video媒体获取 navigator.mediaDevices 为undefined问题？？？

    根页面是http,内嵌套iframe url是https , iframe内依然还是获取不到 相应的navigator.mediaDevices 权限呀？？？求解决

    备注：去除网上 地址为localhost:// 访问时 地址为https:// 时 为文件访问file:/// 这种解决方案

    javascripthtml5reacthtml
    阅读 1.1k
    avatarAI BotBETA

    这个问题可能是由于页面加载的安全策略引起的。当你的主页面是通过 HTTP 协议加载的，它可能无法访问到通过 HTTPS 协议加载的 iframe 中的 navigator.mediaDevices。这是由于浏览器安全策略的规定，为了防止恶意网站滥用设备的媒体输入，浏览器通常会阻止 HTTP 页面访问 HTTPS 页面的某些功能。

    对于你的问题，有以下几种可能的解决方案：

    1. 将主页面也迁移到 HTTPS：这是最直接的解决方案。通过将主页面也迁移到 HTTPS，你可以确保所有的页面都在同一安全环境中，不会受到跨站脚本攻击（XSS）和跨站请求伪造（CSRF）等安全威胁。在迁移到 HTTPS 后，你的问题应该会得到解决。
    2. 在服务器端进行重定向：如果由于某些原因你无法将主页面迁移到 HTTPS，你也可以考虑在服务器端进行 HTTP 到 HTTPS 的重定向。这样，当用户通过 HTTP 访问你的网站时，服务器会自动将他们重定向到 HTTPS 版本。但是请注意，这种方法并不能完全解决你的问题，因为重定向是在服务器端进行的，客户端可能还是无法访问 HTTPS 页面的某些功能。
    3. 使用 CSP (Content Security Policy)：CSP 是一种安全措施，可以防止跨站脚本攻击（XSS）。你可以尝试在你的 HTTP 页面中添加 CSP 策略，看是否可以解决你的问题。但是请注意，这种方法可能并不总是有效，因为 CSP 的具体效果取决于它的策略设置。

    以上就是针对你问题的一些可能的解决方案。请根据你的实际情况进行选择。

    1 个回答
    得票最新
    头像
    j
      2
      新手上路，请多包涵

      有一个比较简单的方法，直接改谷歌浏览器的配置，使用chrome://flags/#unsafely-treat-insecure-origin-as-secure进入谷歌浏览器的配置界面，找到Insecure origins treated as secure配置，一般输入chrome://flags/#unsafely-treat-insecure-origin-as-secure之后就会标黄，改成已启用然后输入你的http域名，重启谷歌就可以，亲测有效

      撰写回答
      你尚未登录，登录后可以
      • 和开发者交流问题的细节
      • 关注并接收问题和回答的更新提醒
      • 参与内容的编辑和改进，让解决方法与时俱进
      推荐问题