angularjs - 如何使用基于 token 的身份验证内联访问 protected Assets ？

Question

我在 Ember/Angular/Backbone 应用程序中从 cookie 迁移到基于 token 的身份验证时遇到了障碍。

问题是不能在 img 标签上设置请求 header 。

有些人建议将 token 参数附加到请求的末尾，从而在服务器日志中乱扔身份验证 token 。

使用基于 token 的身份验证访问 protected 内联 Assets 的正确方法是什么(如果有)？

Answer 1

重要警告 :我不是安全专家(但我涉足)

过去，我使用过 Amazon S3 及其基于 token 的 Assets 安全性。这些允许您为 Assets 访问生成私有(private)甚至临时 URL。您也可以在自己的服务器上实现类似的机制，但请记住，您现在将自己托管和服务 Assets ，因此请记住带宽使用、缓存等问题。

This post似乎有一个关于使用 AngularJS 和 Amazon 保护图像的非常详细的教程。

如果您不想走亚马逊路线，您需要自己实现某种 token /安全方案，您可以采取多种方法。这在很大程度上取决于您想要的安全级别。

您可以在没有 URL 的情况下以编程方式加载图像数据。应该可以使用 CSS 和 base64 data URIs来实现这一点。您可以对数据发出 AJAX 请求并填充数据 URI。虽然这将是绝对安全的，但它也可能效率低下。

你可以 use cookies来控制访问。因为这些将在获取图像时由浏览器发送。

您可以使用安全的标记化 URL 的自定义实现，例如 https://host/secure_images/{tokenized_access_url}.jpg .就像 S3 一样。您甚至可以使此 token 在一段时间后过期。

根据您的需要，您可能会发现其中一些技术会损害您利用缓存的能力。这就是为什么在安全性和效率方面使用 S3/Cloudfront 可能是最佳选择。

您还应该问的是是否需要保护这些 Assets 以防止 URL 泄露。在许多情况下，只需将 Assets url 保持私有(private)(在某处使用随机生成的值)并仅将其显示给有权访问的用户，就足够了。