使用Firebase集成Google登录失败，提示Illegal url for new iframe错误

核心问题 #

错误提示里的URL包含%22（双引号的URL编码），说明你的authDomain环境变量值被错误地包含了双引号，导致Firebase生成的认证iframe URL格式非法。

解决步骤 #

1. 修正.env文件的环境变量格式
   环境变量赋值不要加引号，且等号前后不要留空格，修改后的.env内容如下：

   REACT_APP_PROJECT_ID=tweets-5df
   REACT_APP_AUTH_DOMAIN=tweets-5df.firebaseapp.com
   REACT_APP_STORAGE_BUCKET=tweets-5df.appspot.com
   # 需补充完整其他缺失的环境变量（如REACT_APP_API_KEY等）
   

   原文件中REACT_APP_AUTH_DOMAIN ="tweets-5df.firebaseapp.com"的写法会让程序读取到带双引号的字符串，直接导致URL拼接错误。

2. 重启开发服务器
   React环境变量修改后必须重启开发服务器，否则旧的错误值会被继续读取。

3. 验证环境变量读取结果
   可在firebase.ts中添加日志确认：

   console.log(REACT_APP_AUTH_DOMAIN); // 应输出纯域名：tweets-5df.firebaseapp.com，不带双引号
   

补充检查 #

若修正后仍有问题，确认Firebase控制台的认证->设置->授权域中已添加当前项目的运行域名（如localhost:3000）。

内容的提问来源于stack exchange，提问作者Julia