microcms-js-sdk 3.3.0 → 3.5.0
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/README.md +197 -117
- package/dist/esm/microcms-js-sdk.js +1 -1
- package/dist/esm/microcms-js-sdk.js.map +1 -1
- package/dist/iife/microcms-js-sdk.js +1 -1
- package/dist/iife/microcms-js-sdk.js.map +1 -1
- package/dist/microcms-js-sdk.d.mts +13 -2
- package/dist/microcms-js-sdk.d.ts +13 -2
- package/dist/microcms-js-sdk.js +1 -1
- package/dist/microcms-js-sdk.js.map +1 -1
- package/dist/umd/microcms-js-sdk.js +1 -1
- package/dist/umd/microcms-js-sdk.js.map +1 -1
- package/package.json +4 -1
package/README.md
CHANGED
|
@@ -1,60 +1,66 @@
|
|
|
1
1
|
# microCMS JavaScript SDK
|
|
2
2
|
|
|
3
|
-
[
|
|
3
|
+
[English README](README_en.md)
|
|
4
4
|
|
|
5
|
-
|
|
5
|
+
JavaScriptやNode.jsのアプリケーションからmicroCMSのAPIと簡単に通信できます。
|
|
6
6
|
|
|
7
7
|
<a href="https://discord.com/invite/K3DPqw4EJ2" target="_blank"><img src="https://img.shields.io/badge/Discord-%235865F2.svg?style=for-the-badge&logo=discord&logoColor=white" alt="Discord"></a>
|
|
8
8
|
|
|
9
|
-
##
|
|
9
|
+
## 保守方針
|
|
10
10
|
|
|
11
|
-
|
|
11
|
+
このSDKの現在の保守レベルは`Active`です。
|
|
12
12
|
|
|
13
|
-
|
|
13
|
+
詳細は[SDKの保守方針](https://document.microcms.io/manual/limitations#h8e929adf81)をご覧ください。
|
|
14
14
|
|
|
15
|
-
|
|
15
|
+
## チュートリアル
|
|
16
|
+
|
|
17
|
+
公式ドキュメントの [チュートリアル](https://document.microcms.io/tutorial/javascript/javascript-top)をご覧ください。
|
|
18
|
+
|
|
19
|
+
## はじめに
|
|
20
|
+
|
|
21
|
+
### インストール
|
|
16
22
|
|
|
17
23
|
#### Node.js
|
|
18
24
|
|
|
19
25
|
```bash
|
|
20
26
|
$ npm install microcms-js-sdk
|
|
21
27
|
|
|
22
|
-
|
|
28
|
+
または
|
|
23
29
|
|
|
24
30
|
$ yarn add microcms-js-sdk
|
|
25
31
|
```
|
|
26
32
|
|
|
27
33
|
> [!IMPORTANT]
|
|
28
|
-
> v3.0.0
|
|
34
|
+
> v3.0.0以上を使用する場合は、Node.jsのv18以上が必要です。
|
|
29
35
|
|
|
30
|
-
####
|
|
36
|
+
#### ブラウザ(セルフホスティング)
|
|
31
37
|
|
|
32
|
-
|
|
38
|
+
[リリースページ](https://github.com/microcmsio/microcms-js-sdk/releases)から`microcms-js-sdk-x.y.z.tgz`をダウンロードして解凍してください。その後、お好みのサーバーにアップロードして使用してください。対象ファイルは `./dist/umd/microcms-js-sdk.js` です。
|
|
33
39
|
|
|
34
40
|
```html
|
|
35
41
|
<script src="./microcms-js-sdk.js"></script>
|
|
36
42
|
```
|
|
37
43
|
|
|
38
|
-
####
|
|
44
|
+
#### ブラウザ(CDN)
|
|
39
45
|
|
|
40
|
-
|
|
46
|
+
外部プロバイダーが提供するURLを読み込んでご利用ください。
|
|
41
47
|
|
|
42
48
|
```html
|
|
43
49
|
<script src="https://cdn.jsdelivr.net/npm/microcms-js-sdk@3.1.1/dist/umd/microcms-js-sdk.min.js"></script>
|
|
44
50
|
```
|
|
45
51
|
|
|
46
|
-
|
|
52
|
+
または
|
|
47
53
|
|
|
48
54
|
```html
|
|
49
55
|
<script src="https://cdn.jsdelivr.net/npm/microcms-js-sdk/dist/umd/microcms-js-sdk.min.js"></script>
|
|
50
56
|
```
|
|
51
57
|
|
|
52
58
|
> [!WARNING]
|
|
53
|
-
>
|
|
59
|
+
> ホスティングサービス(cdn.jsdelivr.net)はmicroCMSとは関係ありません。本番環境でのご利用には、お客様のサーバーでのセルフホスティングをお勧めします。
|
|
54
60
|
|
|
55
|
-
##
|
|
61
|
+
## コンテンツAPI
|
|
56
62
|
|
|
57
|
-
###
|
|
63
|
+
### インポート
|
|
58
64
|
|
|
59
65
|
#### Node.js
|
|
60
66
|
|
|
@@ -62,13 +68,13 @@ or
|
|
|
62
68
|
const { createClient } = require('microcms-js-sdk'); // CommonJS
|
|
63
69
|
```
|
|
64
70
|
|
|
65
|
-
|
|
71
|
+
または
|
|
66
72
|
|
|
67
73
|
```javascript
|
|
68
74
|
import { createClient } from 'microcms-js-sdk'; //ES6
|
|
69
75
|
```
|
|
70
76
|
|
|
71
|
-
####
|
|
77
|
+
#### ブラウザ
|
|
72
78
|
|
|
73
79
|
```html
|
|
74
80
|
<script>
|
|
@@ -76,22 +82,22 @@ import { createClient } from 'microcms-js-sdk'; //ES6
|
|
|
76
82
|
</script>
|
|
77
83
|
```
|
|
78
84
|
|
|
79
|
-
###
|
|
85
|
+
### クライアントオブジェクトの作成
|
|
80
86
|
|
|
81
87
|
```javascript
|
|
82
|
-
//
|
|
88
|
+
// クライアントオブジェクトを作成します。
|
|
83
89
|
const client = createClient({
|
|
84
|
-
serviceDomain: 'YOUR_DOMAIN', // YOUR_DOMAIN
|
|
90
|
+
serviceDomain: 'YOUR_DOMAIN', // YOUR_DOMAINはXXXX.microcms.ioのXXXXの部分です。
|
|
85
91
|
apiKey: 'YOUR_API_KEY',
|
|
86
|
-
// retry: true //
|
|
92
|
+
// retry: true // 最大2回まで再試行します。
|
|
87
93
|
});
|
|
88
94
|
```
|
|
89
95
|
|
|
90
|
-
### API
|
|
96
|
+
### APIメソッド
|
|
91
97
|
|
|
92
|
-
|
|
98
|
+
以下の表は、microCMS JavaScript SDKの各メソッドがリスト形式のAPIまたはオブジェクト形式のAPI、どちらで使用できるかを示しています。
|
|
93
99
|
|
|
94
|
-
|
|
|
100
|
+
| メソッド | リスト形式 | オブジェクト形式 |
|
|
95
101
|
|-------------------|-------------|---------------|
|
|
96
102
|
| getList | ✔️ | |
|
|
97
103
|
| getListDetail | ✔️ | |
|
|
@@ -103,12 +109,12 @@ The table below shows each API method of microCMS JavaScript SDK and indicates w
|
|
|
103
109
|
| delete | ✔️ | |
|
|
104
110
|
|
|
105
111
|
> [!NOTE]
|
|
106
|
-
> -
|
|
107
|
-
> -
|
|
112
|
+
> - 「リスト形式」の✔️は、APIの型がリスト形式に設定されている場合に使用できるメソッドを示します。
|
|
113
|
+
> - 「オブジェクト形式」の✔️は、APIの型がオブジェクト形式に設定されている場合に使用できるメソッドを示します。
|
|
108
114
|
|
|
109
|
-
###
|
|
115
|
+
### コンテンツ一覧の取得
|
|
110
116
|
|
|
111
|
-
|
|
117
|
+
`getList`メソッドは、指定されたエンドポイントからコンテンツ一覧を取得するために使用します。
|
|
112
118
|
|
|
113
119
|
```javascript
|
|
114
120
|
client
|
|
@@ -119,9 +125,9 @@ client
|
|
|
119
125
|
.catch((err) => console.error(err));
|
|
120
126
|
```
|
|
121
127
|
|
|
122
|
-
####
|
|
128
|
+
#### queriesプロパティを使用したコンテンツ一覧の取得
|
|
123
129
|
|
|
124
|
-
|
|
130
|
+
`queries`プロパティを使用して、特定の条件に一致するコンテンツ一覧を取得できます。利用可能な各プロパティの詳細については、[microCMSのドキュメント](https://document.microcms.io/content-api/get-list-contents#h929d25d495)を参照してください。
|
|
125
131
|
|
|
126
132
|
```javascript
|
|
127
133
|
client
|
|
@@ -132,7 +138,7 @@ client
|
|
|
132
138
|
limit: 100,
|
|
133
139
|
offset: 1,
|
|
134
140
|
orders: 'createdAt',
|
|
135
|
-
q: '
|
|
141
|
+
q: 'こんにちは',
|
|
136
142
|
fields: 'id,title',
|
|
137
143
|
ids: 'foo',
|
|
138
144
|
filters: 'publishedAt[greater_than]2021-01-01T03:00:00.000Z',
|
|
@@ -143,9 +149,9 @@ client
|
|
|
143
149
|
.catch((err) => console.error(err));
|
|
144
150
|
```
|
|
145
151
|
|
|
146
|
-
###
|
|
152
|
+
### 単一コンテンツの取得
|
|
147
153
|
|
|
148
|
-
|
|
154
|
+
`getListDetail`メソッドは、指定されたエンドポイントから、IDで指定された単一コンテンツを取得するために使用します。
|
|
149
155
|
|
|
150
156
|
```javascript
|
|
151
157
|
client
|
|
@@ -157,9 +163,9 @@ client
|
|
|
157
163
|
.catch((err) => console.error(err));
|
|
158
164
|
```
|
|
159
165
|
|
|
160
|
-
####
|
|
166
|
+
#### queriesプロパティを使用した単一コンテンツの取得
|
|
161
167
|
|
|
162
|
-
|
|
168
|
+
`queries`プロパティを使用して、特定の条件に一致する単一コンテンツを取得できます。利用可能な各プロパティの詳細については、[microCMSのドキュメント](https://document.microcms.io/content-api/get-content#h929d25d495)を参照してください。
|
|
163
169
|
|
|
164
170
|
```javascript
|
|
165
171
|
client
|
|
@@ -177,9 +183,9 @@ client
|
|
|
177
183
|
|
|
178
184
|
```
|
|
179
185
|
|
|
180
|
-
###
|
|
186
|
+
### オブジェクト形式のコンテンツの取得
|
|
181
187
|
|
|
182
|
-
|
|
188
|
+
`getObject`メソッドは、指定されたエンドポイントからオブジェクト形式のコンテンツを取得するために使用します。
|
|
183
189
|
|
|
184
190
|
```javascript
|
|
185
191
|
client
|
|
@@ -190,9 +196,9 @@ client
|
|
|
190
196
|
.catch((err) => console.error(err));
|
|
191
197
|
```
|
|
192
198
|
|
|
193
|
-
###
|
|
199
|
+
### コンテンツIDの全件取得
|
|
194
200
|
|
|
195
|
-
|
|
201
|
+
`getAllContentIds`メソッドは、指定されたエンドポイントからコンテンツIDのみを全件取得するために使用します。
|
|
196
202
|
|
|
197
203
|
```javascript
|
|
198
204
|
client
|
|
@@ -203,9 +209,9 @@ client
|
|
|
203
209
|
.catch((err) => console.error(err));
|
|
204
210
|
```
|
|
205
211
|
|
|
206
|
-
####
|
|
212
|
+
#### filtersプロパティを使用したコンテンツIDの全件取得
|
|
207
213
|
|
|
208
|
-
|
|
214
|
+
`filters`プロパティを使用することで、条件に一致するコンテンツIDを全件取得できます。
|
|
209
215
|
|
|
210
216
|
```javascript
|
|
211
217
|
client
|
|
@@ -217,9 +223,9 @@ client
|
|
|
217
223
|
.catch((err) => console.error(err));
|
|
218
224
|
```
|
|
219
225
|
|
|
220
|
-
####
|
|
226
|
+
#### 下書き中のコンテンツのIDを全件取得
|
|
221
227
|
|
|
222
|
-
|
|
228
|
+
`draftKey`プロパティを使用することで、下書き中のコンテンツのIDを全件取得できます。
|
|
223
229
|
|
|
224
230
|
```javascript
|
|
225
231
|
client
|
|
@@ -231,9 +237,9 @@ client
|
|
|
231
237
|
.catch((err) => console.error(err));
|
|
232
238
|
```
|
|
233
239
|
|
|
234
|
-
####
|
|
240
|
+
#### コンテンツID以外のフィールドの値を全件取得
|
|
235
241
|
|
|
236
|
-
|
|
242
|
+
`alternateField`プロパティにフィールドIDを指定することで、コンテンツID以外のフィールドの値を全件取得できます。
|
|
237
243
|
|
|
238
244
|
```javascript
|
|
239
245
|
client
|
|
@@ -245,9 +251,9 @@ client
|
|
|
245
251
|
.catch((err) => console.error(err));
|
|
246
252
|
```
|
|
247
253
|
|
|
248
|
-
###
|
|
254
|
+
### コンテンツの全件取得
|
|
249
255
|
|
|
250
|
-
|
|
256
|
+
`getAllContents`メソッドは、指定されたエンドポイントから、コンテンツを全件取得するために使用します。
|
|
251
257
|
|
|
252
258
|
```javascript
|
|
253
259
|
client
|
|
@@ -258,9 +264,9 @@ client
|
|
|
258
264
|
.catch((err) => console.error(err));
|
|
259
265
|
```
|
|
260
266
|
|
|
261
|
-
####
|
|
267
|
+
#### queriesプロパティを使用したコンテンツの全件取得
|
|
262
268
|
|
|
263
|
-
|
|
269
|
+
`queries`プロパティを使用して、特定の条件に一致するすべてのコンテンツを取得できます。利用可能な各プロパティの詳細については、[microCMSのドキュメント](https://document.microcms.io/content-api/get-list-contents#h929d25d495)を参照してください。
|
|
264
270
|
|
|
265
271
|
```javascript
|
|
266
272
|
client
|
|
@@ -272,26 +278,26 @@ client
|
|
|
272
278
|
.catch((err) => console.error(err));
|
|
273
279
|
```
|
|
274
280
|
|
|
275
|
-
###
|
|
281
|
+
### コンテンツの登録
|
|
276
282
|
|
|
277
|
-
|
|
283
|
+
`create`メソッドは指定されたエンドポイントにコンテンツを登録するために使用します。
|
|
278
284
|
|
|
279
285
|
```javascript
|
|
280
286
|
client
|
|
281
287
|
.create({
|
|
282
288
|
endpoint: 'endpoint',
|
|
283
289
|
content: {
|
|
284
|
-
title: '
|
|
285
|
-
body: '
|
|
290
|
+
title: 'タイトル',
|
|
291
|
+
body: '本文',
|
|
286
292
|
},
|
|
287
293
|
})
|
|
288
294
|
.then((res) => console.log(res.id))
|
|
289
295
|
.catch((err) => console.error(err));
|
|
290
296
|
```
|
|
291
297
|
|
|
292
|
-
####
|
|
298
|
+
#### IDを指定してコンテンツを登録
|
|
293
299
|
|
|
294
|
-
|
|
300
|
+
`contentId`プロパティを使用することで、指定されたIDでコンテンツを登録できます。
|
|
295
301
|
|
|
296
302
|
```javascript
|
|
297
303
|
client
|
|
@@ -299,25 +305,25 @@ client
|
|
|
299
305
|
endpoint: 'endpoint',
|
|
300
306
|
contentId: 'contentId',
|
|
301
307
|
content: {
|
|
302
|
-
title: '
|
|
303
|
-
body: '
|
|
308
|
+
title: 'タイトル',
|
|
309
|
+
body: '本文',
|
|
304
310
|
},
|
|
305
311
|
})
|
|
306
312
|
.then((res) => console.log(res.id))
|
|
307
313
|
.catch((err) => console.error(err));
|
|
308
314
|
```
|
|
309
315
|
|
|
310
|
-
####
|
|
316
|
+
#### 下書き中のステータスでコンテンツを登録
|
|
311
317
|
|
|
312
|
-
|
|
318
|
+
`isDraft`プロパティを使用することで、下書き中のステータスでコンテンツを登録できます。
|
|
313
319
|
|
|
314
320
|
```javascript
|
|
315
321
|
client
|
|
316
322
|
.create({
|
|
317
323
|
endpoint: 'endpoint',
|
|
318
324
|
content: {
|
|
319
|
-
title: '
|
|
320
|
-
body: '
|
|
325
|
+
title: 'タイトル',
|
|
326
|
+
body: '本文',
|
|
321
327
|
},
|
|
322
328
|
isDraft: true,
|
|
323
329
|
})
|
|
@@ -325,9 +331,9 @@ client
|
|
|
325
331
|
.catch((err) => console.error(err));
|
|
326
332
|
```
|
|
327
333
|
|
|
328
|
-
####
|
|
334
|
+
#### 指定されたIDかつ下書き中のステータスでコンテンツを登録
|
|
329
335
|
|
|
330
|
-
|
|
336
|
+
`contentId`プロパティと`isDraft`プロパティを使用することで、指定されたIDかつ下書き中のステータスでコンテンツを登録できます。
|
|
331
337
|
|
|
332
338
|
```javascript
|
|
333
339
|
client
|
|
@@ -335,8 +341,8 @@ client
|
|
|
335
341
|
endpoint: 'endpoint',
|
|
336
342
|
contentId: 'contentId',
|
|
337
343
|
content: {
|
|
338
|
-
title: '
|
|
339
|
-
body: '
|
|
344
|
+
title: 'タイトル',
|
|
345
|
+
body: '本文',
|
|
340
346
|
},
|
|
341
347
|
isDraft: true,
|
|
342
348
|
})
|
|
@@ -344,9 +350,48 @@ client
|
|
|
344
350
|
.catch((err) => console.error(err));
|
|
345
351
|
```
|
|
346
352
|
|
|
347
|
-
|
|
353
|
+
#### 公開終了のステータスでコンテンツを登録
|
|
354
|
+
|
|
355
|
+
`isClosed`プロパティを使用することで、公開終了のステータスでコンテンツを登録できます。
|
|
356
|
+
|
|
357
|
+
> **注:** `isDraft` と `isClosed` は同時に `true` にできません。両方を `true` で渡すと、SDK はランタイムでエラーとして拒否します。`isClosed: true` を使う場合は、`isDraft` を省略、または `false` を設定してください。
|
|
358
|
+
|
|
359
|
+
```javascript
|
|
360
|
+
client
|
|
361
|
+
.create({
|
|
362
|
+
endpoint: 'endpoint',
|
|
363
|
+
content: {
|
|
364
|
+
title: 'タイトル',
|
|
365
|
+
body: '本文',
|
|
366
|
+
},
|
|
367
|
+
isClosed: true,
|
|
368
|
+
})
|
|
369
|
+
.then((res) => console.log(res.id))
|
|
370
|
+
.catch((err) => console.error(err));
|
|
371
|
+
```
|
|
372
|
+
|
|
373
|
+
#### 指定されたIDかつ公開終了のステータスでコンテンツを登録
|
|
348
374
|
|
|
349
|
-
|
|
375
|
+
`contentId`プロパティと`isClosed`プロパティを使用することで、指定されたIDかつ公開終了のステータスでコンテンツを登録できます。上記と同様、`isDraft` と `isClosed` を同時に `true` にすることはできません。
|
|
376
|
+
|
|
377
|
+
```javascript
|
|
378
|
+
client
|
|
379
|
+
.create({
|
|
380
|
+
endpoint: 'endpoint',
|
|
381
|
+
contentId: 'contentId',
|
|
382
|
+
content: {
|
|
383
|
+
title: 'タイトル',
|
|
384
|
+
body: '本文',
|
|
385
|
+
},
|
|
386
|
+
isClosed: true,
|
|
387
|
+
})
|
|
388
|
+
.then((res) => console.log(res.id))
|
|
389
|
+
.catch((err) => console.error(err));
|
|
390
|
+
```
|
|
391
|
+
|
|
392
|
+
### コンテンツの編集
|
|
393
|
+
|
|
394
|
+
`update`メソッドは特定のコンテンツを編集するために使用します。
|
|
350
395
|
|
|
351
396
|
```javascript
|
|
352
397
|
client
|
|
@@ -354,16 +399,16 @@ client
|
|
|
354
399
|
endpoint: 'endpoint',
|
|
355
400
|
contentId: 'contentId',
|
|
356
401
|
content: {
|
|
357
|
-
title: '
|
|
402
|
+
title: 'タイトル',
|
|
358
403
|
},
|
|
359
404
|
})
|
|
360
405
|
.then((res) => console.log(res.id))
|
|
361
406
|
.catch((err) => console.error(err));
|
|
362
407
|
```
|
|
363
408
|
|
|
364
|
-
####
|
|
409
|
+
#### コンテンツの下書き更新
|
|
365
410
|
|
|
366
|
-
|
|
411
|
+
`isDraft` プロパティを指定することで、コンテンツを下書き状態で更新することができます。
|
|
367
412
|
|
|
368
413
|
```javascript
|
|
369
414
|
client
|
|
@@ -371,7 +416,7 @@ client
|
|
|
371
416
|
endpoint: 'endpoint',
|
|
372
417
|
contentId: 'contentId',
|
|
373
418
|
content: {
|
|
374
|
-
title: '
|
|
419
|
+
title: 'タイトル',
|
|
375
420
|
},
|
|
376
421
|
isDraft: true,
|
|
377
422
|
})
|
|
@@ -379,25 +424,25 @@ client
|
|
|
379
424
|
.catch((err) => console.error(err));
|
|
380
425
|
```
|
|
381
426
|
|
|
382
|
-
####
|
|
427
|
+
#### オブジェクト形式のコンテンツの編集
|
|
383
428
|
|
|
384
|
-
|
|
429
|
+
APIの型がオブジェクト形式のコンテンツを編集する場合は、`contentId`プロパティを使用せずに、エンドポイントのみを指定します。
|
|
385
430
|
|
|
386
431
|
```javascript
|
|
387
432
|
client
|
|
388
433
|
.update({
|
|
389
434
|
endpoint: 'endpoint',
|
|
390
435
|
content: {
|
|
391
|
-
title: '
|
|
436
|
+
title: 'タイトル',
|
|
392
437
|
},
|
|
393
438
|
})
|
|
394
439
|
.then((res) => console.log(res.id))
|
|
395
440
|
.catch((err) => console.error(err));
|
|
396
441
|
```
|
|
397
442
|
|
|
398
|
-
###
|
|
443
|
+
### コンテンツの削除
|
|
399
444
|
|
|
400
|
-
|
|
445
|
+
`delete`メソッドは指定されたエンドポイントから特定のコンテンツを削除するために使用します。
|
|
401
446
|
|
|
402
447
|
```javascript
|
|
403
448
|
client
|
|
@@ -410,9 +455,9 @@ client
|
|
|
410
455
|
|
|
411
456
|
### TypeScript
|
|
412
457
|
|
|
413
|
-
|
|
458
|
+
`getList`メソッド、`getListDetail`メソッド、`getObject`メソッドはデフォルトのレスポンスの型を定義しています。
|
|
414
459
|
|
|
415
|
-
####
|
|
460
|
+
#### getListメソッドのレスポンスの型
|
|
416
461
|
|
|
417
462
|
```typescript
|
|
418
463
|
type Content = {
|
|
@@ -420,16 +465,16 @@ type Content = {
|
|
|
420
465
|
};
|
|
421
466
|
/**
|
|
422
467
|
* {
|
|
423
|
-
* contents: Content[]; //
|
|
468
|
+
* contents: Content[]; // 設定したスキーマの型を格納する配列
|
|
424
469
|
* totalCount: number;
|
|
425
470
|
* limit: number;
|
|
426
471
|
* offset: number;
|
|
427
472
|
* }
|
|
428
473
|
*/
|
|
429
|
-
client.getList<Content>({ /*
|
|
474
|
+
client.getList<Content>({ /* その他のプロパティ */ })
|
|
430
475
|
```
|
|
431
476
|
|
|
432
|
-
####
|
|
477
|
+
#### getListDetailメソッドのレスポンスの型
|
|
433
478
|
|
|
434
479
|
```typescript
|
|
435
480
|
type Content = {
|
|
@@ -442,13 +487,13 @@ type Content = {
|
|
|
442
487
|
* updatedAt: string;
|
|
443
488
|
* publishedAt?: string;
|
|
444
489
|
* revisedAt?: string;
|
|
445
|
-
* text: string; //
|
|
490
|
+
* text: string; // 設定したスキーマの型
|
|
446
491
|
* }
|
|
447
492
|
*/
|
|
448
|
-
client.getListDetail<Content>({ /*
|
|
493
|
+
client.getListDetail<Content>({ /* その他のプロパティ */ })
|
|
449
494
|
```
|
|
450
495
|
|
|
451
|
-
####
|
|
496
|
+
#### getObjectメソッドのレスポンスの型
|
|
452
497
|
|
|
453
498
|
```typescript
|
|
454
499
|
type Content = {
|
|
@@ -460,25 +505,24 @@ type Content = {
|
|
|
460
505
|
* updatedAt: string;
|
|
461
506
|
* publishedAt?: string;
|
|
462
507
|
* revisedAt?: string;
|
|
463
|
-
* text: string; //
|
|
508
|
+
* text: string; // 設定したスキーマの型
|
|
464
509
|
* }
|
|
465
510
|
*/
|
|
466
|
-
|
|
467
|
-
client.getObject<Content>({ /* other */ })
|
|
511
|
+
client.getObject<Content>({ /* その他のプロパティ */ })
|
|
468
512
|
```
|
|
469
513
|
|
|
470
|
-
####
|
|
514
|
+
#### getAllContentIdsメソッドのレスポンスの型
|
|
471
515
|
|
|
472
516
|
```typescript
|
|
473
517
|
/**
|
|
474
|
-
* string[]
|
|
518
|
+
* string[]
|
|
475
519
|
*/
|
|
476
|
-
client.getAllContentIds({ /*
|
|
520
|
+
client.getAllContentIds({ /* その他のプロパティ */ })
|
|
477
521
|
```
|
|
478
522
|
|
|
479
|
-
####
|
|
523
|
+
#### 型安全なコンテンツの登録
|
|
480
524
|
|
|
481
|
-
|
|
525
|
+
`content`の型は`Content`であるため、型安全なコンテンツの登録が可能です。
|
|
482
526
|
|
|
483
527
|
```typescript
|
|
484
528
|
type Content = {
|
|
@@ -489,15 +533,15 @@ type Content = {
|
|
|
489
533
|
client.create<Content>({
|
|
490
534
|
endpoint: 'endpoint',
|
|
491
535
|
content: {
|
|
492
|
-
title: '
|
|
493
|
-
body: '
|
|
536
|
+
title: 'タイトル',
|
|
537
|
+
body: '本文',
|
|
494
538
|
},
|
|
495
539
|
});
|
|
496
540
|
```
|
|
497
541
|
|
|
498
|
-
####
|
|
542
|
+
#### 型安全なコンテンツの編集
|
|
499
543
|
|
|
500
|
-
|
|
544
|
+
`content`は`Partial<Content>`型であるため、編集したいプロパティだけを渡せます。
|
|
501
545
|
|
|
502
546
|
```typescript
|
|
503
547
|
type Content = {
|
|
@@ -508,7 +552,7 @@ type Content = {
|
|
|
508
552
|
client.update<Content>({
|
|
509
553
|
endpoint: 'endpoint',
|
|
510
554
|
content: {
|
|
511
|
-
body: '
|
|
555
|
+
body: '本文',
|
|
512
556
|
},
|
|
513
557
|
});
|
|
514
558
|
```
|
|
@@ -517,8 +561,9 @@ client.update<Content>({
|
|
|
517
561
|
|
|
518
562
|
#### Next.js App Router
|
|
519
563
|
|
|
520
|
-
|
|
521
|
-
|
|
564
|
+
Next.jsのApp Routerで利用されるfetchのcacheオプションを指定できます。
|
|
565
|
+
|
|
566
|
+
指定可能なオプションは、Next.jsの公式ドキュメントを参照してください。
|
|
522
567
|
|
|
523
568
|
[Functions: fetch \| Next\.js](https://nextjs.org/docs/app/api-reference/functions/fetch)
|
|
524
569
|
|
|
@@ -533,9 +578,9 @@ const response = await client.getList({
|
|
|
533
578
|
});
|
|
534
579
|
```
|
|
535
580
|
|
|
536
|
-
#### AbortController: abort
|
|
581
|
+
#### AbortController: abortメソッド
|
|
537
582
|
|
|
538
|
-
|
|
583
|
+
fetchリクエストを中断できます。
|
|
539
584
|
|
|
540
585
|
```ts
|
|
541
586
|
const controller = new AbortController();
|
|
@@ -551,9 +596,9 @@ setTimeout(() => {
|
|
|
551
596
|
}, 1000);
|
|
552
597
|
```
|
|
553
598
|
|
|
554
|
-
##
|
|
599
|
+
## マネジメントAPI
|
|
555
600
|
|
|
556
|
-
###
|
|
601
|
+
### インポート
|
|
557
602
|
|
|
558
603
|
#### Node.js
|
|
559
604
|
|
|
@@ -561,13 +606,13 @@ setTimeout(() => {
|
|
|
561
606
|
const { createManagementClient } = require('microcms-js-sdk'); // CommonJS
|
|
562
607
|
```
|
|
563
608
|
|
|
564
|
-
|
|
609
|
+
または
|
|
565
610
|
|
|
566
611
|
```javascript
|
|
567
612
|
import { createManagementClient } from 'microcms-js-sdk'; //ES6
|
|
568
613
|
```
|
|
569
614
|
|
|
570
|
-
####
|
|
615
|
+
#### ブラウザ
|
|
571
616
|
|
|
572
617
|
```html
|
|
573
618
|
<script>
|
|
@@ -575,18 +620,18 @@ import { createManagementClient } from 'microcms-js-sdk'; //ES6
|
|
|
575
620
|
</script>
|
|
576
621
|
```
|
|
577
622
|
|
|
578
|
-
###
|
|
623
|
+
### クライアントオブジェクトの作成
|
|
579
624
|
|
|
580
625
|
```javascript
|
|
581
626
|
const client = createManagementClient({
|
|
582
|
-
serviceDomain: 'YOUR_DOMAIN', // YOUR_DOMAIN
|
|
627
|
+
serviceDomain: 'YOUR_DOMAIN', // YOUR_DOMAINはXXXX.microcms.ioのXXXXの部分です。
|
|
583
628
|
apiKey: 'YOUR_API_KEY',
|
|
584
629
|
});
|
|
585
630
|
```
|
|
586
631
|
|
|
587
|
-
###
|
|
632
|
+
### メディアのアップロード
|
|
588
633
|
|
|
589
|
-
|
|
634
|
+
メディアに画像やファイルをアップロードできます。
|
|
590
635
|
|
|
591
636
|
#### Node.js
|
|
592
637
|
|
|
@@ -621,13 +666,13 @@ client
|
|
|
621
666
|
client
|
|
622
667
|
.uploadMedia({
|
|
623
668
|
data: 'https://example.com/image.png',
|
|
624
|
-
// name: 'image.png', ←
|
|
669
|
+
// name: 'image.png', ← 任意
|
|
625
670
|
})
|
|
626
671
|
.then((res) => console.log(res))
|
|
627
672
|
.catch((err) => console.error(err));
|
|
628
673
|
```
|
|
629
674
|
|
|
630
|
-
####
|
|
675
|
+
#### ブラウザ
|
|
631
676
|
|
|
632
677
|
```javascript
|
|
633
678
|
// File
|
|
@@ -643,7 +688,7 @@ client
|
|
|
643
688
|
client
|
|
644
689
|
.uploadMedia({
|
|
645
690
|
data: 'https://example.com/image.png',
|
|
646
|
-
// name: 'image.png', ←
|
|
691
|
+
// name: 'image.png', ← 任意
|
|
647
692
|
})
|
|
648
693
|
.then((res) => console.log(res))
|
|
649
694
|
.catch((err) => console.error(err));
|
|
@@ -651,7 +696,7 @@ client
|
|
|
651
696
|
|
|
652
697
|
### TypeScript
|
|
653
698
|
|
|
654
|
-
####
|
|
699
|
+
#### uploadMediaメソッドのパラメータの型
|
|
655
700
|
|
|
656
701
|
```typescript
|
|
657
702
|
type UploadMediaRequest =
|
|
@@ -666,9 +711,44 @@ type UploadMediaRequest =
|
|
|
666
711
|
function uploadMedia(params: UploadMediaRequest): Promise<{ url: string }>;
|
|
667
712
|
```
|
|
668
713
|
|
|
669
|
-
##
|
|
714
|
+
## エラーハンドリング
|
|
715
|
+
|
|
716
|
+
microCMS APIへのリクエストに失敗した場合は、`isMicroCMSRequestError`を使用して、HTTPステータスコード、リクエスト先URL、元のネットワークエラーを参照できます。
|
|
717
|
+
|
|
718
|
+
```typescript
|
|
719
|
+
import { createClient, isMicroCMSRequestError } from 'microcms-js-sdk';
|
|
720
|
+
|
|
721
|
+
const client = createClient({
|
|
722
|
+
serviceDomain: 'serviceDomain',
|
|
723
|
+
apiKey: 'apiKey',
|
|
724
|
+
});
|
|
725
|
+
|
|
726
|
+
try {
|
|
727
|
+
await client.getList({ endpoint: 'blog' });
|
|
728
|
+
} catch (error) {
|
|
729
|
+
if (isMicroCMSRequestError(error)) {
|
|
730
|
+
console.log(error.status);
|
|
731
|
+
console.log(error.url);
|
|
732
|
+
console.log(error.originalError);
|
|
733
|
+
}
|
|
734
|
+
}
|
|
735
|
+
```
|
|
736
|
+
|
|
737
|
+
| プロパティ | HTTPエラー | ネットワークエラー |
|
|
738
|
+
| --------------- | ----------------------------- | --------------------------- |
|
|
739
|
+
| `status` | HTTPステータスコード | `undefined` |
|
|
740
|
+
| `url` | リクエスト先URL | リクエスト先URL |
|
|
741
|
+
| `originalError` | `undefined` | `fetch`が投げた元の値 |
|
|
742
|
+
|
|
743
|
+
`url`に`draftKey`が含まれる場合、その値は`***`にマスクされます。リクエストヘッダー、リクエストボディ、`Response`オブジェクトはエラーへ追加されません。
|
|
744
|
+
|
|
745
|
+
`originalError`の内容はNode.js、ブラウザ、Edge Runtimeなどの実行環境によって異なり、SDKとして形式を保証しません。
|
|
746
|
+
|
|
747
|
+
追加されるプロパティは非列挙です。そのため、既存の`message`、`toString()`、`Object.keys()`、`JSON.stringify()`の結果には影響しません。
|
|
748
|
+
|
|
749
|
+
## ヒント
|
|
670
750
|
|
|
671
|
-
###
|
|
751
|
+
### 読み取り用と書き込み用で別々のAPIキーを使用する
|
|
672
752
|
|
|
673
753
|
```javascript
|
|
674
754
|
const readClient = createClient({
|
|
@@ -681,6 +761,6 @@ const writeClient = createClient({
|
|
|
681
761
|
});
|
|
682
762
|
```
|
|
683
763
|
|
|
684
|
-
##
|
|
764
|
+
## ライセンス
|
|
685
765
|
|
|
686
766
|
Apache-2.0
|