docs(fetch-router): update readme blog example #10778
Conversation
| ### Resource-based Routes | ||
|
|
||
| Create resource-based route maps with the `resource` and `resources` functions. This can help DRY up your route definitions when creating RESTful APIs, Rails-style routes, etc. | ||
| Create resource-based route maps with the `resource` and `resources` functions. This can help DRY up your route definitions when creating RESTful APIs, Rails-style routes, etc. This example illustrates [Rails-style routes](https://guides.rubyonrails.org/routing.html#resource-routing-the-rails-default): |
There was a problem hiding this comment.
For those of us not familiar with Rails examples, just provide a link for clarity :)
packages/fetch-router/README.md
Outdated
| let router = createRouter() | ||
| let router = createRouter({ | ||
| parseFormData: false | ||
| }) |
There was a problem hiding this comment.
I was getting an error trying to run this example
TypeError: Body already consumed
at InnerBody.consume (ext:deno_fetch/22_body.js:157:32)
at consumeBody (ext:deno_fetch/22_body.js:268:34)
at Request.formData (ext:deno_fetch/22_body.js:349:16)
at create (https://esm.town/v/jimniels/fetch-router@18-main/main.ts:84:36)
at dispatch (file:///opt/render/.cache/deno/npm/registry.npmjs.org/@remix-run/fetch-router/0.6.0/dist/index.js:2814:21)
at next (file:///opt/render/.cache/deno/npm/registry.npmjs.org/@remix-run/fetch-router/0.6.0/dist/index.js:2820:21)
at https://esm.town/v/jimniels/fetch-router@18-main/main.ts:26:10
at dispatch (file:///opt/render/.cache/deno/npm/registry.npmjs.org/@remix-run/fetch-router/0.6.0/dist/index.js:2823:26)
at runMiddleware (file:///opt/render/.cache/deno/npm/registry.npmjs.org/@remix-run/fetch-router/0.6.0/dist/index.js:2832:10)
at Router.dispatch (file:///opt/render/.cache/deno/npm/registry.npmjs.org/@remix-run/fetch-router/0.6.0/dist/index.js:2976:41)
Digging into the source, it looks like this is a config option I need to pass in because the router is gonna read this data by default. So your options are:
Option 1
// configure router
let router = createRouter({
parseFormData: false
})
// read formData in your handler
async create({ request }) {
let formData = await request.formData();
console.log(formData);
// ...
},Option 2
// use router defaults (which reads body)
let router = createRouter()
// access formData directly
async create({ request, formData }) {
console.log(formData);
// ...
},I went with option 1 for the docs because it was the smallest change, but this wasn't obvious to me when I copy/pasted the example on why it wasn't working
There was a problem hiding this comment.
Oh, but if you turn it off in the router, then doing like methodOverride won't work.
So I changed the examples in the docs to take formData as args.
| // | ||
| // ``` | ||
| // import { router } from "./router" | ||
| // export default async function handler(req: Request) { return router.fetch(req) } |
There was a problem hiding this comment.
A note on how to integrate with hosting envs like deno.dev, val.town, etc. — might be useful for n00bs like myself
jimniels
changed the title
| `) | ||
| }, | ||
| async update({ params, request }) { | ||
| let formData = await request.formData() |
There was a problem hiding this comment.
This doesn't work because the router is reading it (which I assume it needs to do in order to handle method overrides)
So need to get formData from the function rather than reading request.formData
|
Thanks for the PR, @jimniels. I landed the built-in formdata parsing the week before Remix Jam, so the docs were a little behind. Apologies for anything that was unclear. I'll give the docs a more comprehensive overhaul this week. |
3 participants
Was trying to get the basic blog example working in val.town
See inline comments for changes that would've helped me.