imgix-url-builder 0.0.4 → 0.0.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/Client.cjs +143 -0
- package/dist/Client.cjs.map +1 -0
- package/dist/Client.d.ts +145 -0
- package/dist/{index.mjs → Client.js} +11 -41
- package/dist/Client.js.map +1 -0
- package/dist/buildPixelDensitySrcSet.cjs +10 -0
- package/dist/buildPixelDensitySrcSet.cjs.map +1 -0
- package/dist/buildPixelDensitySrcSet.d.ts +58 -0
- package/dist/buildPixelDensitySrcSet.js +10 -0
- package/dist/buildPixelDensitySrcSet.js.map +1 -0
- package/dist/buildURL.cjs +29 -0
- package/dist/buildURL.cjs.map +1 -0
- package/dist/buildURL.d.ts +36 -0
- package/dist/buildURL.js +29 -0
- package/dist/buildURL.js.map +1 -0
- package/dist/buildWidthSrcSet.cjs +10 -0
- package/dist/buildWidthSrcSet.cjs.map +1 -0
- package/dist/buildWidthSrcSet.d.ts +56 -0
- package/dist/buildWidthSrcSet.js +10 -0
- package/dist/buildWidthSrcSet.js.map +1 -0
- package/dist/index.cjs +10 -179
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.ts +8 -2734
- package/dist/index.js +11 -173
- package/dist/index.js.map +1 -0
- package/dist/node/{index.cjs → SecureClient.cjs} +31 -98
- package/dist/node/SecureClient.cjs.map +1 -0
- package/dist/node/SecureClient.d.ts +502 -0
- package/dist/node/{index.mjs → SecureClient.js} +25 -83
- package/dist/node/SecureClient.js.map +1 -0
- package/dist/node/buildSignedPixelDensitySrcSet.cjs +13 -0
- package/dist/node/buildSignedPixelDensitySrcSet.cjs.map +1 -0
- package/dist/node/buildSignedPixelDensitySrcSet.d.ts +54 -0
- package/dist/node/buildSignedPixelDensitySrcSet.js +13 -0
- package/dist/node/buildSignedPixelDensitySrcSet.js.map +1 -0
- package/dist/node/buildSignedURL.cjs +9 -0
- package/dist/node/buildSignedURL.cjs.map +1 -0
- package/dist/node/buildSignedURL.d.ts +49 -0
- package/dist/node/buildSignedURL.js +9 -0
- package/dist/node/buildSignedURL.js.map +1 -0
- package/dist/node/buildSignedWidthSrcSet.cjs +14 -0
- package/dist/node/buildSignedWidthSrcSet.cjs.map +1 -0
- package/dist/node/buildSignedWidthSrcSet.d.ts +54 -0
- package/dist/node/buildSignedWidthSrcSet.js +14 -0
- package/dist/node/buildSignedWidthSrcSet.js.map +1 -0
- package/dist/node/index.d.ts +7 -3196
- package/dist/node/signURL.cjs +12 -0
- package/dist/node/signURL.cjs.map +1 -0
- package/dist/node/signURL.d.ts +27 -0
- package/dist/node/signURL.js +12 -0
- package/dist/node/signURL.js.map +1 -0
- package/dist/node.cjs +15 -0
- package/dist/node.cjs.map +1 -0
- package/dist/node.js +15 -0
- package/dist/node.js.map +1 -0
- package/dist/types.generated.d.ts +2746 -0
- package/package.json +57 -33
- package/src/buildWidthSrcSet.ts +7 -3
- package/src/types.generated.ts +1243 -480
- package/dist/index.mjs.map +0 -1
- package/dist/node/index.cjs.map +0 -1
- package/dist/node/index.d.ts.map +0 -1
- package/dist/node/index.mjs.map +0 -1
|
@@ -0,0 +1,502 @@
|
|
|
1
|
+
import type { BuildPixelDensitySrcSetParams } from "../buildPixelDensitySrcSet";
|
|
2
|
+
import type { BuildWidthSrcSetParams } from "../buildWidthSrcSet";
|
|
3
|
+
import type { ImgixURLParams } from "../types.generated";
|
|
4
|
+
/**
|
|
5
|
+
* Options to instantiate a new secure client.
|
|
6
|
+
*/
|
|
7
|
+
export type SecureClientOptions = {
|
|
8
|
+
/**
|
|
9
|
+
* The base URL used to construct image URLs from a path. The base URL must
|
|
10
|
+
* include the protocol, domain, and optionally a path.
|
|
11
|
+
*
|
|
12
|
+
* @example `https://example.imgix.net`
|
|
13
|
+
*
|
|
14
|
+
* @example `https://example.imgix.net/folder`
|
|
15
|
+
*/
|
|
16
|
+
baseURL: string;
|
|
17
|
+
/**
|
|
18
|
+
* The secret secure URL token for the configured Imgix domain.
|
|
19
|
+
*
|
|
20
|
+
* @see How to get a token: https://docs.imgix.com/setup/securing-images
|
|
21
|
+
*/
|
|
22
|
+
secureURLToken: string;
|
|
23
|
+
};
|
|
24
|
+
/**
|
|
25
|
+
* An Imgix Rendering API client with automatic URL signing. A client is paired
|
|
26
|
+
* to a single Imgix domain and secure URL token.
|
|
27
|
+
*
|
|
28
|
+
* **Important**: This client should only be used in a trusted environment and
|
|
29
|
+
* never in a browser. The `secureURLToken` parameter is a secret and should not
|
|
30
|
+
* be exposed to the public.
|
|
31
|
+
*/
|
|
32
|
+
export declare class SecureClient {
|
|
33
|
+
/**
|
|
34
|
+
* The base URL used to construct image URLs from a path. The base URL must
|
|
35
|
+
* include the protocol, domain, and optionally a path.
|
|
36
|
+
*/
|
|
37
|
+
baseURL: string;
|
|
38
|
+
/**
|
|
39
|
+
* The secret secure URL token for the configured Imgix domain.
|
|
40
|
+
*/
|
|
41
|
+
secureURLToken: string;
|
|
42
|
+
/**
|
|
43
|
+
* Creates a new `SecureClient` instance for an Imgix domain.
|
|
44
|
+
*
|
|
45
|
+
* @param options - Options to instantiate a new client.
|
|
46
|
+
*
|
|
47
|
+
* @returns A `SecureClient` instance for the given Imgix domain.
|
|
48
|
+
*/
|
|
49
|
+
constructor(options: SecureClientOptions);
|
|
50
|
+
/**
|
|
51
|
+
* Builds a Web Proxy URL that proxies a non-Imgix URL to Imgix. The client's
|
|
52
|
+
* Imgix domain must be configured as a Web Proxy source. All Web Proxy URLs
|
|
53
|
+
* will be signed automatically.
|
|
54
|
+
*
|
|
55
|
+
* **Important**: The given URL must not be URI encoded. If it is, decode it
|
|
56
|
+
* before passing it to `buildWebProxyURL()`.
|
|
57
|
+
*
|
|
58
|
+
* @example
|
|
59
|
+
*
|
|
60
|
+
* ```ts
|
|
61
|
+
* const client = new SecureClient({
|
|
62
|
+
* baseURL: "https://example.imgix.net",
|
|
63
|
+
* secureURLToken: "example-token",
|
|
64
|
+
* });
|
|
65
|
+
* const url = client.buildWebProxyURL("https://www.this.com/pic.jpg", {
|
|
66
|
+
* width: 400,
|
|
67
|
+
* });
|
|
68
|
+
* // => https://example.imgix.net/https%3A%2F%2Fwww.this.com%2Fpic.jpg?width=400&s=def3e221c3f4c4debda091b8e49420ea
|
|
69
|
+
* ```
|
|
70
|
+
*
|
|
71
|
+
* @param url - Full absolute URL to the source image to proxy.
|
|
72
|
+
* @param params - An object of Imgix URL API parameters.
|
|
73
|
+
*
|
|
74
|
+
* @returns An Imgix url proxying `url` to the client's Imgix domain.
|
|
75
|
+
*/
|
|
76
|
+
buildWebProxyURL(url: string, params?: ImgixURLParams): string;
|
|
77
|
+
/**
|
|
78
|
+
* Builds a URL to an Imgix image with Imgix URL API parameters for the
|
|
79
|
+
* client's base URL.
|
|
80
|
+
*
|
|
81
|
+
* @example
|
|
82
|
+
*
|
|
83
|
+
* ```ts
|
|
84
|
+
* const client = new SecureClient({
|
|
85
|
+
* baseURL: "https://example.imgix.net",
|
|
86
|
+
* secureURLToken: "example-token",
|
|
87
|
+
* });
|
|
88
|
+
* const url = client.buildURLForPath("/image.png", { width: 400 });
|
|
89
|
+
* // => https://example.imgix.net/image.png?width=400&s=def3e221c3f4c4debda091b8e49420ea
|
|
90
|
+
* ```
|
|
91
|
+
*
|
|
92
|
+
* @example
|
|
93
|
+
*
|
|
94
|
+
* ```ts
|
|
95
|
+
* const client = new SecureClient({
|
|
96
|
+
* baseURL: "https://example.imgix.net/folder",
|
|
97
|
+
* secureURLToken: "example-token",
|
|
98
|
+
* });
|
|
99
|
+
* const url = client.buildURLForPath("./image.png", { width: 400 });
|
|
100
|
+
* // => https://example.imgix.net/folder/image.png?width=400&s=f12c7c39333410c10c2930b57116a943
|
|
101
|
+
* ```
|
|
102
|
+
*
|
|
103
|
+
* @param path - Path to the image relative to the client's base URL.
|
|
104
|
+
* @param params - An object of Imgix URL API parameters.
|
|
105
|
+
*
|
|
106
|
+
* @returns The full absolute URL to the image with the given Imgix URL API
|
|
107
|
+
* parameters applied.
|
|
108
|
+
*/
|
|
109
|
+
buildSignedURLForPath(path: string, params?: ImgixURLParams): string;
|
|
110
|
+
/**
|
|
111
|
+
* Builds a URL to an Imgix image with Imgix URL API parameters for the
|
|
112
|
+
* client's base URL.
|
|
113
|
+
*
|
|
114
|
+
* Note: The returned URL is not signed. See `buildSignedURL` if a signature
|
|
115
|
+
* is required.
|
|
116
|
+
*
|
|
117
|
+
* @example
|
|
118
|
+
*
|
|
119
|
+
* ```ts
|
|
120
|
+
* const client = new SecureClient({
|
|
121
|
+
* baseURL: "https://example.imgix.net",
|
|
122
|
+
* secureURLToken: "example-token",
|
|
123
|
+
* });
|
|
124
|
+
* const url = client.buildURLForPath("/image.png", { width: 400 });
|
|
125
|
+
* // => https://example.imgix.net/image.png?width=400
|
|
126
|
+
* ```
|
|
127
|
+
*
|
|
128
|
+
* @example
|
|
129
|
+
*
|
|
130
|
+
* ```ts
|
|
131
|
+
* const client = new SecureClient({
|
|
132
|
+
* baseURL: "https://example.imgix.net/folder",
|
|
133
|
+
* secureURLToken: "example-token",
|
|
134
|
+
* });
|
|
135
|
+
* const url = client.buildURLForPath("./image.png", { width: 400 });
|
|
136
|
+
* // => https://example.imgix.net/folder/image.png?width=400
|
|
137
|
+
* ```
|
|
138
|
+
*
|
|
139
|
+
* @param path - Path to the image relative to the client's base URL.
|
|
140
|
+
* @param params - An object of Imgix URL API parameters.
|
|
141
|
+
*
|
|
142
|
+
* @returns The full absolute URL to the image with the given Imgix URL API
|
|
143
|
+
* parameters applied.
|
|
144
|
+
*/
|
|
145
|
+
buildURLForPath(path: string, params?: ImgixURLParams): string;
|
|
146
|
+
/**
|
|
147
|
+
* Builds a URL to an Imgix image with Imgix URL API parameters. The URL is
|
|
148
|
+
* signed by appending a signature to the URL parameters. This locks the URL
|
|
149
|
+
* and its parameters to the signature to prevent URL tampering.
|
|
150
|
+
*
|
|
151
|
+
* The given URL must be a full absolute URL containing the protocol and
|
|
152
|
+
* domain.
|
|
153
|
+
*
|
|
154
|
+
* URL parameters already applied to the image will be retained. To remove
|
|
155
|
+
* existing parameters, set the parameter to `undefined` in the `params`
|
|
156
|
+
* argument.
|
|
157
|
+
*
|
|
158
|
+
* @example
|
|
159
|
+
*
|
|
160
|
+
* ```ts
|
|
161
|
+
* const url = client.buildSignedURL(
|
|
162
|
+
* "https://example.imgix.net/image.png",
|
|
163
|
+
* { width: 400 },
|
|
164
|
+
* );
|
|
165
|
+
* // => https://example.imgix.net/image.png?width=400&s=def3e221c3f4c4debda091b8e49420ea
|
|
166
|
+
* ```
|
|
167
|
+
*
|
|
168
|
+
* @example
|
|
169
|
+
*
|
|
170
|
+
* ```ts
|
|
171
|
+
* const url = client.buildSignedURL(
|
|
172
|
+
* "https://example.imgix.net/image.png?width=400",
|
|
173
|
+
* { height: 300 },
|
|
174
|
+
* );
|
|
175
|
+
* // => https://example.imgix.net/image.png?width=400&height=300&s=f12c7c39333410c10c2930b57116a943
|
|
176
|
+
* ```
|
|
177
|
+
*
|
|
178
|
+
* @param url - Full absolute URL to the Imgix image.
|
|
179
|
+
* @param params - An object of Imgix URL API parameters.
|
|
180
|
+
*
|
|
181
|
+
* @returns `url` with the given Imgix URL API parameters applied.
|
|
182
|
+
*
|
|
183
|
+
* @see Imgix URL API reference: https://docs.imgix.com/apis/rendering
|
|
184
|
+
* @see Details on securing Imgix images: https://docs.imgix.com/setup/securing-images
|
|
185
|
+
*/
|
|
186
|
+
buildSignedURL(url: string, params?: ImgixURLParams): string;
|
|
187
|
+
/**
|
|
188
|
+
* Signs an Imgix image URL by appending a signature to the URL parameters.
|
|
189
|
+
* This locks the URL and its parameters to the signature to prevent URL
|
|
190
|
+
* tampering.
|
|
191
|
+
*
|
|
192
|
+
* @example
|
|
193
|
+
*
|
|
194
|
+
* ```ts
|
|
195
|
+
* const url = client.signURL(
|
|
196
|
+
* "https://example.imgix.net/image.png?width=400",
|
|
197
|
+
* );
|
|
198
|
+
* // => https://example.imgix.net/image.png?width=400&s=def3e221c3f4c4debda091b8e49420ea
|
|
199
|
+
* ```
|
|
200
|
+
*
|
|
201
|
+
* @param url - Full absolute URL to the Imgix image to sign.
|
|
202
|
+
*
|
|
203
|
+
* @returns `url` with a signature appended via an `s` URL parameter.
|
|
204
|
+
*
|
|
205
|
+
* @see Details on securing Imgix images: https://docs.imgix.com/setup/securing-images
|
|
206
|
+
*/
|
|
207
|
+
signURL(url: string): string;
|
|
208
|
+
/**
|
|
209
|
+
* Builds an `<img>` `srcset` attribute value for a given set of widths. It
|
|
210
|
+
* can also optinally apply Imgix URL API parameters to the URLs. The URLs are
|
|
211
|
+
* signed by appending a signature to their URL parameters. This locks the
|
|
212
|
+
* URLs and their parameters to the signature to prevent URL tampering.
|
|
213
|
+
*
|
|
214
|
+
* The `width` URL parameter will be applied for each `srcset` entry. If a
|
|
215
|
+
* `width` or `w` parameter is provided to the `params` parameter, it will be
|
|
216
|
+
* ignored.
|
|
217
|
+
*
|
|
218
|
+
* @example
|
|
219
|
+
*
|
|
220
|
+
* ```ts
|
|
221
|
+
* const srcset = client.buildSignedWidthSrcSet(
|
|
222
|
+
* "https://example.imgix.net/image.png",
|
|
223
|
+
* { widths: [400, 800, 1600] },
|
|
224
|
+
* );
|
|
225
|
+
* // => https://example.imgix.net/image.png?width=400&s=def3e221c3f4c4debda091b8e49420ea 400w,
|
|
226
|
+
* // https://example.imgix.net/image.png?width=800&s=f12c7c39333410c10c2930b57116a943 800w,
|
|
227
|
+
* // https://example.imgix.net/image.png?width=1600&s=3a975b5087ab7ad2ab91fe66072fd628 1600w
|
|
228
|
+
* ```
|
|
229
|
+
*
|
|
230
|
+
* @example
|
|
231
|
+
*
|
|
232
|
+
* ```ts
|
|
233
|
+
* const srcset = client.buildSignedWidthSrcSet(
|
|
234
|
+
* "https://example.imgix.net/image.png",
|
|
235
|
+
* {
|
|
236
|
+
* widths: [400, 800, 1600],
|
|
237
|
+
* sat: -100,
|
|
238
|
+
* },
|
|
239
|
+
* );
|
|
240
|
+
* // => https://example.imgix.net/image.png?width=400&sat=-100&s=def3e221c3f4c4debda091b8e49420ea 400w,
|
|
241
|
+
* // https://example.imgix.net/image.png?width=800&sat=-100&s=f12c7c39333410c10c2930b57116a943 800w,
|
|
242
|
+
* // https://example.imgix.net/image.png?width=1600&sat=-100&s=3a975b5087ab7ad2ab91fe66072fd628 1600w
|
|
243
|
+
* ```
|
|
244
|
+
*
|
|
245
|
+
* @param url - Full absolute URL to the Imgix image.
|
|
246
|
+
* @param params - An object of Imgix URL API parameters. The `widths`
|
|
247
|
+
* parameter defines the resulting `srcset` widths.
|
|
248
|
+
*
|
|
249
|
+
* @returns A `srcset` attribute value for `url` with the given Imgix URL API
|
|
250
|
+
* parameters applied.
|
|
251
|
+
*/
|
|
252
|
+
buildSignedWidthSrcSet(url: string, params: BuildWidthSrcSetParams): string;
|
|
253
|
+
/**
|
|
254
|
+
* Builds an `<img>` `srcset` attribute value for a given set of widths for
|
|
255
|
+
* the client's base URL. It can also optinally apply Imgix URL API parameters
|
|
256
|
+
* to the URLs.
|
|
257
|
+
*
|
|
258
|
+
* The `width` URL parameter will be applied for each `srcset` entry. If a
|
|
259
|
+
* `width` or `w` parameter is provided to the `params` parameter, it will be
|
|
260
|
+
* ignored.
|
|
261
|
+
*
|
|
262
|
+
* Note: The returned URLs are not signed. See `buildSignedWidthSrcSet` if
|
|
263
|
+
* signatures are required.
|
|
264
|
+
*
|
|
265
|
+
* @example
|
|
266
|
+
*
|
|
267
|
+
* ```ts
|
|
268
|
+
* const client = new SecureClient({
|
|
269
|
+
* baseURL: "https://example.imgix.net",
|
|
270
|
+
* secureURLToken: "example-token",
|
|
271
|
+
* });
|
|
272
|
+
* const srcset = client.buildWidthSrcSetForPath("/image.png", {
|
|
273
|
+
* widths: [400, 800, 1600],
|
|
274
|
+
* });
|
|
275
|
+
* // => https://example.imgix.net/image.png?width=400 400w,
|
|
276
|
+
* // https://example.imgix.net/image.png?width=800 800w,
|
|
277
|
+
* // https://example.imgix.net/image.png?width=1600 1600w
|
|
278
|
+
* ```
|
|
279
|
+
*
|
|
280
|
+
* @example
|
|
281
|
+
*
|
|
282
|
+
* ```ts
|
|
283
|
+
* const client = new SecureClient({
|
|
284
|
+
* baseURL: "https://example.imgix.net",
|
|
285
|
+
* secureURLToken: "example-token",
|
|
286
|
+
* });
|
|
287
|
+
* const srcset = client.buildWidthSrcSetForPath("/image.png", {
|
|
288
|
+
* widths: [400, 800, 1600],
|
|
289
|
+
* sat: -100,
|
|
290
|
+
* });
|
|
291
|
+
* // => https://example.imgix.net/image.png?width=400&sat=-100 400w,
|
|
292
|
+
* // https://example.imgix.net/image.png?width=800&sat=-100 800w,
|
|
293
|
+
* // https://example.imgix.net/image.png?width=1600&sat=-100 1600w
|
|
294
|
+
* ```
|
|
295
|
+
*
|
|
296
|
+
* @param path - Path to the image relative to the client's base URL.
|
|
297
|
+
* @param params - An object of Imgix URL API parameters. The `widths`
|
|
298
|
+
* parameter defines the resulting `srcset` widths.
|
|
299
|
+
*
|
|
300
|
+
* @returns A `srcset` attribute value for `url` with the given Imgix URL API
|
|
301
|
+
* parameters applied.
|
|
302
|
+
*/
|
|
303
|
+
buildWidthSrcSetForPath(path: string, params: BuildWidthSrcSetParams): string;
|
|
304
|
+
/**
|
|
305
|
+
* Builds an `<img>` `srcset` attribute value for a given set of widths for
|
|
306
|
+
* the client's base URL. It can also optinally apply Imgix URL API parameters
|
|
307
|
+
* to the URLs. The URLs are signed by appending a signature to their URL
|
|
308
|
+
* parameters. This locks the URLs and their parameters to the signature to
|
|
309
|
+
* prevent URL tampering.
|
|
310
|
+
*
|
|
311
|
+
* The `width` URL parameter will be applied for each `srcset` entry. If a
|
|
312
|
+
* `width` or `w` parameter is provided to the `params` parameter, it will be
|
|
313
|
+
* ignored.
|
|
314
|
+
*
|
|
315
|
+
* @example
|
|
316
|
+
*
|
|
317
|
+
* ```ts
|
|
318
|
+
* const client = new SecureClient({
|
|
319
|
+
* baseURL: "https://example.imgix.net",
|
|
320
|
+
* secureURLToken: "example-token",
|
|
321
|
+
* });
|
|
322
|
+
* const srcset = client.buildSignedWidthSrcSetForPath("/image.png", {
|
|
323
|
+
* widths: [400, 800, 1600],
|
|
324
|
+
* });
|
|
325
|
+
* // => https://example.imgix.net/image.png?width=400&s=def3e221c3f4c4debda091b8e49420ea 400w,
|
|
326
|
+
* // https://example.imgix.net/image.png?width=800&s=f12c7c39333410c10c2930b57116a943 800w,
|
|
327
|
+
* // https://example.imgix.net/image.png?width=1600&s=3a975b5087ab7ad2ab91fe66072fd628 1600w
|
|
328
|
+
* ```
|
|
329
|
+
*
|
|
330
|
+
* @example
|
|
331
|
+
*
|
|
332
|
+
* ```ts
|
|
333
|
+
* const client = new SecureClient({
|
|
334
|
+
* baseURL: "https://example.imgix.net",
|
|
335
|
+
* secureURLToken: "example-token",
|
|
336
|
+
* });
|
|
337
|
+
* const srcset = client.buildSignedWidthSrcSetForPath("/image.png", {
|
|
338
|
+
* widths: [400, 800, 1600],
|
|
339
|
+
* sat: -100,
|
|
340
|
+
* });
|
|
341
|
+
* // => https://example.imgix.net/image.png?width=400&sat=-100&s=def3e221c3f4c4debda091b8e49420ea 400w,
|
|
342
|
+
* // https://example.imgix.net/image.png?width=800&sat=-100&s=f12c7c39333410c10c2930b57116a943 800w,
|
|
343
|
+
* // https://example.imgix.net/image.png?width=1600&sat=-100&s=3a975b5087ab7ad2ab91fe66072fd628 1600w
|
|
344
|
+
* ```
|
|
345
|
+
*
|
|
346
|
+
* @param path - Path to the image relative to the client's base URL.
|
|
347
|
+
* @param params - An object of Imgix URL API parameters. The `widths`
|
|
348
|
+
* parameter defines the resulting `srcset` widths.
|
|
349
|
+
*
|
|
350
|
+
* @returns A `srcset` attribute value for `url` with the given Imgix URL API
|
|
351
|
+
* parameters applied.
|
|
352
|
+
*/
|
|
353
|
+
buildSignedWidthSrcSetForPath(path: string, params: BuildWidthSrcSetParams): string;
|
|
354
|
+
/**
|
|
355
|
+
* Builds an `<img>` `srcset` attribute value for a given set of pixel
|
|
356
|
+
* densities. It can also optinally apply Imgix URL API parameters to the
|
|
357
|
+
* URLs. The URLs are signed by appending a signature to their URL parameters.
|
|
358
|
+
* This locks the URLs and their parameters to the signature to prevent URL
|
|
359
|
+
* tampering.
|
|
360
|
+
*
|
|
361
|
+
* The `dpr` URL parameter will be applied for each `srcset` entry. If a `dpr`
|
|
362
|
+
* parameter is provided to the `params` parameter, it will be ignored.
|
|
363
|
+
*
|
|
364
|
+
* @example
|
|
365
|
+
*
|
|
366
|
+
* ```ts
|
|
367
|
+
* const srcset = client.buildSignedPixelDensitySrcSet(
|
|
368
|
+
* "https://example.imgix.net/image.png",
|
|
369
|
+
* { pixelDensities: [1, 2, 3] },
|
|
370
|
+
* );
|
|
371
|
+
* // => https://example.imgix.net/image.png?dpr=1&s=def3e221c3f4c4debda091b8e49420ea 1x,
|
|
372
|
+
* // https://example.imgix.net/image.png?dpr=2&s=f12c7c39333410c10c2930b57116a943 2x,
|
|
373
|
+
* // https://example.imgix.net/image.png?dpr=3&s=3a975b5087ab7ad2ab91fe66072fd628 3x
|
|
374
|
+
* ```
|
|
375
|
+
*
|
|
376
|
+
* @example
|
|
377
|
+
*
|
|
378
|
+
* ```ts
|
|
379
|
+
* const srcset = client.buildSignedPixelDensitySrcSet(
|
|
380
|
+
* "https://example.imgix.net/image.png",
|
|
381
|
+
* {
|
|
382
|
+
* pixelDensities: [1, 2, 3],
|
|
383
|
+
* sat: -100,
|
|
384
|
+
* },
|
|
385
|
+
* );
|
|
386
|
+
* // => https://example.imgix.net/image.png?dpr=1&sat=-100&s=def3e221c3f4c4debda091b8e49420ea 1x,
|
|
387
|
+
* // https://example.imgix.net/image.png?dpr=2&sat=-100&s=f12c7c39333410c10c2930b57116a943 2x,
|
|
388
|
+
* // https://example.imgix.net/image.png?dpr=3&sat=-100&s=3a975b5087ab7ad2ab91fe66072fd628 3x
|
|
389
|
+
* ```
|
|
390
|
+
*
|
|
391
|
+
* @param url - Full absolute URL to the Imgix image.
|
|
392
|
+
* @param params - An object of Imgix URL API parameters. The `pixelDensities`
|
|
393
|
+
* parameter defines the resulting `srcset` widths.
|
|
394
|
+
*
|
|
395
|
+
* @returns A `srcset` attribute value for `url` with the given Imgix URL API
|
|
396
|
+
* parameters applied.
|
|
397
|
+
*/
|
|
398
|
+
buildSignedPixelDensitySrcSet(url: string, params: BuildPixelDensitySrcSetParams): string;
|
|
399
|
+
/**
|
|
400
|
+
* Builds an `<img>` `srcset` attribute value for a given set of pixel
|
|
401
|
+
* densities for the client's base URL. It can also optinally apply Imgix URL
|
|
402
|
+
* API parameters to the URLs.
|
|
403
|
+
*
|
|
404
|
+
* The `dpr` URL parameter will be applied for each `srcset` entry. If a `dpr`
|
|
405
|
+
* parameter is provided to the `params` parameter, it will be ignored.
|
|
406
|
+
*
|
|
407
|
+
* Note: The returned URLs are not signed. See `buildSignedPixelDensitySrcSet`
|
|
408
|
+
* if signatures are required.
|
|
409
|
+
*
|
|
410
|
+
* @example
|
|
411
|
+
*
|
|
412
|
+
* ```ts
|
|
413
|
+
* const client = new SecureClient({
|
|
414
|
+
* baseURL: "https://example.imgix.net",
|
|
415
|
+
* secureURLToken: "example-token",
|
|
416
|
+
* });
|
|
417
|
+
* const srcset = client.buildPixelDensitySrcSetForPath("/image.png", {
|
|
418
|
+
* pixelDensities: [1, 2, 3],
|
|
419
|
+
* });
|
|
420
|
+
* // => https://example.imgix.net/image.png?dpr=1 1x,
|
|
421
|
+
* // https://example.imgix.net/image.png?dpr=2 2x,
|
|
422
|
+
* // https://example.imgix.net/image.png?dpr=3 3x
|
|
423
|
+
* ```
|
|
424
|
+
*
|
|
425
|
+
* @example
|
|
426
|
+
*
|
|
427
|
+
* ```ts
|
|
428
|
+
* const client = new SecureClient({
|
|
429
|
+
* baseURL: "https://example.imgix.net",
|
|
430
|
+
* secureURLToken: "example-token",
|
|
431
|
+
* });
|
|
432
|
+
* const srcset = client.buildPixelDensitySrcSetForPath("/image.png", {
|
|
433
|
+
* pixelDensities: [1, 2, 3],
|
|
434
|
+
* sat: -100,
|
|
435
|
+
* });
|
|
436
|
+
* // => https://example.imgix.net/image.png?dpr=1&sat=-100 1x,
|
|
437
|
+
* // https://example.imgix.net/image.png?dpr=2&sat=-100 2x,
|
|
438
|
+
* // https://example.imgix.net/image.png?dpr=3&sat=-100 3x
|
|
439
|
+
* ```
|
|
440
|
+
*
|
|
441
|
+
* @param path - Path to the image relative to the client's base URL.
|
|
442
|
+
* @param params - An object of Imgix URL API parameters. The `pixelDensities`
|
|
443
|
+
* parameter defines the resulting `srcset` widths.
|
|
444
|
+
*
|
|
445
|
+
* @returns A `srcset` attribute value for `url` with the given Imgix URL API
|
|
446
|
+
* parameters applied.
|
|
447
|
+
*/
|
|
448
|
+
buildPixelDensitySrcSetForPath(path: string, params: BuildPixelDensitySrcSetParams): string;
|
|
449
|
+
/**
|
|
450
|
+
* Builds an `<img>` `srcset` attribute value for a given set of pixel
|
|
451
|
+
* densities for the client's base URL. It can also optinally apply Imgix URL
|
|
452
|
+
* API parameters to the URLs. The URLs are signed by appending a signature to
|
|
453
|
+
* their URL parameters. This locks the URLs and their parameters to the
|
|
454
|
+
* signature to prevent URL tampering.
|
|
455
|
+
*
|
|
456
|
+
* The `dpr` URL parameter will be applied for each `srcset` entry. If a `dpr`
|
|
457
|
+
* parameter is provided to the `params` parameter, it will be ignored.
|
|
458
|
+
*
|
|
459
|
+
* @example
|
|
460
|
+
*
|
|
461
|
+
* ```ts
|
|
462
|
+
* const client = new SecureClient({
|
|
463
|
+
* baseURL: "https://example.imgix.net",
|
|
464
|
+
* secureURLToken: "example-token",
|
|
465
|
+
* });
|
|
466
|
+
* const srcset = client.buildSignedPixelDensitySrcSetForPath(
|
|
467
|
+
* "/image.png",
|
|
468
|
+
* { pixelDensities: [1, 2, 3] },
|
|
469
|
+
* );
|
|
470
|
+
* // => https://example.imgix.net/image.png?dpr=1&s=def3e221c3f4c4debda091b8e49420ea 1x,
|
|
471
|
+
* // https://example.imgix.net/image.png?dpr=2&s=f12c7c39333410c10c2930b57116a943 2x,
|
|
472
|
+
* // https://example.imgix.net/image.png?dpr=3&s=3a975b5087ab7ad2ab91fe66072fd628 3x
|
|
473
|
+
* ```
|
|
474
|
+
*
|
|
475
|
+
* @example
|
|
476
|
+
*
|
|
477
|
+
* ```ts
|
|
478
|
+
* const client = new SecureClient({
|
|
479
|
+
* baseURL: "https://example.imgix.net",
|
|
480
|
+
* secureURLToken: "example-token",
|
|
481
|
+
* });
|
|
482
|
+
* const srcset = client.buildSignedPixelDensitySrcSetForPath(
|
|
483
|
+
* "/image.png",
|
|
484
|
+
* {
|
|
485
|
+
* pixelDensities: [1, 2, 3],
|
|
486
|
+
* sat: -100,
|
|
487
|
+
* },
|
|
488
|
+
* );
|
|
489
|
+
* // => https://example.imgix.net/image.png?dpr=1&sat=-100&s=def3e221c3f4c4debda091b8e49420ea 1x,
|
|
490
|
+
* // https://example.imgix.net/image.png?dpr=2&sat=-100&s=f12c7c39333410c10c2930b57116a943 2x,
|
|
491
|
+
* // https://example.imgix.net/image.png?dpr=3&sat=-100&s=3a975b5087ab7ad2ab91fe66072fd628 3x
|
|
492
|
+
* ```
|
|
493
|
+
*
|
|
494
|
+
* @param path - Path to the image relative to the client's base URL.
|
|
495
|
+
* @param params - An object of Imgix URL API parameters. The `pixelDensities`
|
|
496
|
+
* parameter defines the resulting `srcset` widths.
|
|
497
|
+
*
|
|
498
|
+
* @returns A `srcset` attribute value for `url` with the given Imgix URL API
|
|
499
|
+
* parameters applied.
|
|
500
|
+
*/
|
|
501
|
+
buildSignedPixelDensitySrcSetForPath(path: string, params: BuildPixelDensitySrcSetParams): string;
|
|
502
|
+
}
|
|
@@ -1,74 +1,13 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
};
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
const paramKey = camelCaseToParamCase(camelCasedParamKey);
|
|
12
|
-
const paramValue = params[camelCasedParamKey];
|
|
13
|
-
if (paramValue === void 0) {
|
|
14
|
-
instance.searchParams.delete(paramKey);
|
|
15
|
-
} else if (Array.isArray(paramValue)) {
|
|
16
|
-
instance.searchParams.set(paramKey, paramValue.join(","));
|
|
17
|
-
} else {
|
|
18
|
-
instance.searchParams.set(paramKey, `${paramValue}`);
|
|
19
|
-
}
|
|
20
|
-
}
|
|
21
|
-
const s = instance.searchParams.get("s");
|
|
22
|
-
if (s) {
|
|
23
|
-
instance.searchParams.delete("s");
|
|
24
|
-
instance.searchParams.append("s", s);
|
|
25
|
-
}
|
|
26
|
-
return instance.toString();
|
|
27
|
-
};
|
|
28
|
-
|
|
29
|
-
const buildPixelDensitySrcSet = (url, { pixelDensities, ...params }) => {
|
|
30
|
-
return pixelDensities.map((dpr) => {
|
|
31
|
-
return `${buildURL(url, { ...params, dpr })} ${dpr}x`;
|
|
32
|
-
}).join(", ");
|
|
33
|
-
};
|
|
34
|
-
|
|
35
|
-
const signURL = (url, secureURLToken) => {
|
|
36
|
-
const instance = new URL(url);
|
|
37
|
-
instance.searchParams.delete("s");
|
|
38
|
-
const signature = createHash("md5").update(secureURLToken + instance.pathname + instance.search).digest("hex");
|
|
39
|
-
instance.searchParams.append("s", signature);
|
|
40
|
-
return instance.toString();
|
|
41
|
-
};
|
|
42
|
-
|
|
43
|
-
const buildSignedURL = (url, secureURLToken, params) => {
|
|
44
|
-
return signURL(buildURL(url, params), secureURLToken);
|
|
45
|
-
};
|
|
46
|
-
|
|
47
|
-
const buildSignedPixelDensitySrcSet = (url, secureURLToken, { pixelDensities, ...params }) => {
|
|
48
|
-
return pixelDensities.map((dpr) => {
|
|
49
|
-
return `${buildSignedURL(url, secureURLToken, {
|
|
50
|
-
...params,
|
|
51
|
-
dpr
|
|
52
|
-
})} ${dpr}x`;
|
|
53
|
-
}).join(", ");
|
|
54
|
-
};
|
|
55
|
-
|
|
56
|
-
const buildSignedWidthSrcSet = (url, secureURLToken, { widths, ...params }) => {
|
|
57
|
-
return widths.map((width) => {
|
|
58
|
-
return `${buildSignedURL(url, secureURLToken, {
|
|
59
|
-
...params,
|
|
60
|
-
w: void 0,
|
|
61
|
-
width
|
|
62
|
-
})} ${width}w`;
|
|
63
|
-
}).join(", ");
|
|
64
|
-
};
|
|
65
|
-
|
|
66
|
-
const buildWidthSrcSet = (url, { widths, ...params }) => {
|
|
67
|
-
return widths.map((width) => {
|
|
68
|
-
return `${buildURL(url, { ...params, w: void 0, width })} ${width}w`;
|
|
69
|
-
}).join(", ");
|
|
70
|
-
};
|
|
71
|
-
|
|
1
|
+
var __defProp = Object.defineProperty;
|
|
2
|
+
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
3
|
+
var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
|
|
4
|
+
import { buildPixelDensitySrcSet } from "../buildPixelDensitySrcSet.js";
|
|
5
|
+
import { buildSignedPixelDensitySrcSet } from "./buildSignedPixelDensitySrcSet.js";
|
|
6
|
+
import { buildSignedURL } from "./buildSignedURL.js";
|
|
7
|
+
import { buildSignedWidthSrcSet } from "./buildSignedWidthSrcSet.js";
|
|
8
|
+
import { buildURL } from "../buildURL.js";
|
|
9
|
+
import { buildWidthSrcSet } from "../buildWidthSrcSet.js";
|
|
10
|
+
import { signURL } from "./signURL.js";
|
|
72
11
|
class SecureClient {
|
|
73
12
|
/**
|
|
74
13
|
* Creates a new `SecureClient` instance for an Imgix domain.
|
|
@@ -78,6 +17,15 @@ class SecureClient {
|
|
|
78
17
|
* @returns A `SecureClient` instance for the given Imgix domain.
|
|
79
18
|
*/
|
|
80
19
|
constructor(options) {
|
|
20
|
+
/**
|
|
21
|
+
* The base URL used to construct image URLs from a path. The base URL must
|
|
22
|
+
* include the protocol, domain, and optionally a path.
|
|
23
|
+
*/
|
|
24
|
+
__publicField(this, "baseURL");
|
|
25
|
+
/**
|
|
26
|
+
* The secret secure URL token for the configured Imgix domain.
|
|
27
|
+
*/
|
|
28
|
+
__publicField(this, "secureURLToken");
|
|
81
29
|
this.baseURL = options.baseURL;
|
|
82
30
|
this.secureURLToken = options.secureURLToken;
|
|
83
31
|
}
|
|
@@ -399,10 +347,7 @@ class SecureClient {
|
|
|
399
347
|
* parameters applied.
|
|
400
348
|
*/
|
|
401
349
|
buildSignedWidthSrcSetForPath(path, params) {
|
|
402
|
-
return this.buildSignedWidthSrcSet(
|
|
403
|
-
`${new URL(path, this.baseURL)}`,
|
|
404
|
-
params
|
|
405
|
-
);
|
|
350
|
+
return this.buildSignedWidthSrcSet(`${new URL(path, this.baseURL)}`, params);
|
|
406
351
|
}
|
|
407
352
|
/**
|
|
408
353
|
* Builds an `<img>` `srcset` attribute value for a given set of pixel
|
|
@@ -556,13 +501,10 @@ class SecureClient {
|
|
|
556
501
|
* parameters applied.
|
|
557
502
|
*/
|
|
558
503
|
buildSignedPixelDensitySrcSetForPath(path, params) {
|
|
559
|
-
return buildSignedPixelDensitySrcSet(
|
|
560
|
-
`${new URL(path, this.baseURL)}`,
|
|
561
|
-
this.secureURLToken,
|
|
562
|
-
params
|
|
563
|
-
);
|
|
504
|
+
return buildSignedPixelDensitySrcSet(`${new URL(path, this.baseURL)}`, this.secureURLToken, params);
|
|
564
505
|
}
|
|
565
506
|
}
|
|
566
|
-
|
|
567
|
-
|
|
568
|
-
|
|
507
|
+
export {
|
|
508
|
+
SecureClient
|
|
509
|
+
};
|
|
510
|
+
//# sourceMappingURL=SecureClient.js.map
|