Google 发布 flutter web 应用后无法登录

Question

我在我的 flutter web 应用程序上实现了 google 登录，它在调试模式下运行良好。我必须使用 flutter 运行 -d chrome --web-port 5000 之类的命令修复 Web 端口，因为我在 google 凭据页面

上指定了此端口

下面是我的登录页面代码

import 'package:car_of_your_dreams/Services/googleSignIn.dart';
import 'package:google_sign_in/google_sign_in.dart';
import 'package:car_of_your_dreams/Screens/Home_Screen.dart';


GoogleSignIn _googleSignIn = GoogleSignIn(
  scopes: [
    'profile',
    'email'
  ]
);

class LoginScreen extends StatefulWidget {

  @override
  State <LoginScreen> createState() => _LoginScreenState();

}

class _LoginScreenState extends State<LoginScreen> {

  late String em;
  late String pa;
  GoogleSignInAccount ? currentUser;

  @override
  void initState() {
    // TODO: implement initState
    super.initState();
    _googleSignIn.onCurrentUserChanged.listen((GoogleSignInAccount ? account) {
      setState(() {
        currentUser = account;
      });
    });
    _googleSignIn.signInSilently();
  }

  @override
  Widget build(BuildContext context) {
    return Material(
      child: RawKeyboardListener(
        autofocus: true,
        focusNode: FocusNode(),
        onKey: (event) async {
          if (event.isKeyPressed(LogicalKeyboardKey.enter)) {
            print('enter key pressed');
            var dbCredentials = await MySQL().sendResponse(em, pa);

            if (dbCredentials == 'exists') {
              Provider.of < GoogleSignInAPI > (context, listen: false).nameOfCurrentUser = em;
              Navigator.pushNamed(context, '1');
              print(dbCredentials);
            } else {
              Provider.of < CarsProvider > (context, listen: false).showToast();
              print(dbCredentials);
            }
          }
        },
        child: Scaffold(
          body: buildHomeScreen()
        ),
      )
    );
  }

