Expo tRPC not sending the token on the headers #228

Closed
opened 2026-03-13 07:38:46 -05:00 by GiteaMirror · 4 comments
Owner

Originally created by @isherstnov on GitHub (Nov 15, 2024).

First of all, thank you very much for this library, it provides a huge amount of value 🙇‍♂️

Describe the bug
It seems like the token is not being sent from Expo when using the OTP plugin.

I used https://github.com/Bekacru/create-t3-turbo just to add the OTP login system.

The login works on both Next.js and Expo apps, but when making any request to the API of Next.js from Expo, Expo tRPC is not sending the authorization header with the token because it can not find it.

To Reproduce
Steps to reproduce the behavior:

  1. Go to https://github.com/isherstnov/create-t3-turbo-with-otp
  2. Clone the repo
  3. Execute cp .env.example .env
  4. Execute ./start-database.sh
  5. Run pnpm i
  6. Run pnpm db:push
  7. Run pnpm dev
  8. Go to the Expo app
  9. Login with OTP (token is on console.log of Next.js)
  10. Try to create a post, it will give you an UNAUTHORIZED error

If you check https://github.com/isherstnov/create-t3-turbo-with-otp/blob/main/apps/expo/src/utils/api.tsx#L40, this always gives null for the token, even if you are logged in.

Expected behavior
Token should be sent with the request of tRPC in Expo.

Version used
0.8.2

Additional notes
As far as I'm aware, I followed the guidelines on the website correctly for the OTP but it may be that I missed something 😅

Originally created by @isherstnov on GitHub (Nov 15, 2024). First of all, thank you very much for this library, it provides a huge amount of value 🙇‍♂️ **Describe the bug** It seems like the token is not being sent from Expo when using the OTP plugin. I used https://github.com/Bekacru/create-t3-turbo just to add the OTP login system. The login works on both Next.js and Expo apps, but when making any request to the API of Next.js from Expo, Expo tRPC is not sending the authorization header with the token because it can not find it. **To Reproduce** Steps to reproduce the behavior: 1. Go to https://github.com/isherstnov/create-t3-turbo-with-otp 2. Clone the repo 3. Execute `cp .env.example .env` 4. Execute `./start-database.sh` 6. Run `pnpm i` 7. Run `pnpm db:push` 8. Run `pnpm dev` 9. Go to the Expo app 10. Login with OTP (token is on console.log of Next.js) 11. Try to create a post, it will give you an `UNAUTHORIZED` error If you check https://github.com/isherstnov/create-t3-turbo-with-otp/blob/main/apps/expo/src/utils/api.tsx#L40, this always gives `null` for the token, even if you are logged in. **Expected behavior** Token should be sent with the request of tRPC in Expo. **Version used** 0.8.2 **Additional notes** As far as I'm aware, I followed the guidelines on the website correctly for the OTP but it may be that I missed something 😅
Author
Owner

@Bekacru commented on GitHub (Nov 15, 2024):

https://www.better-auth.com/docs/integrations/expo#making-authenticated-requests-to-your-server

just added a guide on the docs. let me know if this resolves the issue.

@Bekacru commented on GitHub (Nov 15, 2024): https://www.better-auth.com/docs/integrations/expo#making-authenticated-requests-to-your-server just added a guide on the docs. let me know if this resolves the issue.
Author
Owner

@isherstnov commented on GitHub (Nov 15, 2024):

Amazing! Many thanks for the help @Bekacru 🙇‍♂️

The documentation looks great but I think there is a typo, the item is stored as ${storagePrefix}_cookie, not ${storagePrefix}_cookies. If I'm not mistaken, the item gets stored here https://github.com/better-auth/better-auth/blob/main/packages/expo/src/client.ts#L95C61-L95C68 as *_cookie.

Now I'm able to retrieve the cookies and put them on the request, this is what comes on the headers when inspecting on the tRPC part:

cookie: '{"better-auth.session_token":{"value":"9iTtQwD...VHiBv8%3D","expires":"2024-11-15T11:04:06.716Z"}}', 

