问题描述
我在域client-domain.com上有一个客户端应用程序，在域server-domain.com上有一个服务器端应用程序.服务器端有一个API.客户端应用程序将AJAX请求发送到服务器端应用程序.我使用基于令牌的身份验证，因此客户端应用程序会在每个AJAX请求的标头中发送令牌，例如:授权:承载{some token}".当我需要获取或发布一些数据时，它可以很好地处理AJAX请求.
I have a client-side application on domain client-domain.com and a server-side application on domain server-domain.com. There is an API on the server-side. The client-side application sends AJAX requests to the server-side application. I use token-based authentication, so the client-side application sends token in headers with each AJAX request, for example: "Authorization: Bearer {some token}". It works fine with AJAX requests, when I need to get or post some data.
但是服务器端API也保留文件.例如图像.这些文件是私人文件，只有经过身份验证的用户才能获取它们.我需要在客户端的<img>标签中显示此图像.我无法使用<img src="http://server-domain.com/path/to/image">来获取它们，因为在这种情况下，浏览器不会将Authorization标头发送到服务器端.
But the server-side API also keeps files. For example images. The files are private, only authenticated users can get them. And I need to show this images on the client-side in <img> tag. I can't get them using <img src="http://server-domain.com/path/to/image"> because in this case browser will not send Authorization header to the server-side.
采用的解决方案是什么?客户端应用程序如何从服务器端API加载图像?
What is the adopted solution? How client applications load images from server-side API?
推荐答案
有三种解决方法，最好的解决方法是使用签名的URL
There are three methods to solve it, the best approach to solve it is using the signed URLs
- 第一种方法只是使用签名哈希参数创建一个无需身份验证(匿名访问)的路由，该哈希参数指示是否可以加载资源.
<img src="http://server-domain.com/path/to/image?guid=f6fc84c9f21c24907d6bee6eec38cabab5fa9a7be8c4a7827fe9e56f2">
服务器收到请求后，如果尚未达到到期时间，则必须验证guid，当然，请检查guid是否为有效签名.
When the server receives the request you must validate the guid if the expiration time not been reached and, of course, check if guid is a valid signature.
一些文件/文档服务器使用了这种方法，例如Dropbox，S3，CDN提供程序等.
This approach is used by several files/documents servers like Dropbox, S3, CDN providers, etc.
在某些公司中查看该技术.
See the technique in some companies.
https ://client.cdn77.com/support/knowledgebase/cdn-resource/how-do-i-set-up-signed-urls
-
第二种方法是通过带有图像URL的querystring传递令牌.
The second method is passed the token by querystring with the image URL.
- 建议不要使用此方法，因为清楚地公开URL，并且许多服务器有时会编写和公开所访问URL的公共日志.不好的通知是，JWT通常向用户公开，用户可以进一步控制许多功能来进一步加载图像.
<img src="http://server-domain.com/path/to/image?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJzdWIiOiIxMjM0NTY3ODkwIiwibmFtZSI6IkpvaG4gRG9lIiwiaWF0IjoxNTE2MjM5MDIyfQ.SflKxwRJSMeKKF2QT4fwpMeJf36POk6yJV_adQssw5c">
服务器收到请求后，您必须通过查询字符串和对内容的响应来验证令牌.
When the server receives the request you must validate the token by querystring and response with the content.
-
第三个方法创建一个经过身份验证的cookie，以验证对图像的访问.
The third method creates an authenticated cookie to validate the access of the image.
- 不推荐使用此方法，因为该方法超出了API模式(通常基于基于webapi/令牌的身份验证).
服务器收到请求后，您需要验证验证cookie是否有效.
When the server receives the request you need to validate if the validate cookie is valid.
这篇关于如果我使用基于令牌的身份验证，应该如何加载图像的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！