Skip to content

RTK incorrectly parses non-json response types. #2440

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom
Closed
ChuckJonas opened this issue Jun 22, 2022 · 5 comments
Closed

RTK incorrectly parses non-json response types. #2440

ChuckJonas opened this issue Jun 22, 2022 · 5 comments

Comments

@ChuckJonas
Copy link

I have an open api spec that I've generated a RTK reducer for:

"responses": {
          "200": {
            "description": "The OK response containing generated HTML",
            "content": {
              "text/html": {
                "schema": {
                  "type": "string"
                }
              }
            }
          }
        },

The response is type is a string with content-type of text-html (yuck), but on successful API request, RTK Query fails with an error:

error:
  data: "<!--[if !IE]><!--> <html class=\"nonIE8\">  <!--<
  error: "SyntaxError: Unexpected token < in JSON at position 0"
  originalStatus: 200
  status: "PARSING_ERROR"

Is there someway to properly get RTK to treat data as just a string instead of trying to parse the result as JSON?
@phryneas
Copy link
Member

You can use enhanceEndpoints to overwrite that query function to set a responseHandler of text.

https://redux-toolkit.js.org/rtk-query/api/fetchBaseQuery#parsing-a-response

@alexandernst
Copy link

If I understand correctly, I'd have to implement that custom handler for every endpoint of my API. Is there a way I can globally handle that?

(context: My API always returns plain text instead of JSON)

@phryneas
Copy link
Member

@alexandernst You can pass responseHandler as an option into your fetchBaseQuery({..,}) call

@alexandernst
Copy link

@phryneas Indeed, I saw that after replying to this thread. Actually, I replied you here: #2363 (comment)

@maurovisintin
Copy link

maurovisintin commented Oct 27, 2022 •
edited
Loading

An example of this using generated code with injectEndpoints and enhanceEndpoints separately.

api.generated.ts

const injectedRtkApi = api.injectEndpoints({
  endpoints: build => ({
    users: build.query<
      ApiResponse,
      ApiArg
    >({
      query: () => ({ 
         url: '/users',
         method: 'POST',
         body: queryArg.body,
       }), // endpoint with text response
    })
    ...

api.customized.ts

export const api = generatedAuthApi.enhanceEndpoints({
  endpoints: {
    users: {
      query: queryArg => ({
        url: '/users',
        method: 'POST',
        body: queryArg.body,
        responseHandler: (response: { text: () => any }) => response.text()
      })
    },
 }
})

Actually is there a way to just extend the query defined in the generated file?

@Usama-jamil Usama-jamil mentioned this issue Apr 10, 2023
Closed
@henkkasoft henkkasoft mentioned this issue Sep 21, 2023
Closed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
5 participants
@alexandernst @markerikson @phryneas @ChuckJonas @maurovisintin