Zengtudor/Nuxt
1
0
Fork 0
mirror of https://github.com/nuxt/nuxt.git synced 2024-11-30 09:27:13 +00:00
Code Issues Packages Projects Releases Wiki Activity

Fix middleware on client-side

Browse Source
This commit is contained in:
Sebastien Chopin 2017-05-09 14:43:47 +02:00
parent 9099b00963
commit 64abcc04a8
3 changed files with 22 additions and 26 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
examples/middleware/middleware/visits.js
View File

@ -1,4 +1,3 @@
export default function ({ store, route, redirect }) { export default function ({ store, route, redirect }) {
store.commit('ADD_VISIT', route.path) store.commit('ADD_VISIT', route.path)
if (route.fullPath === '/') return redirect('/foo')
} }

1
examples/middleware/pages/_slug.vue
View File

@ -12,7 +12,6 @@
<script> <script>
export default { export default {
asyncData ({ store, route, userAgent }) { asyncData ({ store, route, userAgent }) {
console.log('Call async data', route.fullPath)
return { return {
userAgent, userAgent,
slugs: [ slugs: [

40
lib/app/client.js
View File

@ -82,10 +82,13 @@ function callMiddleware (Components, context, layout) {
return middlewareSeries(midd, context) return middlewareSeries(midd, context)
} }
function render (to, from, next) { async function render (to, from, next) {
if (this._hashChanged) return next() if (this._hashChanged) return next()
let layout
let nextCalled = false
const _next = function (path) { const _next = function (path) {
<%= (loading ? 'this.$loading.finish && this.$loading.finish()' : '') %> <%= (loading ? 'this.$loading.finish && this.$loading.finish()' : '') %>
if (nextCalled) return
nextCalled = true nextCalled = true
next(path) next(path)
} }
@ -96,14 +99,13 @@ function render (to, from, next) {
this._hadError = !!this.$options._nuxt.err this._hadError = !!this.$options._nuxt.err
if (!Components.length) { if (!Components.length) {
// Default layout // Default layout
callMiddleware.call(this, Components, context) await callMiddleware.call(this, Components, context)
.then(() => this.loadLayout(typeof NuxtError.layout === 'function' ? NuxtError.layout(context) : NuxtError.layout)) if (context._redirected) return
.then(callMiddleware.bind(this, Components, context)) layout = await this.loadLayout(typeof NuxtError.layout === 'function' ? NuxtError.layout(context) : NuxtError.layout)
.then(() => { await callMiddleware.call(this, Components, context, layout)
if (context._redirected) return
this.error({ statusCode: 404, message: 'This page could not be found.' }) this.error({ statusCode: 404, message: 'This page could not be found.' })
return next() return next()
})
return
} }
// Update ._data and other properties if hot reloaded // Update ._data and other properties if hot reloaded
Components.forEach(function (Component) { Components.forEach(function (Component) {
@ -113,18 +115,17 @@ function render (to, from, next) {
} }
}) })
this.setTransitions(mapTransitions(Components, to, from)) this.setTransitions(mapTransitions(Components, to, from))
let nextCalled = false try {
// Set layout // Set layout
callMiddleware.call(this, Components, context) await callMiddleware.call(this, Components, context)
.then(() => { if (context._redirected) return
let layout = Components[0].options.layout layout = Components[0].options.layout
if (typeof layout === 'function') { if (typeof layout === 'function') {
layout = layout(context) layout = layout(context)
} }
return this.loadLayout(layout) layout = await this.loadLayout(layout)
}) await callMiddleware.call(this, Components, context, layout)
.then(callMiddleware.bind(this, Components, context)) if (context._redirected) return
.then(() => {
// Pass validation? // Pass validation?
let isValid = true let isValid = true
Components.forEach((Component) => { Components.forEach((Component) => {
@ -139,7 +140,7 @@ function render (to, from, next) {
this.error({ statusCode: 404, message: 'This page could not be found.' }) this.error({ statusCode: 404, message: 'This page could not be found.' })
return next() return next()
} }
return Promise.all(Components.map((Component, i) => { await Promise.all(Components.map((Component, i) => {
// Check if only children route changed // Check if only children route changed
Component._path = compile(to.matched[i].path)(to.params) Component._path = compile(to.matched[i].path)(to.params)
if (!this._hadError && Component._path === _lastPaths[i] && (i + 1) !== Components.length) { if (!this._hadError && Component._path === _lastPaths[i] && (i + 1) !== Components.length) {
@ -163,16 +164,13 @@ function render (to, from, next) {
} }
return Promise.all(promises) return Promise.all(promises)
})) }))
})
.then(() => {
_lastPaths = Components.map((Component, i) => compile(to.matched[i].path)(to.params)) _lastPaths = Components.map((Component, i) => compile(to.matched[i].path)(to.params))
<%= (loading ? 'this.$loading.finish && this.$loading.finish()' : '') %> <%= (loading ? 'this.$loading.finish && this.$loading.finish()' : '') %>
// If not redirected // If not redirected
if (!nextCalled) { if (!nextCalled) {
next() next()
} }
}) } catch (error) {
.catch((error) => {
_lastPaths = [] _lastPaths = []
error.statusCode = error.statusCode || error.status || (error.response && error.response.status) || 500 error.statusCode = error.statusCode || error.status || (error.response && error.response.status) || 500
let layout = NuxtError.layout let layout = NuxtError.layout
@ -184,7 +182,7 @@ function render (to, from, next) {
this.error(error) this.error(error)
next(false) next(false)
}) })
}) }
} }
// Fix components format in matched, it's due to code-splitting of vue-router // Fix components format in matched, it's due to code-splitting of vue-router