我一直在使用这种嵌入式凭据方法从 IP 摄像机检索照片。现在 Google Chrome 更新阻止了此方法,我收到此错误:
[Deprecation] Subresource requests whose URLs contain embedded credentials (e.g.
https://user:pass@host/) are blocked. See https://www.chromestatus.com/feature/5669008342777856 for more details.
我尝试了另一种方法,使用带有基本身份验证的 JQuery Ajax。但我却收到另一个错误。
XMLHttpRequest cannot load example.com. Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://example.com' is therefore not allowed access. The response had HTTP status code 401.
我无法对 IP 摄像头中的 Web 服务进行任何更改以允许跨域请求。
看起来我只剩下一个选择,那就是从服务器端检索图像,并将其提供给浏览器?但这会浪费我的服务器带宽。
还有什么建议/想法吗?
谢谢。
请您参考如下方法:
实现此目的的一种方法是使用请求拦截器,例如 ModHeader 。它可以作为 Chrome 的扩展安装,并且具有解决您的问题所需的功能。
所以你需要遵循这种方法:
- 从 Chrome 网上应用店安装该扩展程序。
- 通过连接您的用户名和密码来创建一个字符串,例如用冒号分隔它们(
用户名:密码)。阅读 HTTP Basic Authorization . - Base64 Encode您刚刚创建的字符串。
- 打开 ModHeader 的设置面板。
- 在请求 header 部分中,添加名称为
Authorization、值为Basicencoded_string的 header 。将encoded_string替换为您在第 3 步中编码的字符串。请参阅下面的快照。 - 现在您可以直接获取照片,而无需在其前面添加
用户名:密码@。所以你的 URL 看起来像 http://example.com/snap .
为什么它能解决问题?
基本上,您之前所做的就是在 URL 本身中传递授权详细信息。这是一种常见的情况,但显然会泄露凭据,因此不是一种安全的方法。
幸运的是,使用 Authorization header 也可以完成相同的操作。您只需以编码形式传递凭据即可。 ModHeader 会为您做到这一点。它拦截浏览器的每个请求并在其中附加此 header 。
但要注意,它会拦截所有请求。因此,建议仅在从 IP 摄像机获取照片时使用它。对于所有其他情况,请记住禁用它。
