I'm building a flutter app where I will be taking a users' card details and tokenizing them. Currently, the API key for my payment provider is in the client app. The reason for this is to prevent having to send the credit card details to my server and then sending them to the payment provider. All in the name of PCI compliance.

It is however, ubiquitously stated, that you never want to store any API Keys in the client app which I understand. The question is, what's the best way to go about this? My instincts say to move the API key to the server, and just send the card details once for the tokenization. However, is this making the road to PCI compliance harder?

Any guidance on this would be appreciated.

Thanks