как обрабатывать ошибку ax ios единым образом в asyncData () в SSR nuxt. js - PullRequest
0 голосов
/ 09 мая 2020

Я хочу обрабатывать ошибки ax ios единым образом, если код состояния ответа не 2XX или 3XX .

Например, запросы на ввод капчи, бэкэнд вернет 429 код состояния, если от одного клиента будет отправлено слишком много запросов за короткое время.

модели / Captcha. js

import axios from 'axios';
class Captcha{
    static async store(){
        const { data } = await axios.post(`${process.env.API_URL}/auth/captchas`);
        return data;
    }
}
export default Captcha; 

plugins / ax ios -перехватчик. js

import axios from 'axios';

// after getting response
axios.interceptors.response.use(
    response => {
        return response;
    },
    error => {
        // handle errors unifiedly here
        handleErrors(error);
    }
);

дюйм nuxt.config.js

    plugins:[
        '~/plugins/axios-interceptor'
    ],

страниц / регистр. vue

<template>
    ...
    <img :src="captcha.image_content" @click="refreshCaptcha()">
    ...
</template>
import Captcha from '@/models/Captcha';
export default{
    async asyncData(){
        const captcha = await Captcha.store();
        return {
            captcha: captcha
        }
    },
    methods:{
        async refreshCaptcha(){
            this.captcha = await Captcha.store();
        }
    },
    ...
}

Но это не может работать так, как я ожидал.

  1. Во-первых, я не хочу иметь обработчик ошибок по умолчанию Nuxt. js enter image description here

  2. Во-вторых, он не может обрабатывать ошибки, произошедшие в node.js, я хочу, чтобы страница отображалась нормально при возникновении ошибок enter image description here

Как можно Я это решаю? Я не хочу использовать обратный вызов вместо функции Promise или asyn c, потому что Nuxt. js Official сказал, что они больше не будут поддерживать его в будущем.

Большое спасибо!

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...