当我尝试在我的Angular2应用程序中使用http调用访问该文件时,我的Amazon s3存储桶中有一个.json文件我收到错误
阻止跨源请求:同源策略禁止在https://s3.us-east-2.amazonaws.com/....../list.json上读取远程资源 . (原因:缺少CORS Headers 'Access-Control-Allow-Origin') .
我在我的存储桶中将文件公开,并将访问权限作为读取,写入和编辑 .
这是我的角色代码:
getValue(){
return this._http.get('https://s3.us-east-2.amazonaws.com/........./list.json').toPromise().then(res => <Contact[]> res.json().data)
.then(data => {return data;});
}
我在AWS中的跨源XML
<CORSConfiguration>
<CORSRule>
<AllowedOrigin>*</AllowedOrigin>
<AllowedMethod>GET</AllowedMethod>
<AllowedMethod>POST</AllowedMethod>
<AllowedMethod>PUT</AllowedMethod>
<AllowedMethod>DELETE</AllowedMethod>
<MaxAgeSeconds>3000</MaxAgeSeconds>
<AllowedHeader>*</AllowedHeader>
</CORSRule>
</CORSConfiguration>
任何人都可以帮我解决这个问题在此先感谢您
3 回答
可能与您的Angular代码无关 . 看看AWS S3 docs on CORS . 您需要在存储桶中设置CORS配置 . 文档以此为例:
文档还说:
这允许您决定哪些来源可以访问您的存储桶(例如,如果您希望所有来源都能够访问它,您可以使用通配符
*
) .您需要在S3中编辑CORS配置以传递AllowedOrigin标头:
CORS配置的设置在您的存储桶的权限设置下:
你可以看到这篇文章:
How to get a cross-origin resource sharing (CORS) post request working
How to enable cors request with angular.js-resource
例:
HTML
Javascript
References
http://jsfiddle.net/ricardohbin/E3YEt/