shiyue/kan
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: update s3 upload to use put

Browse Source
This commit is contained in:
Henry
2025-05-16 23:27:32 +01:00
parent 702af24a25
commit 395c3acb81
4 changed files with 165 additions and 49 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
apps/web/package.json
View File

@@ -15,7 +15,7 @@
},
"dependencies": {
"@aws-sdk/client-s3": "^3.802.0",
"@aws-sdk/s3-presigned-post": "^3.802.0",
"@aws-sdk/s3-request-presigner": "^3.812.0",
"@headlessui/react": "^2.2.0",
"@hookform/resolvers": "^3.3.4",
"@kan/api": "workspace:*",

30
apps/web/src/pages/api/upload/image.ts
View File

@@ -1,6 +1,6 @@
import type { NextApiRequest, NextApiResponse } from "next";
import { S3Client } from "@aws-sdk/client-s3";
import { createPresignedPost } from "@aws-sdk/s3-presigned-post";
import { PutObjectCommand, S3Client } from "@aws-sdk/client-s3";
import { getSignedUrl } from "@aws-sdk/s3-request-presigner";
import { env } from "~/env";
@@ -16,7 +16,6 @@ export default async function handler(
const { filename, contentType } = req.body;
const client = new S3Client({
forcePathStyle: true,
region: env.S3_REGION,
endpoint: env.S3_ENDPOINT,
credentials: {
@@ -24,24 +23,17 @@ export default async function handler(
secretAccessKey: env.S3_SECRET_ACCESS_KEY,
},
});
const signedUrl = await createPresignedPost(client, {
Bucket: env.NEXT_PUBLIC_AVATAR_BUCKET_NAME ?? "",
Key: filename,
Conditions: [
["content-length-range", 0, 10485760], // up to 10 MB
["starts-with", "$Content-Type", contentType],
],
Fields: {
acl: "public-read",
"Content-Type": contentType,
},
Expires: 600,
});
const signedUrl = await getSignedUrl(
// @ts-ignore
client,
new PutObjectCommand({
Bucket: process.env.NEXT_PUBLIC_AVATAR_BUCKET_NAME ?? "",
Key: filename,
}),
);
const { url, fields } = signedUrl;
return res.status(200).json({ url, fields });
return res.status(200).json({ url: signedUrl, key: filename });
} catch (error) {
return res.status(500).json({ error: (error as Error).message });
}

13
apps/web/src/views/settings/components/Avatar.tsx
View File

@@ -74,20 +74,13 @@ export default function Avatar({
if (!response.ok) throw new Error("Failed to get pre-signed URL");
const { url, fields } = (await response.json()) as {
const { url } = (await response.json()) as {
url: string;
fields: Record<string, string>;
};
const formData = new FormData();
Object.entries(fields).forEach(([key, value]) => {
formData.append(key, value);
});
formData.append("file", file);
const uploadResponse = await fetch(url, {
method: "POST",
body: formData,
method: "PUT",
body: file,
});
if (!uploadResponse.ok) throw new Error("Failed to upload profile image");

169
pnpm-lock.yaml generated
View File

@@ -78,9 +78,9 @@ importers:
'@aws-sdk/client-s3':
specifier: ^3.802.0
version: 3.802.0
'@aws-sdk/s3-presigned-post':
specifier: ^3.802.0
version: 3.802.0
'@aws-sdk/s3-request-presigner':
specifier: ^3.812.0
version: 3.812.0
'@headlessui/react':
specifier: ^2.2.0
version: 2.2.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
@@ -595,6 +595,10 @@ packages:
resolution: {integrity: sha512-hkKF3Zpc6+H8GI1rlttYVRh9uEE77cqAzLmLpY3iu7sql8cZgPERRBfaFct8p1SaDyrksLNiboD1vKW58mbsYg==}
engines: {node: '>=18.0.0'}
'@aws-sdk/core@3.812.0':
resolution: {integrity: sha512-myWA9oHMBVDObKrxG+puAkIGs8igcWInQ1PWCRTS/zN4BkhUMFjjh/JPV/4Vzvtvj5E36iujq2WtlrDLl1PpOw==}
engines: {node: '>=18.0.0'}
'@aws-sdk/credential-provider-env@3.799.0':
resolution: {integrity: sha512-vT/SSWtbUIOW/U21qgEySmmO44SFWIA7WeQPX1OrI8WJ5n7OEI23JWLHjLvHTkYmuZK6z1rPcv7HzRgmuGRibA==}
engines: {node: '>=18.0.0'}
@@ -655,6 +659,10 @@ packages:
resolution: {integrity: sha512-Zwdge5NArgcJwPuGZwgfXY6XXkWEBmMS9dqu5g3DcfHmZUuSjQUqmOsDdSZlE3RFHrDAEbuGQlrFUE8zuwdKQA==}
engines: {node: '>=18.0.0'}
'@aws-sdk/middleware-sdk-s3@3.812.0':
resolution: {integrity: sha512-e8AqRRIaTsunL1hqtO1hksa9oTYdsIbfezHUyVpPGugUIB1lMqPt/DlBsanI85OzUD711UfNSEcZ1mqAxpDOoA==}
engines: {node: '>=18.0.0'}
'@aws-sdk/middleware-ssec@3.775.0':
resolution: {integrity: sha512-Iw1RHD8vfAWWPzBBIKaojO4GAvQkHOYIpKdAfis/EUSUmSa79QsnXnRqsdcE0mCB0Ylj23yi+ah4/0wh9FsekA==}
engines: {node: '>=18.0.0'}
@@ -671,14 +679,18 @@ packages:
resolution: {integrity: sha512-40iH3LJjrQS3LKUJAl7Wj0bln7RFPEvUYKFxtP8a+oKFDO0F65F52xZxIJbPn6sHkxWDAnZlGgdjZXM3p2g5wQ==}
engines: {node: '>=18.0.0'}
'@aws-sdk/s3-presigned-post@3.802.0':
resolution: {integrity: sha512-fbul+R20qUl2QGdhMGZH5moX777dt99CVDp50FQRGi8D1iR/8tUvAdjQlf2CQff2+09AJl5QlsJciH4tJFlkdA==}
'@aws-sdk/s3-request-presigner@3.812.0':
resolution: {integrity: sha512-OpyANELjcD2oknkd3/qWanaRaZDx4SSV6NwYuWIk+fuxDZ+KxZZrrfue1X7OAdaP2TdSapbs7xLisxtTuptWYg==}
engines: {node: '>=18.0.0'}
'@aws-sdk/signature-v4-multi-region@3.800.0':
resolution: {integrity: sha512-c71wZuiSUHNFCvcuqOv3jbqP+NquB2YKN4qX90OwYXEqUKn8F8fKJPpjjHjz1eK6qWKtECR4V/NTno2P70Yz/Q==}
engines: {node: '>=18.0.0'}
'@aws-sdk/signature-v4-multi-region@3.812.0':
resolution: {integrity: sha512-JTpk3ZHf7TXYbicKfOKi+VrsBTqcAszg9QR9fQmT9aCxPp39gsF3WsXq7NjepwZ5So11ixGIsPE/jtMym399QQ==}
engines: {node: '>=18.0.0'}
'@aws-sdk/token-providers@3.799.0':
resolution: {integrity: sha512-/8iDjnsJs/D8AhGbDAmdF5oSHzE4jsDsM2RIIxmBAKTZXkaaclQBNX9CmAqLKQmO3IUMZsDH2KENHLVAk/N/mw==}
engines: {node: '>=18.0.0'}
@@ -687,16 +699,24 @@ packages:
resolution: {integrity: sha512-ZoGKwa4C9fC9Av6bdfqcW6Ix5ot05F/S4VxWR2nHuMv7hzfmAjTOcUiWT7UR4hM/U0whf84VhDtXN/DWAk52KA==}
engines: {node: '>=18.0.0'}
'@aws-sdk/types@3.804.0':
resolution: {integrity: sha512-A9qnsy9zQ8G89vrPPlNG9d1d8QcKRGqJKqwyGgS0dclJpwy6d1EWgQLIolKPl6vcFpLoe6avLOLxr+h8ur5wpg==}
engines: {node: '>=18.0.0'}
'@aws-sdk/util-arn-parser@3.723.0':
resolution: {integrity: sha512-ZhEfvUwNliOQROcAk34WJWVYTlTa4694kSVhDSjW6lE1bMataPnIN8A0ycukEzBXmd8ZSoBcQLn6lKGl7XIJ5w==}
engines: {node: '>=18.0.0'}
'@aws-sdk/util-arn-parser@3.804.0':
resolution: {integrity: sha512-wmBJqn1DRXnZu3b4EkE6CWnoWMo1ZMvlfkqU5zPz67xx1GMaXlDCchFvKAXMjk4jn/L1O3tKnoFDNsoLV1kgNQ==}
engines: {node: '>=18.0.0'}
'@aws-sdk/util-endpoints@3.787.0':
resolution: {integrity: sha512-fd3zkiOkwnbdbN0Xp9TsP5SWrmv0SpT70YEdbb8wAj2DWQwiCmFszaSs+YCvhoCdmlR3Wl9Spu0pGpSAGKeYvQ==}
engines: {node: '>=18.0.0'}
'@aws-sdk/util-format-url@3.775.0':
resolution: {integrity: sha512-Nw4nBeyCbWixoGh8NcVpa/i8McMA6RXJIjQFyloJLaPr7CPquz7ZbSl0MUWMFVwP/VHaJ7B+lNN3Qz1iFCEP/Q==}
'@aws-sdk/util-format-url@3.804.0':
resolution: {integrity: sha512-1nOwSg7B0bj5LFGor0udF/HSdvDuSCxP+NC0IuSOJ5RgJ2AphFo03pLtK2UwArHY5WWZaejAEz5VBND6xxOEhA==}
engines: {node: '>=18.0.0'}
'@aws-sdk/util-locate-window@3.723.0':
@@ -1925,6 +1945,10 @@ packages:
resolution: {integrity: sha512-r6gvs5OfRq/w+9unPm7B3po4rmWaGh0CIL/OwHntGGux7+RhOOZLGuurbeMgWV6W55ZuyMTypJLeH0vn/ZRaWQ==}
engines: {node: '>=18.0.0'}
'@smithy/core@3.3.3':
resolution: {integrity: sha512-CiJNc0b/WdnttAfQ6uMkxPQ3Z8hG/ba8wF89x9KtBBLDdZk6CX52K4F8hbe94uNbc8LDUuZFtbqfdhM3T21naw==}
engines: {node: '>=18.0.0'}
'@smithy/credential-provider-imds@4.0.2':
resolution: {integrity: sha512-32lVig6jCaWBHnY+OEQ6e6Vnt5vDHaLiydGrwYMW9tPqO688hPGTYRamYJ1EptxEC2rAwJrHWmPoKRBl4iTa8w==}
engines: {node: '>=18.0.0'}
@@ -1989,6 +2013,10 @@ packages:
resolution: {integrity: sha512-z5RmcHxjvScL+LwEDU2mTNCOhgUs4lu5PGdF1K36IPRmUHhNFxNxgenSB7smyDiYD4vdKQ7CAZtG5cUErqib9w==}
engines: {node: '>=18.0.0'}
'@smithy/middleware-endpoint@4.1.6':
resolution: {integrity: sha512-Zdieg07c3ua3ap5ungdcyNnY1OsxmsXXtKDTk28+/YbwIPju0Z1ZX9X5AnkjmDE3+AbqgvhtC/ZuCMSr6VSfPw==}
engines: {node: '>=18.0.0'}
'@smithy/middleware-retry@4.1.2':
resolution: {integrity: sha512-qN/Mmxm8JWtFAjozJ8VSTM83KOX4cIks8UjDqqNkKIegzPrE5ZKPNCQ/DqUSIF90pue5a/NycNXnBod2NwvZZQ==}
engines: {node: '>=18.0.0'}
@@ -1997,6 +2025,10 @@ packages:
resolution: {integrity: sha512-rfgDVrgLEVMmMn0BI8O+8OVr6vXzjV7HZj57l0QxslhzbvVfikZbVfBVthjLHqib4BW44QhcIgJpvebHlRaC9A==}
engines: {node: '>=18.0.0'}
'@smithy/middleware-serde@4.0.5':
resolution: {integrity: sha512-yREC3q/HXqQigq29xX3hiy6tFi+kjPKXoYUQmwQdgPORLbQ0n6V2Z/Iw9Nnlu66da9fM/WhDtGvYvqwecrCljQ==}
engines: {node: '>=18.0.0'}
'@smithy/middleware-stack@4.0.2':
resolution: {integrity: sha512-eSPVcuJJGVYrFYu2hEq8g8WWdJav3sdrI4o2c6z/rjnYDd3xH9j9E7deZQCzFn4QvGPouLngH3dQ+QVTxv5bOQ==}
engines: {node: '>=18.0.0'}
@@ -2005,6 +2037,10 @@ packages:
resolution: {integrity: sha512-WgCkILRZfJwJ4Da92a6t3ozN/zcvYyJGUTmfGbgS/FkCcoCjl7G4FJaCDN1ySdvLvemnQeo25FdkyMSTSwulsw==}
engines: {node: '>=18.0.0'}
'@smithy/node-config-provider@4.1.1':
resolution: {integrity: sha512-1slS5jf5icHETwl5hxEVBj+mh6B+LbVW4yRINsGtUKH+nxM5Pw2H59+qf+JqYFCHp9jssG4vX81f5WKnjMN3Vw==}
engines: {node: '>=18.0.0'}
'@smithy/node-http-handler@4.0.4':
resolution: {integrity: sha512-/mdqabuAT3o/ihBGjL94PUbTSPSRJ0eeVTdgADzow0wRJ0rN4A27EOrtlK56MYiO1fDvlO3jVTCxQtQmK9dZ1g==}
engines: {node: '>=18.0.0'}
@@ -2041,6 +2077,10 @@ packages:
resolution: {integrity: sha512-fbniZef60QdsBc4ZY0iyI8xbFHIiC/QRtPi66iE4ufjiE/aaz7AfUXzcWMkpO8r+QhLeNRIfmPchIG+3/QDZ6g==}
engines: {node: '>=18.0.0'}
'@smithy/smithy-client@4.2.6':
resolution: {integrity: sha512-WEqP0wQ1N/lVS4pwNK1Vk+0i6QIr66cq/xbu1dVy1tM0A0qYwAYyz0JhbquzM5pMa8s89lyDBtoGKxo7iG74GA==}
engines: {node: '>=18.0.0'}
'@smithy/types@4.2.0':
resolution: {integrity: sha512-7eMk09zQKCO+E/ivsjQv+fDlOupcFUCSC/L2YUPgwhvowVGWbPQHjEFcmjt7QQ4ra5lyowS92SV53Zc6XD4+fg==}
engines: {node: '>=18.0.0'}
@@ -6030,6 +6070,20 @@ snapshots:
fast-xml-parser: 4.4.1
tslib: 2.8.1
'@aws-sdk/core@3.812.0':
dependencies:
'@aws-sdk/types': 3.804.0
'@smithy/core': 3.3.3
'@smithy/node-config-provider': 4.1.1
'@smithy/property-provider': 4.0.2
'@smithy/protocol-http': 5.1.0
'@smithy/signature-v4': 5.1.0
'@smithy/smithy-client': 4.2.6
'@smithy/types': 4.2.0
'@smithy/util-middleware': 4.0.2
fast-xml-parser: 4.4.1
tslib: 2.8.1
'@aws-sdk/credential-provider-env@3.799.0':
dependencies:
'@aws-sdk/core': 3.799.0
@@ -6195,6 +6249,23 @@ snapshots:
'@smithy/util-utf8': 4.0.0
tslib: 2.8.1
'@aws-sdk/middleware-sdk-s3@3.812.0':
dependencies:
'@aws-sdk/core': 3.812.0
'@aws-sdk/types': 3.804.0
'@aws-sdk/util-arn-parser': 3.804.0
'@smithy/core': 3.3.3
'@smithy/node-config-provider': 4.1.1
'@smithy/protocol-http': 5.1.0
'@smithy/signature-v4': 5.1.0
'@smithy/smithy-client': 4.2.6
'@smithy/types': 4.2.0
'@smithy/util-config-provider': 4.0.0
'@smithy/util-middleware': 4.0.2
'@smithy/util-stream': 4.2.0
'@smithy/util-utf8': 4.0.0
tslib: 2.8.1
'@aws-sdk/middleware-ssec@3.775.0':
dependencies:
'@aws-sdk/types': 3.775.0
@@ -6263,19 +6334,16 @@ snapshots:
'@smithy/util-middleware': 4.0.2
tslib: 2.8.1
'@aws-sdk/s3-presigned-post@3.802.0':
'@aws-sdk/s3-request-presigner@3.812.0':
dependencies:
'@aws-sdk/client-s3': 3.802.0
'@aws-sdk/types': 3.775.0
'@aws-sdk/util-format-url': 3.775.0
'@smithy/middleware-endpoint': 4.1.1
'@smithy/signature-v4': 5.1.0
'@aws-sdk/signature-v4-multi-region': 3.812.0
'@aws-sdk/types': 3.804.0
'@aws-sdk/util-format-url': 3.804.0
'@smithy/middleware-endpoint': 4.1.6
'@smithy/protocol-http': 5.1.0
'@smithy/smithy-client': 4.2.6
'@smithy/types': 4.2.0
'@smithy/util-hex-encoding': 4.0.0
'@smithy/util-utf8': 4.0.0
tslib: 2.8.1
transitivePeerDependencies:
- aws-crt
'@aws-sdk/signature-v4-multi-region@3.800.0':
dependencies:
@@ -6286,6 +6354,15 @@ snapshots:
'@smithy/types': 4.2.0
tslib: 2.8.1
'@aws-sdk/signature-v4-multi-region@3.812.0':
dependencies:
'@aws-sdk/middleware-sdk-s3': 3.812.0
'@aws-sdk/types': 3.804.0
'@smithy/protocol-http': 5.1.0
'@smithy/signature-v4': 5.1.0
'@smithy/types': 4.2.0
tslib: 2.8.1
'@aws-sdk/token-providers@3.799.0':
dependencies:
'@aws-sdk/nested-clients': 3.799.0
@@ -6302,10 +6379,19 @@ snapshots:
'@smithy/types': 4.2.0
tslib: 2.8.1
'@aws-sdk/types@3.804.0':
dependencies:
'@smithy/types': 4.2.0
tslib: 2.8.1
'@aws-sdk/util-arn-parser@3.723.0':
dependencies:
tslib: 2.8.1
'@aws-sdk/util-arn-parser@3.804.0':
dependencies:
tslib: 2.8.1
'@aws-sdk/util-endpoints@3.787.0':
dependencies:
'@aws-sdk/types': 3.775.0
@@ -6313,9 +6399,9 @@ snapshots:
'@smithy/util-endpoints': 3.0.2
tslib: 2.8.1
'@aws-sdk/util-format-url@3.775.0':
'@aws-sdk/util-format-url@3.804.0':
dependencies:
'@aws-sdk/types': 3.775.0
'@aws-sdk/types': 3.804.0
'@smithy/querystring-builder': 4.0.2
'@smithy/types': 4.2.0
tslib: 2.8.1
@@ -7425,6 +7511,17 @@ snapshots:
'@smithy/util-utf8': 4.0.0
tslib: 2.8.1
'@smithy/core@3.3.3':
dependencies:
'@smithy/middleware-serde': 4.0.5
'@smithy/protocol-http': 5.1.0
'@smithy/types': 4.2.0
'@smithy/util-body-length-browser': 4.0.0
'@smithy/util-middleware': 4.0.2
'@smithy/util-stream': 4.2.0
'@smithy/util-utf8': 4.0.0
tslib: 2.8.1
'@smithy/credential-provider-imds@4.0.2':
dependencies:
'@smithy/node-config-provider': 4.0.2
@@ -7527,6 +7624,17 @@ snapshots:
'@smithy/util-middleware': 4.0.2
tslib: 2.8.1
'@smithy/middleware-endpoint@4.1.6':
dependencies:
'@smithy/core': 3.3.3
'@smithy/middleware-serde': 4.0.5
'@smithy/node-config-provider': 4.1.1
'@smithy/shared-ini-file-loader': 4.0.2
'@smithy/types': 4.2.0
'@smithy/url-parser': 4.0.2
'@smithy/util-middleware': 4.0.2
tslib: 2.8.1
'@smithy/middleware-retry@4.1.2':
dependencies:
'@smithy/node-config-provider': 4.0.2
@@ -7544,6 +7652,12 @@ snapshots:
'@smithy/types': 4.2.0
tslib: 2.8.1
'@smithy/middleware-serde@4.0.5':
dependencies:
'@smithy/protocol-http': 5.1.0
'@smithy/types': 4.2.0
tslib: 2.8.1
'@smithy/middleware-stack@4.0.2':
dependencies:
'@smithy/types': 4.2.0
@@ -7556,6 +7670,13 @@ snapshots:
'@smithy/types': 4.2.0
tslib: 2.8.1
'@smithy/node-config-provider@4.1.1':
dependencies:
'@smithy/property-provider': 4.0.2
'@smithy/shared-ini-file-loader': 4.0.2
'@smithy/types': 4.2.0
tslib: 2.8.1
'@smithy/node-http-handler@4.0.4':
dependencies:
'@smithy/abort-controller': 4.0.2
@@ -7615,6 +7736,16 @@ snapshots:
'@smithy/util-stream': 4.2.0
tslib: 2.8.1
'@smithy/smithy-client@4.2.6':
dependencies:
'@smithy/core': 3.3.3
'@smithy/middleware-endpoint': 4.1.6
'@smithy/middleware-stack': 4.0.2
'@smithy/protocol-http': 5.1.0
'@smithy/types': 4.2.0
'@smithy/util-stream': 4.2.0
tslib: 2.8.1
'@smithy/types@4.2.0':
dependencies:
tslib: 2.8.1