meteor-vue / vue-meteor

🌠 Vue first-class integration in Meteor
898 stars 111 forks source link

Added support for: reject status `code` and `message`; `context.statusCode`. #397

Open mrauhu opened 4 years ago

mrauhu commented 4 years ago

Greetings, Guillaume @Akryum.

In this pull request I added support for:

Best wishes, Sergey.

P.S. This pull request is copy of https://github.com/meteor-vue/vue-meteor/pull/390, but from different branch (not master).

chris-visser commented 4 years ago

@mrauhu It might be better to add machine readable strings. A bit like how the Meteor guide describes the error field: https://guide.meteor.com/methods.html#throwing-errors. This way we can apply translations to them and it follows a similar structure to how Apollo's resolvers work: https://www.apollographql.com/docs/apollo-server/data/errors/

mrauhu commented 4 years ago

It might be better to add machine readable strings.

Purpose of this changes is make a human readable Server-Side Rendered (SSR) 404 error page with a machine readable 404 Not found HTTP status code.

@chris-visser please, read carefully: Current implementation of the vue-ssr have the bug, that breaks your SEO dramatically, it's return the 200 OK HTTP status code for not found pages.

Right now, the no matched routes example code from vue-ssr README.md not working, and return 200 OK to web crawlers (scrapers) as Googlebot, Bingbot, Baiduspider or YandexBot:

https://github.com/meteor-vue/vue-meteor/blob/078e632b631e7b4a05a8b32059fa6268b82b15f8/packages/vue-ssr/README.md#L85-L88

This pull-request fix the bug and make code cross-platform between the Vue SSR guide approach and Vue+Meteor SSR.

Basically, you can copy code from your Vue.js or Nuxt.js application to Vue+Meteor and it's works.

As example, you may return reject({ code: 404 }) as described in: https://ssr.vuejs.org/guide/routing.html#routing-with-vue-router

Please, see the code from the Vue SSR guide:

Now we need to implement the server-side routing logic in entry-server.js:

    // wait until router has resolved possible async components and hooks
    router.onReady(() => {
      const matchedComponents = router.getMatchedComponents()
      // no matched routes, reject with 404
      if (!matchedComponents.length) {
        return reject({ code: 404 })
      }

      // the Promise should resolve to the app instance so it can be rendered
      resolve(app)
    }, reject)

A bit like how the Meteor guide describes the error field This way we can apply translations to them and it follows a similar structure to how Apollo's resolvers work

It's not about Meteor or Apollo errors.

Optional the reject({ message: 'Custom error message'}) attribute needed for replace the default error message Server error that hardcoded in:

https://github.com/meteor-vue/vue-meteor/blob/2ddce135e86baf69780579f66844da2394cbe7fc/packages/vue-ssr/server/index.js#L67-L69

Thank you for attention, Sergey.

chris-visser commented 4 years ago

Oh lol. Turned out I'd misread your example. You are showing it indeed as part of how devs could use it. Actually really nice this! 🙂