具有预签名 url returns 状态的 S3 文件上传(已取消)
S3 file upload with presigned url returns status (canceled)
我正在尝试使用 angular 客户端将文件上传到 Amazon S3。我已经使用 NodeJs 应用程序服务器生成了 Presigned URL。将文件上传到预签名时 URL,但无法从客户端上传文件,获取(已取消)。
我尝试以以下格式上传文件:buffer、base64、formData 和 raw 文件
如果我尝试用邮递员上传到生成的 URL 二进制形式
使用 NodeJs
生成 预签名 URL
const s3 = new AWS.S3({
accessKeyId: AWS_ACCESS_KEY,
secretAccessKey: AWS_SECRET_ACCESS_KEY,
region: 'eu-central-1',
});
const signedUrlExpireSeconds = 60 * 5;
const presignedS3Url = s3.getSignedUrl('putObject', {
Bucket: process.env.bucket,
Key: './test3Public.pdf',
Expires: signedUrlExpireSeconds,
ACL: 'public-read',
ContentType: 'application/pdf',
});
HTML
<input
type="file"
(change)="onFileSelected($event)"
accept="application/pdf, .docx"
/>
Component.ts
onFileSelected(event: any) {
this.fileToUpload = <File>event.target.files[0];
this.fileUpload
.generatePresignedURL(this.fileToUpload.name)
.pipe(first())
.subscribe(
(data) => {
this.fileUpload
.uploadfileAWSS3(this.fileToUpload, data.presignedS3Url)
.pipe(first())
.subscribe(
(data) => {
console.log('uploaded', data);
},
(error) => {
console.log('error', error);
}
);
},
(error) => {
console.log('error', error);
}
);
}
我发送文件的格式:
Angular 11 服务
uploadfileAWSS3(file, fileuploadurl) {
const req = new HttpRequest('PUT', fileuploadurl, file);
return this.http.request(req);
}
请问上传被取消是什么问题?
HTML:
<input type="file" (change)="onFileSelected($event)" accept="application/pdf, .docx"
/>
Angular代码:
onFileSelected(event) {
const fileToUpload = <File>event.target.files[0];
const bucketParms = {
Bucket: "sample-temp-bucket",
Key: fileToUpload.name,
ContentType: "application/pdf",
ACL: "public-read",
Expires: 3600,
};
s3.getSignedUrl("putObject", bucketParms, (error, url) => {
if (error) console.log("error", error);
if (url) {
this.http.put(url, fileToUpload).subscribe((response) => {
console.log("response receved is ", response);
});
}
});
}
CORS:
[
{
"AllowedHeaders": [
"*"
],
"AllowedMethods": [
"PUT",
"POST"
],
"AllowedOrigins": [
"http://localhost:4200"
],
"ExposeHeaders": []
}
]
我正在尝试使用 angular 客户端将文件上传到 Amazon S3。我已经使用 NodeJs 应用程序服务器生成了 Presigned URL。将文件上传到预签名时 URL,但无法从客户端上传文件,获取(已取消)。
我尝试以以下格式上传文件:buffer、base64、formData 和 raw 文件
如果我尝试用邮递员上传到生成的 URL 二进制形式
使用 NodeJs
生成 预签名 URL const s3 = new AWS.S3({
accessKeyId: AWS_ACCESS_KEY,
secretAccessKey: AWS_SECRET_ACCESS_KEY,
region: 'eu-central-1',
});
const signedUrlExpireSeconds = 60 * 5;
const presignedS3Url = s3.getSignedUrl('putObject', {
Bucket: process.env.bucket,
Key: './test3Public.pdf',
Expires: signedUrlExpireSeconds,
ACL: 'public-read',
ContentType: 'application/pdf',
});
HTML
<input
type="file"
(change)="onFileSelected($event)"
accept="application/pdf, .docx"
/>
Component.ts
onFileSelected(event: any) {
this.fileToUpload = <File>event.target.files[0];
this.fileUpload
.generatePresignedURL(this.fileToUpload.name)
.pipe(first())
.subscribe(
(data) => {
this.fileUpload
.uploadfileAWSS3(this.fileToUpload, data.presignedS3Url)
.pipe(first())
.subscribe(
(data) => {
console.log('uploaded', data);
},
(error) => {
console.log('error', error);
}
);
},
(error) => {
console.log('error', error);
}
);
}
我发送文件的格式:
Angular 11 服务
uploadfileAWSS3(file, fileuploadurl) {
const req = new HttpRequest('PUT', fileuploadurl, file);
return this.http.request(req);
}
请问上传被取消是什么问题?
HTML:
<input type="file" (change)="onFileSelected($event)" accept="application/pdf, .docx"
/>
Angular代码:
onFileSelected(event) {
const fileToUpload = <File>event.target.files[0];
const bucketParms = {
Bucket: "sample-temp-bucket",
Key: fileToUpload.name,
ContentType: "application/pdf",
ACL: "public-read",
Expires: 3600,
};
s3.getSignedUrl("putObject", bucketParms, (error, url) => {
if (error) console.log("error", error);
if (url) {
this.http.put(url, fileToUpload).subscribe((response) => {
console.log("response receved is ", response);
});
}
});
}
CORS:
[
{
"AllowedHeaders": [
"*"
],
"AllowedMethods": [
"PUT",
"POST"
],
"AllowedOrigins": [
"http://localhost:4200"
],
"ExposeHeaders": []
}
]