React app fetching failure with default configs

Hello, I am brand new to Flipt and am trying it out on my local machine before trying to deploy it into the engineering environment. I am running flipt in a docker container using the image shown in the documentation.

I made a brand new react app and am using the client sdk for react as shown in the documentation. In fact, I copied and pasted the code.

I created a test boolean flag with the key flag1, and am trying to get that to evaluate in the react client code. However, when the code loads and executes, the container output says

ERROR Failed to extract ServerMetadata from context {“server”: “grpc”, “system”: “grpc”, “grpc_log”: true}

And the client SDK reports “Failed to Fetch”.

All configurations are default - I didn’t tweak any of the settings for this test. What am I doing wrong?? I’ve read through the docs, and I haven’t found any case that would explain what I am lacking here.

Thank you so much for your help, I am looking forward to getting this up and running for my team.

Hi @dstrohschein-equips :wave:

Im wondering if it could be a CORS issue.

Are you running your react app in Docker as well alongside Flipt in Docker (via docker compose)? Or are you running Flipt in Docker and your React app locally?

Would you be able to create an example repo that shows the problem on GitHub perchance? This would help us greatly in reproducing and fixing the issue.

Thank you!!

Hi Mark,

YES! This is exactly what it was. I had to add the commands to turn on CORS and set the origins appropriately in the docker run command. Once I did that, everything started working. Thank you!

2 Likes