如何將錯誤消息從服務器后端傳遞到 vue 前端

Question

我正在為 Vue/Vuetify 中構建的應用程序進行錯誤處理。 我正在對鏈接到 API 的數據表使用外部分頁，該數據表在一段時間內只允許如此多的點擊。 因此，當用戶達到該限制時，我試圖通過並在前端向用戶顯示“請求過多”的錯誤。

我遇到的問題是將該錯誤從后端服務器傳遞到前端。 當它在前端出錯時，它只會給出 500 錯誤。 但是，服務器日志給了我正在發生的實際錯誤。 我怎樣才能讓它通過？ 下面是來自服務器和前端的相關 javascript 代碼。

注意：我一直在使用 eventbus 來顯示整個項目中的錯誤。 但到目前為止，我還沒有從后到前傳遞任何東西。

后端服務器

module.exports = {

  async find(ctx) {
    var page = ctx.query.page;
    var key = '';
    var locale = ({ location: '', location_type: '', page: page });
    const sdk = require('api')('@');
    try {
      var response = await sdk.auth(key)['grants_funders'](locale);
    }
    catch (err) {
      console.log(err);      
    }
    ;
    // .then(res => console.log(res))
    // .catch(err => console.error(err));
    // console.log(response);
    return response
  }

};

前端

export default {
  name: "Search",
  components: {},
  props: ["funderDirectories", "serverItemsLength"],
  data() {
    return {
      page: 1,
      usericon: usericon,
      greentick: greentick,
      listicon: listicon,
      training: training,
      keyword: null,
      funderHeaders: [
        { text: "Organization", value: "funder_name" },
        { text: "City", value: "funder_city" },
        { text: "Country", value: "funder_country" },
        { text: "Count", value: "grant_count" },
      ],
      myloadingvariable: false,
      pageCount: 1,
      itemsPerPage: 25,
    };
  },
  watch: {
    page() {
      Vue.$funderService.find({ page: this.page }).then((res) => {
        this.funderDirectories = res.data.rows;
        this.serverItemsLength = res.data.total_hits;
      });
    },
  },
  methods: {},

  computed: {
    filteredFunderDirectories() {
      if (!this.keyword) {
        return this.funderDirectories;
      }

      return this.funderDirectories.filter(
        (q) =>
          q.funder_name.toLowerCase().indexOf(this.keyword.toLowerCase()) !== -1
      );
    },
  },
};

Answer 1

我還沒有測試我的示例，但是您可以嘗試在 catch 塊中返回錯誤，如下所示：

try {
  var response = await sdk.auth(key)['grants_funders'](locale);
  return response;
}
catch (err) {
  console.log(err);    
  return err;  
}

Answer 2

最終想通了。 將以下內容添加到后端捕獲

 return ctx.send({errorStatus:"Too Many Requests. Please Wait"},429)

我可以打電話