Почему ошибки в Vue router beforeEach не вызывают исключений при работе в V8 Js? - PullRequest
1 голос
/ 27 мая 2020

У меня есть приложение Laravel / Vue, использующее SSR, поэтому JavaScript работает на стороне сервера и на стороне клиента.

У меня была ошибка в коде, где я проверял user.id, когда объект пользователя был нулевым.

Если бы он работал на стороне клиента, я бы увидел ошибку в консоли и легко ее исправил.

Однако, поскольку это работало в v8 js Я не получил никаких результатов, и мне пришлось просто методом проб и ошибок найти и исправить ошибку. Это напомнило мне об исправлении JS ошибок в IE6 - не то, что я хочу повторять!

Я пробовал метод getPendingException(), но он просто предупредил меня о том, что он устарел. .

Обратите внимание, что некоторые ошибки генерируются ....

Очевидные синтаксические ошибки обнаруживаются сразу, когда я запускаю webpack.

Некоторые ошибки вызывают исключение V8JsScriptException:

if(foo.bar) {}

Это генерирует ошибку:

V8Js::compileString():86354: ReferenceError: foo is not defined

Если я оборачиваю foo в функцию, а затем вызываю ее:

function test() {
    if(foo.bar) {}
}
test()

Исключение не генерируется, но единственный вывод возвращается:

ReferenceError: foo is not defined 

Однако этот код, предназначенный для моего Vue маршрутизатора, не производит никаких результатов:

import Vue from 'vue'
import Router from 'vue-router'
import routes from './routes'

Vue.use(Router)

export function createRouter () {
    const router = new Router({
        mode: 'history',
        routes: routes
    })

    router.beforeEach(async (to, from, next) => {
        if(foo.bar) {}
        next()
    })

    return router
}

Когда я запускаю этот же код в браузере, консоль показывает :

ReferenceError: foo is not defined

Кажется, что JS создает ошибку, но каким-то образом V8 Js не передает ее.

Почему неопределенная ошибка в Vue маршрутизатор не генерирует исключение при запуске в v8 js?

1 Ответ

1 голос
/ 04 июня 2020

Используйте обработчик onError на вашем маршрутизаторе: router.onError

И, поскольку ваш beforeEnter охранник является asyn c, вам нужно позвонить next с ошибка:

export function createRouter () {
    const router = new Router({
        mode: 'history',
        routes: routes
    })

    router.beforeEach(async (to, from, next) => {
      try {
        if(foo.bar) {}
        next()
      } catch (e) {
        next(e)
      } 
    })

    router.onError(err => {
       print('<!-- router error: ' + err.message + ' -->')
    })

    return router
}

В вашем примере вы можете использовать синхронную защиту и обойтись без try / catch:

router.beforeEach((to, from, next) => {
    if(foo.bar) {}
    next()
})
...