如何在浏览器中使用CloudFront签名的Cookie? [英] How to use CloudFront signed cookies in the browser?

问题描述

因此，我有一个使用CloudFront的专用CDN(无法通过S3访问数据，只能通过已签名的URL和cookie)来保存Web应用程序的某些文件.

So I have a private CDN (can't access data through S3, only by signed URL & cookies) using CloudFront that holds some files for a web application.

我网站上的一个页面显示了一张图像，该图像的来源位于CDN中.

One of the pages on my site displays an image whose source lives on the cdn.

<img src="cdn.example.com/images/file.jpg">

现在，当我在服务器上生成签名的URL时，我可以将其传递给客户端并将其设置为源...容易

Now when I generate a signed URL on the server I can just pass it to the client and set it as source...Easy

但是当我尝试使用签名的cookie来做同样的事情时，我遇到了两个问题:

But when I try to do the same thing using signed cookies I run into 2 problems:

1. 在服务器端生成签名的cookie之后，我使用 res.cookie 进行了设置，但是我不确定如何在客户端响应时找到它们.
2. 如果实际上是在客户端获取cookie(使用angular/javascript)，如何设置"它，以便在浏览器尝试获取上述html中的图像时，它允许访问?

1. After generating the signed cookies server-side, I set them using res.cookie but I'm not sure how to find them in response on the client side.
2. In the event of actually getting the cookie on the client side (in angular/javascript), how to I "set" it so that when the browser tries to grab the image in the above mentioned html it allows access?

我正在使用node，express和cookie-parser.我对这些东西还很陌生，因此我们将不胜感激

I'm using node, express, and cookie-parser. I'm fairly new to this stuff so any help is appreciated

推荐答案

您是否检查过cookie的域是否与cloudfront cdn的域相同或子域?

Have you checked that the domain for the cookie is the same or a subdomain of the cloudfront cdn?

仅当cookie来自相关域时，该cookie才会包含在向Cloudfront发行的请求中.例如，如果您在本地使用"localhost"进行测试，因为cookie域是"localhost"，而已签名的cookie域是"cdn.example.com"，则无法使用，因为Cookie域是"localhost".

The cookie will be included in the request to the cloudfront distribution only if it is coming from a related domain. For example, if you are testing locally using "localhost" that won't work as the cookie domain is "localhost" but the signed cookie domain is "cdn.example.com".

为确保域正确，请执行以下操作:

To ensure that the domain is correct:

1. 为CloudFront分配设置CNAME，例如 http://cnd.example.com

确保签名的cookie具有正确的域域:"*.example.com"将与该域匹配.

Make sure the signed cookie has the correct domain e.g. domain:'*.example.com' will match against the domain.

这里有一篇很好的文章: https://www.spacevatican.org/2015/5/1/using-cloudfront-signed-cookies/

There's a good article here: https://www.spacevatican.org/2015/5/1/using-cloudfront-signed-cookies/

还有一个很好的节点模块，用于创建签名的cookie: https://github.com/jasonsims/aws-cloudfront-sign

There's also a good node module for creating signed cookies: https://github.com/jasonsims/aws-cloudfront-sign

使用此模块，您将执行以下操作:

Using this module you would do something like:

const options = {
    keypairId: YOUR_ACCESS_ID,
    privateKeyPath: PATH_TO_PEM_FILE
};

const signedCookies = cf.getSignedCookies("http://cdn.example.com/*", options);

for (const cookieId in signedCookies) {
    res.cookie(cookieId, signedCookies[cookieId], {domain: ".example.com"});
}

请注意我设置域的方式.如果未显式设置，它将默认为发出请求的请求，这可能不是您想要的.

Note the way I set the domain. If not explicitly set it will default to the one that made the request, which is probably not what you want.

最后，要在本地进行测试，我在家庭网络上设置了端口转发功能，并在GoDaddy中创建了一个CNAME来指向我的家庭IP，例如"test.example.com".然后，我使用" http://test.example.com "代替"

Last thing, to test this locally, I set up port-forwarding on my home network and created a CNAME in GoDaddy to point to my home IP e.g. "test.example.com". I then used "http://test.example.com" instead of "http://localhost". This created a cookie with the subdomain "test.example.com". Finally, I created another CNAME in GoDaddy called "cdn.example.com", pointing it to the CloudFront url. I used the wildcard domain in my signed cookie, ".example.com" and because I now have the signed cookie on the same domain "example.com" it's passed to CloudFront and boom we have liftoff !

这篇关于如何在浏览器中使用CloudFront签名的Cookie?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！