404 Not Found on OPTIONS request

[58bits]

Completely stumped. I have the cors plugin installed, and two routes as follows:

module.exports = async (app, opts) => {
  app.get('/bar', async (request, reply) => {
    return { hello: 'bar called' }
  })

  app.get('/foo', async (request, reply) => {
    return { hello: 'foo called' }
  })
}

OPTIONS requests seem to be working, and are handled by the onRequest hook in the fastify-cors plugin, but when I change the path of the bar route, to anything else that doesn't start with bar... I get a 404 not found response.

e.g.:

module.exports = async (app, opts) => {
  app.get('/fuzzy', async (request, reply) => {
    return { hello: 'bar called' }
  })
}

curl -X OPTIONS http://127.0.0.1:3000/fuzzy

returns

{"statusCode":404,"error":"Not Found","message":"Not Found"}

Any ideas?

[58bits]

I think I've found the problem. Implementing my own wildcard route for OPTIONS requests using /* instead of * works.
e.g.:

.route({
      method: 'OPTIONS',
      url: '/*',
      handler: async (request, reply) => {
        reply.code(204)
          .header('Content-Length', '0')
          .header('Access-Control-Allow-Origin', '*')
          .header('Access-Control-Allow-Methods', 'GET,HEAD,PUT,PATCH,POST,DELETE')
          .send()
      }
    })

Is this possibly related to fastify/fastify#81 ?

I'm using fastify v2.0.1 and fastify-cors v2.1.2 on node v10.15.3

[mcollina]

Can you please add a full repro for your problem? Something I can execute straight away.

It looks like it might be a bug somewhere cc @delvedor

[58bits]

Sure - I'll setup a public repo in a little while.

[58bits]

Try this... https://github.com/58bits/fastify-20

[mcollina]

@delvedor can you take a look? This seems something that goes deep down in find-my-way.

[ljieyao]

I have the same issue. How to solve this?

[ljieyao]

I think I've found the problem. Implementing my own wildcard route for OPTIONS requests using /* instead of * works.
e.g.:

.route({
      method: 'OPTIONS',
      url: '/*',
      handler: async (request, reply) => {
        reply.code(204)
          .header('Content-Length', '0')
          .header('Access-Control-Allow-Origin', '*')
          .header('Access-Control-Allow-Methods', 'GET,HEAD,PUT,PATCH,POST,DELETE')
          .send()
      }
    })

Is this possibly related to fastify/fastify#81 ?

I'm using fastify v2.0.1 and fastify-cors v2.1.2 on node v10.15.3

I have tried your workaround. But not work for me

[58bits]

Quick note with more to come - but it may be that the way we are registering app.js - without using fastify-plugin, is affecting the scope of fastify-cors.

[mcollina]

it seems you folks a have a better understanding of your issue than us. Would you like to send a PR?

[ljieyao]

Not really understand what to do, what do you mean by "the way we are registering app.js"? @58bits

[58bits]

Sorry both @daveamayombo and I are on the road until later this week. Stay tuned...

[58bits]

Apologies for the slow reply. What we think might be happening, is that in our application, we are registering a main app.js plugin, after index.js. https://github.com/58bits/fastify-20/blob/master/index.js - and that if instead the fastify-cors module is loaded in index.js (top level scope?) it works.

We still don't know 100% why, and have not had time to dig into find-my-way, or the problem in more detail.

For now - we've simply created our own plugin, using the '/*' catch-all route as follows (leaning heavily on the fastify-cors module as an example).

'use strict'

const fp = require('fastify-plugin')

async function setup (app) {
  // Wildcard OPTIONS handler for CORS preflight requests
  app.route({
    method: 'OPTIONS',
    url: '/*',
    handler: async (request, reply) => {

      var reqAllowedHeaders = request.headers['access-control-request-headers']
      if (reqAllowedHeaders !== undefined) {
        reply.header('Access-Control-Allow-Headers', reqAllowedHeaders)
      }
      reply.code(204)
        .header('Content-Length', '0')
        .header('Access-Control-Allow-Origin', 'http://localhost:8080')
        .header('Access-Control-Allow-Credentials', true)
        .header('Access-Control-Allow-Methods', 'GET,HEAD,PUT,PATCH,POST,DELETE')
        .send()
    }
  })

  // CORS reply - 'Access-Control-Allow-Origin', '*' for now..
  // See https://github.com/fastify/fastify-cors/issues/20
  app.addHook('onRequest', function (request, reply, next) {
    reply.header('Access-Control-Allow-Origin', 'http://localhost:8080')
    reply.header('Access-Control-Allow-Credentials', true)
    next()
  })
}

module.exports = fp(setup)

[alexey-sh]

@58bits thank you, your example works excellent.

[StarpTech]

@58bits please upgrade to the latest version. I think it was fixed with delvedor/find-my-way#133

[stale]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

[acro5piano]

This is a different problem as OP says OPTIONS, but I struggled to fix curl -I http://127.0.0.1:3000 returns 404.

For others who miss the document, this helped me a lot.

const app = fastify({
    exposeHeadRoutes: true,       // <-- this option
})

Related

• feat: Set HEAD routes automatically for each GET route fastify#2700
• Set exposeHeadRoutes: true by default fastify#2826