I have been using Nuxtjs and axios for API calls. In a page called post listing, once I select a post which suppose to navigate me to details page, while loading towards the page, once I click on browse's back button and try to get back to same listing page again without visiting the details page. It gives 404 and post not found error.

Is there any good way to prevent that?

Here is the code details page

async asyncData({ $api, route, $auth, error }) {
    try {
      // console.log(route.params)
      const { feed } = await $api.Feed.feedDetails(
        route.params.id,
        $auth.loggedIn
      )
      if (route.query.origin === 'channel') {
        const { channel } = await $api.Channels.channelDetails(
          route.query.cId,
          $auth.loggedIn
        )
        return { feed, channel_details: channel }
      } else {
        return { feed }
      }
    } catch (e) {
      error({ statusCode: 404, message: 'Feed not found' })
    }
  },

I have this middleware in the page details page

export default async function (context) {
  if (context.$auth.$state.loggedIn) {
    const params = {
      page: 1,
    }
    const { threads } = await context.$api.Messages.MessageThreadList(params)
    const { notifications } = await context.$api.Users.getNotifications({
      last_id: 0,
    })

    context.store.commit('addThreadList', threads)
    context.store.commit('addNotification', notifications)
  }
}