The problem is that session is still null here: https://github.com/isherstnov/create-t3-turbo-with-otp/blob/main/packages/api/src/trpc.ts#L42

Even if the cookie header is passed to the getSession 😕 any other idea?

@isherstnov commented on GitHub (Nov 15, 2024): Amazing! Many thanks for the help @Bekacru 🙇‍♂️ The documentation looks great but I think there is a typo, the item is stored as `${storagePrefix}_cookie`, not `${storagePrefix}_cookies`. If I'm not mistaken, the item gets stored here https://github.com/better-auth/better-auth/blob/main/packages/expo/src/client.ts#L95C61-L95C68 as `*_cookie`. Now I'm able to retrieve the cookies and put them on the request, this is what comes on the headers when inspecting on the tRPC part: ```ts cookie: '{"better-auth.session_token":{"value":"9iTtQwD...VHiBv8%3D","expires":"2024-11-15T11:04:06.716Z"}}', ``` The problem is that `session` is still `null` here: https://github.com/isherstnov/create-t3-turbo-with-otp/blob/main/packages/api/src/trpc.ts#L42 Even if the cookie header is passed to the `getSession` 😕 any other idea?
Author
Owner

@isherstnov commented on GitHub (Nov 15, 2024):

Just found a workaround and everything seems to work fine, I'm converting the cookie headers format that I receive from Expo into the same cookie headers format that I saw that works on Next.js

https://github.com/isherstnov/create-t3-turbo-with-otp/blob/main/packages/auth/src/index.rsc.ts#L6-L39

This is the format it comes when the request is from Next.js:

cookies from Next.js:  better-auth.session_token=oQWoGOO_v7NhD_Onf6O1H0l92BYbaqk5.2IXgtriu........68tojwqX%2F1E3deJ9KhFoU%3D

And this is the format it comes when the request is from Expo:

cookies from Expo:  {"better-auth.session_token":{"value":"9r8m9m4TNZuYaXOHID5sDGR1RE5UF1gw.uvHWzWFoBZdr%2BkPo%2BgF.....ftSGsl5EDAWQ%3D","expires":"2024-11-15T13:07:23.112Z"}}

I guess a better solution would be to properly format it on Expo tRPC side when obtaining the cookies before sending the actual request, but I'm not 100% sure 😅

As said, many thanks @Bekacru for your work, this library is amazing 🙇‍♂️

@isherstnov commented on GitHub (Nov 15, 2024): Just found a workaround and everything seems to work fine, I'm converting the cookie headers format that I receive from Expo into the same cookie headers format that I saw that works on Next.js https://github.com/isherstnov/create-t3-turbo-with-otp/blob/main/packages/auth/src/index.rsc.ts#L6-L39 This is the format it comes when the request is from Next.js: ```ts cookies from Next.js: better-auth.session_token=oQWoGOO_v7NhD_Onf6O1H0l92BYbaqk5.2IXgtriu........68tojwqX%2F1E3deJ9KhFoU%3D ``` And this is the format it comes when the request is from Expo: ```ts cookies from Expo: {"better-auth.session_token":{"value":"9r8m9m4TNZuYaXOHID5sDGR1RE5UF1gw.uvHWzWFoBZdr%2BkPo%2BgF.....ftSGsl5EDAWQ%3D","expires":"2024-11-15T13:07:23.112Z"}} ``` I guess a better solution would be to properly format it on Expo tRPC side when obtaining the cookies before sending the actual request, but I'm not 100% sure 😅 As said, many thanks @Bekacru for your work, this library is amazing 🙇‍♂️
Author
Owner

@Bekacru commented on GitHub (Nov 15, 2024):

thanks! and just added a helper to get the parsed cookie instead
https://www.better-auth.com/docs/integrations/expo#option-2-adding-the-cookie-to-request-headers

@Bekacru commented on GitHub (Nov 15, 2024): thanks! and just added a helper to get the parsed cookie instead https://www.better-auth.com/docs/integrations/expo#option-2-adding-the-cookie-to-request-headers
Sign in to join this conversation.
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: github-starred/better-auth#228