Unable to get the response from trpc mutation in trpc-v10 using drf and django as backend - django

Question

I have an app that uses t3-app as boiler plate with tailwind and trpc and django as my backend with drf to create api endpoints.
I am not able to get the data back from a login endpoint that is a generic apiview.
class LoginView(generics.GenericAPIView):
authentication_classes = []
permission_classes = []
def post(self, request, *args, **kwargs):
username = request.data.get("username")
password = request.data.get("password")
user = authenticate(username=username, password=password)
if user:
return Response(data={
'data': {
"token": Token.objects.create(user=user).key,
'username': user.get_username(),
'email': user.email,
'group': [g.name for g in user.groups.all()]
}
}, content_type='application/json')
else:
return Response({"error": "Wrong Credentials"}, status=400)
When I try this end point with Postman, it works as below:
but when I use trpc to fetch this endpoint I don't get any response but the token is generated
my trpc router code is:
import { z } from "zod";
import { router, publicProcedure } from "../trpc";
export const commonRouter = router({
login: publicProcedure
.input(
z.object({
username: z.string(),
password: z.string().min(4, "Password must be at least 4 characters"),
})
)
.mutation(async ({ input }) => {
console.log("Hello from login mutation")
console.log('input', input)
try {
// const router = useRouter();
const data = {
username: input.username,
password: input.password,
};
const options = {
method: "POST",
headers: {
'Accept': "application/json",
"Content-Type": "application/json",
},
body: JSON.stringify(data),
};
fetch("http://127.0.0.1:8000/api/login", options)
.then((res) => {console.log("res:",res);res.json()})
.then((data) => console.log("data", data))
.catch((error) => console.log("error", error));
// localStorage.setItem("token", recData);
} catch (error) {
console.log("error");
}
}),
});
The console logged items are:
Hello from login mutation
input { username: 'jhcadmin', password: 'jhclp' }
res: Response {
[Symbol(realm)]: null,
[Symbol(state)]: {
aborted: false,
rangeRequested: false,
timingAllowPassed: true,
requestIncludesCredentials: true,
type: 'default',
status: 200,
timingInfo: {
startTime: 1010918.1206000149,
redirectStartTime: 0,
redirectEndTime: 0,
postRedirectStartTime: 1010918.1206000149,
finalServiceWorkerStartTime: 0,
finalNetworkResponseStartTime: 0,
finalNetworkRequestStartTime: 0,
endTime: 0,
encodedBodySize: 149,
decodedBodySize: 149,
finalConnectionTimingInfo: null
},
cacheState: '',
statusText: 'OK',
},
[Symbol(headers)]: HeadersList {
[Symbol(headers map)]: Map(10) {
'date' => 'Sun, 05 Feb 2023 11:25:41 GMT',
'server' => 'WSGIServer/0.2 CPython/3.11.1',
'content-type' => 'application/json',
'vary' => 'Accept, Origin',
'allow' => 'POST, OPTIONS',
'x-frame-options' => 'DENY',
'content-length' => '149',
'x-content-type-options' => 'nosniff',
'referrer-policy' => 'same-origin',
'cross-origin-opener-policy' => 'same-origin'
},
[Symbol(headers map sorted)]: null
}
}
data undefined