i have angular app deployed to AWS S3 bucket that is not showing the S3 bucket files.
environment file:
export const environment = {
aws: {
production: true,
accessKeyId: process.env.accessKeyId,
secretAccessKey: process.env.secretAccessKey,
region: 'ap-south-1'
}
}
and my service.ts has this code:
AWS.config.update({
accessKeyId: process.env.accessKeyId,
secretAccessKey: process.env.secretAccessKey,
region: 'ap-south-1'
});
const bucket = new S3(AWS.config);
@Injectable({
providedIn: 'root'
})
export class S3Service {
bucketName: string = 'angular-upload-files-2023-2024';
loader: EventEmitter<boolean> = new EventEmitter<boolean>();
currentFolder: string = 'properties2023';
constructor() {}
getFolderContent(): Observable<any> {
return new Observable((observer) => {
this.loader.next(true);
bucket.listObjectsV2({ Bucket: this.bucketName, Prefix: this.currentFolder, Delimiter: '/' }, (err: AWS.AWSError, data: S3.ListObjectsV2Output) => {
this.loader.next(true);
console.log(data)
if (err) {
observer.error(err);
}
else {
let list: any[] = [];
list = list.concat(data.CommonPrefixes?.map(m => { return { name: m.Prefix, contentType: 'folder' } }));
list = list.concat(data.Contents?.filter(m => m.Key != this.currentFolder).map(m => { return { name: m.Key, contentType: 'file', modifiedTime: m.LastModified?.toDateString() } }));
observer.next(list);
}
});
})
}
}
in bucket permissions I have public access and I have:
bucket policy:
{
"Version": "2012-10-17",
"Id": "Policy1637840001466",
"Statement": [
{
"Sid": "Stmt1637839995898",
"Effect": "Allow",
"Principal": "*",
"Action": "s3:*",
"Resource": "arn:aws:s3:::angular-upload-files-2023-2024/*"
}
]
}
and I have CORS:
[
{
"AllowedHeaders": [
"*"
],
"AllowedMethods": [
"GET",
"POST",
"HEAD",
"DELETE"
],
"AllowedOrigins": [
"*"
],
"ExposeHeaders": [],
"MaxAgeSeconds": 3000
}
]
It is showing enpty site:
I am getting this error if I press F12: main.31fee5403cb9775f.js:1 ERROR CredentialsError: Missing credentials in config, if using AWS_CONFIG_FILE, set AWS_SDK_LOAD_CONFIG=1 at v (main.31fee5403cb9775f.js:1:259510) at constructor.getCredentials (main.31fee5403cb9775f.js:1:260035) at constructor.<anonymous> (main.31fee5403cb9775f.js:1:282754) at constructor.callListeners (main.31fee5403cb9775f.js:1:346028) at constructor.emit (main.31fee5403cb9775f.js:1:345767) at constructor.emitEvent (main.31fee5403cb9775f.js:1:331693) at constructor.g (main.31fee5403cb9775f.js:1:327199) at F.runTo (main.31fee5403cb9775f.js:1:393723) at constructor.runTo (main.31fee5403cb9775f.js:1:328969) at constructor.send (main.31fee5403cb9775f.js:1:328862)
I am getting this log: 83900f54effed0ac5e6ecc408f79057e2454b7ed833568de9795042d405a1bdf angular-upload-files-2023-2024 [07/Jan/2024:08:17:26 +0000] - svc:s3.amazonaws.com GV1H7FNF4N55YD5C REST.PUT.OBJECT 2024-01-07-08-17-26-0DCED4D1BCB18B46 "PUT /angular-upload-files-2023-2024/2024-01-07-08-17-26-0DCED4D1BCB18B46 HTTP/1.1" 200 - - 687 37 14 "-" "-" - HxlhtL+Zm0wgCxOmlznfEXcJfo6ePk0eHPrccRkiSn/29yobpZcR2U2WGMeZ0JTVKgrbEfafmac= SigV4 ECDHE-RSA-AES128-GCM-SHA256 AuthHeader s3.ap-south-1.amazonaws.com TLSv1.2 - -