responseHandler doesn't work

[juliengbt]

Hi,

I've been using RKT Query generator in order to generate the endpoints of my API. Everything is going well except that the response type of my endpoints is sometimes plain text and rtk tries to parse it as json. I've set the responseHanlder to 'content-type'. But it's not working :

const baseQuery: BaseQueryFn<string | FetchArgs, unknown, FetchBaseQueryError> = fetchBaseQuery({
  baseUrl: 'localhost:4000',
  responseHandler: 'content-type',
});

export const emptySplitApi = createApi({
  baseQuery: baseQuery,
  endpoints: () => ({}),
});

I get the error error: SyntaxError: Unexpected token 'e', "eyJhbGciOi"... is not valid JSON

I've also tried something like this, in order to see the function runs, but it doesn't output anything.

const baseQuery: BaseQueryFn<string | FetchArgs, unknown, FetchBaseQueryError> = fetchBaseQuery({
  baseUrl: 'localhost:4000',
  responseHandler: (response) => {
    console.log(response);
    return response.text()
}
});

[phryneas]

Maybe because of the retrun.

But taking a step back: does the server actually set the correct mime type?

[juliengbt]

I've tried without the return, still doesn't output anything. And yes I've checked the server actually sets the mime type (see response headers below)

HTTP/1.1 200 OK
Content-Security-Policy: default-src 'self';style-src 'self' 'unsafe-inline';font-src 'self';img-src 'self' data: validator.swagger.io;script-src 'self' https: 'unsafe-inline';base-uri 'self';form-action 'self';frame-ancestors 'self';object-src 'none';script-src-attr 'none';upgrade-insecure-requests
Cross-Origin-Embedder-Policy: require-corp
Cross-Origin-Opener-Policy: same-origin
Cross-Origin-Resource-Policy: cross-origin
X-DNS-Prefetch-Control: off
X-Frame-Options: SAMEORIGIN
Strict-Transport-Security: max-age=15552000; includeSubDomains
X-Download-Options: noopen
X-Content-Type-Options: nosniff
Origin-Agent-Cluster: ?1
X-Permitted-Cross-Domain-Policies: none
Referrer-Policy: no-referrer
X-XSS-Protection: 0
vary: Origin
access-control-allow-origin: http://localhost:3000
content-type: text/plain
content-length: 243
Date: Sat, 14 Jan 2023 22:24:09 GMT
Connection: keep-alive
Keep-Alive: timeout=72

[phryneas]

My point was that you had written retrun, not return. Which version of RTK are you on?

[juliengbt]

Oh that was a typo here I didn't copy paste that part.

"@reduxjs/toolkit": "^1.9.1",

[phryneas]

Hmm. It's hard to tell here - especially given that you do not even provide the original code.

Could you maybe create a small reproduction for this, maybe a CodeSandbox?

[juliengbt]

Sure, here's the CodeSandbox link :https://codesandbox.io/s/aged-wildflower-10ddzl?file=/package.json

[phryneas]

Hmm, I see. This is a bug - it works on a per-endpoint basis, but not on a global basis. Another instance of the bug fixed in #3062.

I will see that I push a fix for this onto that open PR in the next few days.

Until then: this works fine on a per-endpoint basis:

    loremText: build.query<String, void>({
      query: () => ({
        url: "/?type=all-meat&start-with-lorem=1&paras=1&format=text",
        responseHandler: "content-type"
      })
    })