問題

Nuxt.jsからDjango REST Framework（以下DRF）のAPIを叩いて特定の情報を表示させようとした時にDjango側のログにNot Foundが出ました。

まずはDjango側の不具合かと思い、一旦DRFのコンソールで確認しましたが、データは存在し、かつ閲覧できる状態です。
単純な問題ですが、うっかりミスをしていたので念のため記事として残しておきます。

解決法

以上の前提条件からNot Foundが起こっている場合、十中八九エントリーポイントの設定を間違えています。

そもそもの前提の話ですが、Djangoのルーティングではurls.pyに記述されているもの以外のurlが打ち込まれた場合は404のエラーハンドリングをしていない場合は無条件でNot Foundになります。なので、Nuxt.js側で呼び出すエントリーポイントの記述を間違っている可能性が高いです。

例えば、

async asyncData ({ $axios, params }) {
    try {
      const user = await $axios.$get('user')
      return { user }
    } catch (e) {
      return { user: [] }
    }

といったような形でデータを取得しようとしていた場合、Django側のプロジェクトのurls.pyで

urls.py

urlspatterns = [
      path('api/',include('sample.urls')),
]

と記述し、

sample/urls.py

urlspatterns = [
      path('user/',UserListView.as_view()),
]

といったような形式の書き方しなければなりません。
なぜならば、DRFの書き方と同じようにapi/userといったアドレスからGETしないとuserのデータを取得することはできないからです。
なのでDjango側でのルーティングに合わせた書き方をNuxt.js側でもしてあげなければならないんですね。

簡単なことですが、フロントエンドとバックエンドを分離させて外部からAPIサーバーを叩く場合は意外と見落としがちかなと思います。
少なくとも今回の自分はちょっとだけハマりました。
この件で前よりもルーティングの理解が深まったので良かったです。

この記事が誰かの助けになると幸いです。