Skip to content

Commit 7a2bc8f

Browse files
committed
feat(docs): add URL generation examples and authentication parameters to README
1 parent 297bb95 commit 7a2bc8f

File tree

1 file changed

+197
-0
lines changed

1 file changed

+197
-0
lines changed

README.md

Lines changed: 197 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -89,6 +89,203 @@ await client.files.upload({ file: await toFile(Buffer.from('my bytes'), 'file'),
8989
await client.files.upload({ file: await toFile(new Uint8Array([0, 1, 2]), 'file'), fileName: 'fileName' });
9090
```
9191

92+
## URL generation
93+
94+
The ImageKit SDK provides a powerful `helper.buildSrc()` method for generating optimized image and video URLs with transformations. Here are examples ranging from simple URLs to complex transformations with overlays and signed URLs.
95+
96+
### Basic URL generation
97+
98+
Generate a simple URL without any transformations:
99+
100+
```ts
101+
import ImageKit from '@imagekit/nodejs';
102+
103+
const client = new ImageKit({
104+
privateAPIKey: process.env['IMAGEKIT_PRIVATE_API_KEY'],
105+
password: process.env['ORG_MY_PASSWORD_TOKEN'],
106+
});
107+
108+
// Basic URL without transformations
109+
const url = client.helper.buildSrc({
110+
urlEndpoint: 'https://ik.imagekit.io/your_imagekit_id',
111+
src: '/path/to/image.jpg'
112+
});
113+
// Result: https://ik.imagekit.io/your_imagekit_id/path/to/image.jpg
114+
```
115+
116+
### URL generation with transformations
117+
118+
Apply common transformations like resizing, cropping, and format conversion:
119+
120+
```ts
121+
// URL with basic transformations
122+
const transformedUrl = client.helper.buildSrc({
123+
urlEndpoint: 'https://ik.imagekit.io/your_imagekit_id',
124+
src: '/path/to/image.jpg',
125+
transformation: [
126+
{
127+
width: 400,
128+
height: 300,
129+
crop: 'maintain_ratio',
130+
quality: 80,
131+
format: 'webp'
132+
}
133+
]
134+
});
135+
// Result: https://ik.imagekit.io/your_imagekit_id/path/to/image.jpg?tr=w-400,h-300,c-maintain_ratio,q-80,f-webp
136+
```
137+
138+
### URL generation with image overlay
139+
140+
Add image overlays to your base image:
141+
142+
```ts
143+
// URL with image overlay
144+
const imageOverlayUrl = client.helper.buildSrc({
145+
urlEndpoint: 'https://ik.imagekit.io/your_imagekit_id',
146+
src: '/path/to/base-image.jpg',
147+
transformation: [
148+
{
149+
width: 500,
150+
height: 400,
151+
overlay: {
152+
type: 'image',
153+
input: '/path/to/overlay-logo.png',
154+
position: {
155+
x: 10,
156+
y: 10
157+
},
158+
transformation: [
159+
{
160+
width: 100,
161+
height: 50
162+
}
163+
]
164+
}
165+
}
166+
]
167+
});
168+
// Result: URL with image overlay positioned at x:10, y:10
169+
```
170+
171+
### URL generation with text overlay
172+
173+
Add customized text overlays:
174+
175+
```ts
176+
// URL with text overlay
177+
const textOverlayUrl = client.helper.buildSrc({
178+
urlEndpoint: 'https://ik.imagekit.io/your_imagekit_id',
179+
src: '/path/to/base-image.jpg',
180+
transformation: [
181+
{
182+
width: 600,
183+
height: 400,
184+
overlay: {
185+
type: 'text',
186+
text: 'Sample Text Overlay',
187+
position: {
188+
x: 50,
189+
y: 50,
190+
focus: 'center'
191+
},
192+
transformation: [
193+
{
194+
fontSize: 40,
195+
fontFamily: 'Arial',
196+
fontColor: 'FFFFFF',
197+
typography: 'b' // bold
198+
}
199+
]
200+
}
201+
}
202+
]
203+
});
204+
// Result: URL with bold white Arial text overlay at center position
205+
```
206+
207+
### URL generation with multiple overlays
208+
209+
Combine multiple overlays for complex compositions:
210+
211+
```ts
212+
// URL with multiple overlays (text + image)
213+
const multipleOverlaysUrl = client.helper.buildSrc({
214+
urlEndpoint: 'https://ik.imagekit.io/your_imagekit_id',
215+
src: '/path/to/base-image.jpg',
216+
transformation: [
217+
{
218+
width: 800,
219+
height: 600,
220+
overlay: {
221+
type: 'text',
222+
text: 'Header Text',
223+
position: { x: 20, y: 20 },
224+
transformation: [{ fontSize: 30, fontColor: '000000' }]
225+
}
226+
},
227+
{
228+
overlay: {
229+
type: 'image',
230+
input: '/watermark.png',
231+
position: { focus: 'bottom_right' },
232+
transformation: [{ width: 100, opacity: 70 }]
233+
}
234+
}
235+
]
236+
});
237+
// Result: URL with text overlay at top-left and semi-transparent watermark at bottom-right
238+
```
239+
240+
### Signed URLs for secure delivery
241+
242+
Generate signed URLs that expire after a specified time for secure content delivery:
243+
244+
```ts
245+
// Generate a signed URL that expires in 1 hour (3600 seconds)
246+
const signedUrl = client.helper.buildSrc({
247+
urlEndpoint: 'https://ik.imagekit.io/your_imagekit_id',
248+
src: '/private/secure-image.jpg',
249+
transformation: [
250+
{
251+
width: 400,
252+
height: 300,
253+
quality: 90
254+
}
255+
],
256+
signed: true,
257+
expiresIn: 3600 // URL expires in 1 hour
258+
});
259+
// Result: URL with signature parameters (?ik-t=timestamp&ik-s=signature)
260+
261+
// Generate a signed URL that doesn't expire
262+
const permanentSignedUrl = client.helper.buildSrc({
263+
urlEndpoint: 'https://ik.imagekit.io/your_imagekit_id',
264+
src: '/private/secure-image.jpg',
265+
signed: true
266+
// No expiresIn means the URL won't expire
267+
});
268+
// Result: URL with signature parameter (?ik-s=signature)
269+
```
270+
271+
### Authentication parameters for client-side uploads
272+
273+
Generate authentication parameters for secure client-side file uploads:
274+
275+
```ts
276+
// Generate authentication parameters for client-side uploads
277+
const authParams = client.helper.getAuthenticationParameters();
278+
console.log(authParams);
279+
// Result: { token: 'uuid-token', expire: timestamp, signature: 'hmac-signature' }
280+
281+
// Generate with custom token and expiry
282+
const customAuthParams = client.helper.getAuthenticationParameters('my-custom-token', 1800);
283+
console.log(customAuthParams);
284+
// Result: { token: 'my-custom-token', expire: 1800, signature: 'hmac-signature' }
285+
```
286+
287+
These authentication parameters can be used in client-side upload forms to securely upload files without exposing your private API key.
288+
92289
## Handling errors
93290

94291
When the library is unable to connect to the API,

0 commit comments

Comments
 (0)