どうも。みずかず(@mizukazu_1)です。
WordPressのAPIを使用する時に取得したデータの総ページ数を取得したい時があります。
総ページ数はレスポンスのヘッダーの中にあるのでそちらの取得方法を説明していきます。
総ページ数はレスポンスのヘッダーにアクセスすることで取得できる
axiosを使ってAPIにアクセスした例を記載します。
axios.get('URL').then(res => {
データを取得した時の処理
});
データが無事に取得出来ればresを通してアクセスできるかと思います。
resの中身は以下です。
{data: Array(10), status: 200, statusText: "OK", headers: {…}, config: {…}, …}
config: {url: "リクエストを送ったURLが入っています(人によって違う)",
method: "get", headers: {…}, params: {…}, transformRequest: Array(1), …}
data: (10) [{…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}]
headers: {access-control-allow-headers: "Authorization, X-WP-Nonce, Content-Disposition, Content-MD5, Content-Type", access-control-expose-headers: "X-WP-Total, X-WP-TotalPages, Link", allow: "GET", connection: "Keep-Alive", content-length: "2593", …}
request: XMLHttpRequest {readyState: 4, timeout: 0, withCredentials: false, upload: XMLHttpRequestUpload, onreadystatechange: ƒ, …}
status: 200
statusText: "OK"
__proto__: Object
res.data
res.dataで取得したデータにアクセスできます。
今回は総ページ数を取得したいので、冒頭でも言ったheadersに注目です。
X-WP-TotalPagesというものがあると思います。
res.headers['x-wp-totalpages']
上記のようにres.headers[‘x-wp-totalpages’]でアクセスする事で総ページ数を取得する事が出来ます。
まとめ
総ページ数はデータの中ではなくヘッダーの中にあるのでそちらにアクセスする事で取得できます。
てっきりデータの中にあると思ったので最初は少し戸惑いました。
今後どんなAPIを触る時もデータだけに注目するのではなく他の部分にもしっかり目を通そうと思います。
スポンサーリンク