fetch.server.js 2.2 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970
  1. import Vue from 'vue'
  2. import { hasFetch, normalizeError, addLifecycleHook, purifyData, createGetCounter } from '../utils'
  3. async function serverPrefetch() {
  4. if (!this._fetchOnServer) {
  5. return
  6. }
  7. // Call and await on $fetch
  8. try {
  9. await this.$options.fetch.call(this)
  10. } catch (err) {
  11. if (process.dev) {
  12. console.error('Error in fetch():', err)
  13. }
  14. this.$fetchState.error = normalizeError(err)
  15. }
  16. this.$fetchState.pending = false
  17. // Define an ssrKey for hydration
  18. this._fetchKey = this._fetchKey || this.$ssrContext.fetchCounters['']++
  19. // Add data-fetch-key on parent element of Component
  20. const attrs = this.$vnode.data.attrs = this.$vnode.data.attrs || {}
  21. attrs['data-fetch-key'] = this._fetchKey
  22. // Add to ssrContext for window.__NUXT__.fetch
  23. <% if (debug) { %>
  24. if (this.$ssrContext.nuxt.fetch[this._fetchKey] !== undefined) {
  25. console.warn(`Duplicate fetch key detected (${this._fetchKey}). This may lead to unexpected results.`)
  26. }
  27. <% } %>
  28. this.$ssrContext.nuxt.fetch[this._fetchKey] =
  29. this.$fetchState.error ? { _error: this.$fetchState.error } : purifyData(this._data)
  30. }
  31. export default {
  32. created() {
  33. if (!hasFetch(this)) {
  34. return
  35. }
  36. if (typeof this.$options.fetchOnServer === 'function') {
  37. this._fetchOnServer = this.$options.fetchOnServer.call(this) !== false
  38. } else {
  39. this._fetchOnServer = this.$options.fetchOnServer !== false
  40. }
  41. const defaultKey = this.$options._scopeId || this.$options.name || ''
  42. const getCounter = createGetCounter(this.$ssrContext.fetchCounters, defaultKey)
  43. if (typeof this.$options.fetchKey === 'function') {
  44. this._fetchKey = this.$options.fetchKey.call(this, getCounter)
  45. } else {
  46. const key = 'string' === typeof this.$options.fetchKey ? this.$options.fetchKey : defaultKey
  47. this._fetchKey = key ? key + ':' + getCounter(key) : String(getCounter(key))
  48. }
  49. // Added for remove vue undefined warning while ssr
  50. this.$fetch = () => {} // issue #8043
  51. Vue.util.defineReactive(this, '$fetchState', {
  52. pending: true,
  53. error: null,
  54. timestamp: Date.now()
  55. })
  56. addLifecycleHook(this, 'serverPrefetch', serverPrefetch)
  57. }
  58. }