openai api key automatically rotating when deployed – Reactjs

I’m building a webpage using openai gpt api in reactjs. I saved my api key on .env file then gitignored it. And I deployed my code with gh-pages, but openai detects it and rotate the key automatically. How can I use api key properly?

const DEFAULT_PARAMS = {
            model: "gpt-3.5-turbo",
            messages: [{"role": "user",
                        "content": message
            }],
            temperature: 1,
            max_tokens: 1000
        };
        const params_ = {...DEFAULT_PARAMS};
        const result = await fetch('https://api.openai.com/v1/chat/completions', {
            method: 'POST',
            headers: {
                'Content-Type': 'application/json',
                'Authorization': 'Bearer ' + String(process.env.REACT_APP_OPENAI_API_KEY)
            },
            body: JSON.stringify(params_)
        });
        const data = await result.json()