  Widget buildHomeScreen() {
    if (currentUser != null) {
      Provider.of<GoogleSignInAPI>(context, listen: false).nameOfCurrentUser =
        currentUser?.displayName;
      print(Provider.of<GoogleSignInAPI>(context, listen: false).nameOfCurrentUser);
      Provider.of < GoogleSignInAPI > (context, listen: false).emailOfCurrentUser = currentUser?.email;
      MySQL().googleUp(currentUser?.displayName, currentUser?.email);
      return HomeScreen();
    } else return Container(
      decoration: BoxDecoration(color: Colors.amberAccent),
      child: Column(
        children: [
          Flexible(
            child: SingleChildScrollView(
              child: Column(
                mainAxisAlignment: MainAxisAlignment.center,
                crossAxisAlignment: CrossAxisAlignment.center,
                children: <Widget>[
                  Text('Sign in to continue', style: GoogleFonts.ubuntu(
                    textStyle: TextStyle(fontSize: 14,
                      color: Colors.white,
                      fontWeight: FontWeight.w300,
                      decoration: TextDecoration.none))),
                  SizedBox(height: 12, ),
                  FractionallySizedBox(
                    widthFactor: 0.6,
                    child: TextField(
                      onChanged: (value) {
                        Provider.of<CarsProvider>(context, listen: false).userEmail = value;
                        em = Provider.of<CarsProvider>(context, listen: false).userEmail!;

                      },
                      decoration: InputDecoration(
                        hintText: "Email",
                        border: OutlineInputBorder(),
                        focusedBorder: OutlineInputBorder(
                          borderSide: BorderSide(color: Colors.amber, width: 2)
                        ),
                        icon: Icon(Icons.email),
                        contentPadding: EdgeInsets.symmetric(horizontal: 20),
                      ),
                    ),
                  ),
                  SizedBox(height: 5, ),
                  FractionallySizedBox(
                    widthFactor: 0.6,
                    child: TextField(
                      obscureText: true,
                      onChanged: (value) {
                        Provider.of<CarsProvider>(context, listen: false).userPassword = value;
                        pa = Provider.of<CarsProvider>(context, listen: false).userPassword!;
                      },
                      decoration: InputDecoration(
                        hintText: "Password",
                        border: OutlineInputBorder(),
                        focusedBorder: OutlineInputBorder(
                          borderSide: BorderSide(color: Colors.amber, width: 2)),
                        icon: Icon(Icons.vpn_key_outlined),
                        contentPadding: EdgeInsets.symmetric(horizontal: 20), ))
                  ),
                  SizedBox(height: 10, ),
                  Row(
                    mainAxisAlignment: MainAxisAlignment.center,
                    children: [
                      TextButton(onPressed: () async {
                          var dbCredentials = await MySQL().sendResponse(em, pa);

                          if (dbCredentials == 'exists') {
                            Provider.of<GoogleSignInAPI>(context, listen: false).nameOfCurrentUser = em;
                            Navigator.pushNamed(context, '1');
                            print(dbCredentials);
                          } else {
                            Provider.of<CarsProvider>(context, listen: false).showToast();
                            print(dbCredentials);
                          }
                        },
                        child: Text('Sign in', style: GoogleFonts.londrinaSolid(
                          textStyle: TextStyle(fontSize: 25,
                            color: Colors.white,
                            fontWeight: FontWeight.w300,
                            decoration: TextDecoration.none))), ),
                      SizedBox(width: 10, ),
                      Icon(Icons.arrow_forward, color: Colors.white, )
                    ],
                  ),
                  SizedBox(height: 10, ),
                  SignInButton(Buttons.Google,
                    text: "Sign in with Google",
                    onPressed: _handleSignIn),
                  SizedBox(height: 7, ),
                  SignInButton(Buttons.Facebook,
                    text: "Sign in with Facebook",
                    onPressed: () {}),
                  SizedBox(height: 7, ),
                  TextButton(
                    onPressed: () {
                      Navigator.pushNamed(context, '-1');
                    },
                    child: Text('New user? Register..', style: GoogleFonts.londrinaSolid(
                      textStyle: TextStyle(fontSize: 20,
                        color: Colors.white,
                        fontWeight: FontWeight.w300,
                        decoration: TextDecoration.none))), ),
                  SizedBox(height: 50, ),

                ],
              ),
            ),
          ),
        ],
      ),
    );
  }

  Future<void> _handleSignIn() async {
    try {
      await _googleSignIn.signIn();
    } catch (error) {
      print(error);
    }
  }

  Future<void> handleSignOut() async {
    await _googleSignIn.disconnect();

  }
}

当我在虚拟主机上发布网络应用程序时，google 登录按钮不起作用。我收到消息 NoSuchMethodError: method not found: 'toString' on null 据推测产生此错误的 main.dart.js javascript 文件的代码行是这样的： alv(a){if(typeof dartPrint=="function"){dartPrint(a) return}if(typeof console=="object"&&typeof console.log!="undefined"){console.log(a) return

我检查了代码中可能包含 toString 部分的所有内容，但没有发现任何相关内容。我不是 javascript 专家，所以我无法理解 flutter 生成的 javascript 代码有什么问题。有什么建议吗？这是我在浏览器控制台中看到的可能产生错误的行的快照：

Answer 1

我找到了答案。我回去一步一步检查设置，我发现我把元标记 <meta name="google-signin-client_id" content="YOUR_GOOGLE_SIGN_IN_OAUTH_CLIENT_ID.apps.googleusercontent.com">

在索引页的 body 部分，我应该把它放在它的 head 部分。

Google 发布 flutter web 应用后无法登录

Google sign in does not work after publishing flutter web app

javascript

flutter

google-cloud-platform

google-signin

flutter-web