• Based on the request's Accept header, respond with the appropriate handler. Fallback to a default handler if no match is found.

    Note: This doesn't return a Remix's TypedResponse for json, it's always typed as a Response object, this is mostly useful for responding to external requests, not to fetchers or any other function you call in your code.

    Parameters

    Returns Promise<Response> | Response

    The response from the handler

    export async function loader({ request }: LoaderFunctionArgs) {
    // do any work independent of the response type before respondTo
    let data = await getData(request);
    return respondTo(request, {
    // The handler can be a subtype handler, in text/html html is the subtype
    html() {
    let result = ReactDOMServer.renderToString(<UI {...data} />)
    return html(result)
    },
    // It can also be a highly specific type, also an async function if needed
    async "application/rss+xml"() {
    let rss = await generateRSSFeed(data);
    let headers = new Headers({ "content-type": "application/rss+xml" })
    return new Response(rss, { headers })
    },
    // The default will be used if the accept header doesn't match any of the other handlers
    default() {
    return new Response("Not Acceptable", { status: 406 })
    }
    })
    }
  • Based on the request's Accept header, respond with the appropriate handler. Fallback to a default handler if no match is found.

    Note: This doesn't return a Remix's TypedResponse for json, it's always typed as a Response object, this is mostly useful for responding to external requests, not to fetchers or any other function you call in your code.

    Parameters

    Returns Promise<Response> | Response

    The response from the handler

    export async function loader({ request }: LoaderFunctionArgs) {
    // do any work independent of the response type before respondTo
    let data = await getData(request);
    return respondTo(request, {
    // The handler can be a subtype handler, in text/html html is the subtype
    html() {
    let result = ReactDOMServer.renderToString(<UI {...data} />)
    return html(result)
    },
    // It can also be a highly specific type, also an async function if needed
    async "application/rss+xml"() {
    let rss = await generateRSSFeed(data);
    let headers = new Headers({ "content-type": "application/rss+xml" })
    return new Response(rss, { headers })
    },
    // The default will be used if the accept header doesn't match any of the other handlers
    default() {
    return new Response("Not Acceptable", { status: 406 })
    }
    })
    }