首页 > 文章列表 > 如何实施 Flutter Web 的登录功能,但不进行发布

如何实施 Flutter Web 的登录功能,但不进行发布

263 2024-05-08
问题内容

我有一个正在构建的应用程序,并且一年内没有更改登录代码,更新后我的 flutter 登录页面将请求 OPTIONS 并且 go API 服务器返回 200。以前,服务器中没有出现 OPTIONS 日志。这种情况发生在开发和生产中。我的 Linux 客户端登录正常。

我在这里进行了 CORS 更改,但没有效果。 GET 请求工作正常,但从来没有 POST 请求到达服务器。

这是我的错误:

ClientException: XMLHttpRequest error., uri=https://api.mydomain.com/login

这是我的服务器端代码。

r := chi.NewRouter()

r.Use(middleware.RequestID)
r.Use(middleware.Logger)
r.Use(middleware.Recoverer)
r.Use(middleware.URLFormat)
r.Use(render.SetContentType(render.ContentTypeJSON))
r.Use(cors.Handler(cors.Options{
    AllowedOrigins:   []string{"https://*, http://*"},
    AllowedMethods:   []string{"GET", "POST", "PUT", "DELETE", "OPTIONS"},
    AllowedHeaders:   []string{"Accept", "Origin", "Authorization", "Content-Type", "X-CSRF-Token", "X-Requested-With"},
    ExposedHeaders:   []string{"Link"},
    AllowCredentials: false,
    MaxAge:           300, // Maximum value not ignored by any of major browsers
}))

这是我的颤振登录信息:

Future<bool> login(String email, String password, String fcmToken) async {
 try {
  var response = await http.post(
    Uri.parse("$_baseUrl/login"),
    headers: <String, String>{
      'Content-Type': 'application/json; charset=UTF-8',
    },
    body: jsonEncode(
      <String, String>{
        'business_email': email,
        'password': password,
        'token': fcmToken,
      },
    ),
  );

  if (response.statusCode == 200) {
    String jwt = response.body;

    await storage.write(key: 'jwt', value: jwt);

    return true;
  }
} catch (e) {
  logger.d(e);
  return false;
}

return false;
}

我的登录页面

class Login extends StatefulWidget {
  const Login({
    Key? key,
  }) : super(key: key);

  @override
  State<Login> createState() => _LoginState();
}

class _LoginState extends State<Login> {
  @override
  void initState() {
    WidgetsBinding.instance.addPostFrameCallback(
      (_) => showSnackBar(context),
    );

    super.initState();
  }

  final GlobalKey<FormState> _formKey = GlobalKey();

  final FocusNode _focusNodePassword = FocusNode();
  final TextEditingController _controllerUserEmail = TextEditingController();
  final TextEditingController _controllerPassword = TextEditingController();

  bool _obscurePassword = true;

  bool isLoading = false;

  String? fcmToken = '';

  @override
  Widget build(BuildContext context) {
    var model = LoginModel(
      authenticationService: Provider.of(context, listen: false),
    );

    return Scaffold(
      body: Form(
        key: _formKey,
        child: SingleChildScrollView(
          padding: const EdgeInsets.all(30.0),
          child: Column(
            children: [
              const SizedBox(
                height: 20,
              ),
              SizedBox(
                  //height: 20,
                  width: double.infinity,
                  child: Text(
                    'exactCASE',
                    textAlign: TextAlign.center,
                    style: Theme.of(context).textTheme.headlineLarge,
                  )),
              const SizedBox(height: 30),
              isLoading
                  ? const Center(child: CircularProgressIndicator())
                  : Text(
                      'Login to your account',
                      style: Theme.of(context).textTheme.labelMedium,
                    ),
              const SizedBox(height: 20),
              TextFormField(
                controller: _controllerUserEmail,
                keyboardType: TextInputType.name,
                decoration: InputDecoration(
                  labelText: 'Email',
                  prefixIcon: const Icon(Icons.person_outline),
                  border: OutlineInputBorder(
                    borderRadius: BorderRadius.circular(10),
                  ),
                  enabledBorder: OutlineInputBorder(
                    borderRadius: BorderRadius.circular(10),
                  ),
                ),
                onEditingComplete: () => _focusNodePassword.requestFocus(),
                validator: (String? value) {
                  if (value == null || value.isEmpty) {
                    return "Please enter your email";
                  }
                  return null;
                },
              ),
              const SizedBox(height: 10),
              TextFormField(
                controller: _controllerPassword,
                focusNode: _focusNodePassword,
                obscureText: _obscurePassword,
                keyboardType: TextInputType.visiblePassword,
                decoration: InputDecoration(
                  labelText: "Password",
                  prefixIcon: const Icon(Icons.password_outlined),
                  suffixIcon: IconButton(
                      onPressed: () {
                        setState(() {
                          _obscurePassword = !_obscurePassword;
                        });
                      },
                      icon: _obscurePassword
                          ? const Icon(Icons.visibility_outlined)
                          : const Icon(Icons.visibility_off_outlined)),
                  border: OutlineInputBorder(
                    borderRadius: BorderRadius.circular(10),
                  ),
                  enabledBorder: OutlineInputBorder(
                    borderRadius: BorderRadius.circular(10),
                  ),
                ),
                validator: (String? value) {
                  if (value == null || value.isEmpty) {
                    return "Please enter password.";
                  }

                  return null;
                },
              ),
              const SizedBox(height: 30),
              Column(
                children: [
                  FilledButton(
                    style: FilledButton.styleFrom(
                      minimumSize: const Size.fromHeight(50),
                      shape: RoundedRectangleBorder(
                        borderRadius: BorderRadius.circular(20),
                      ),
                    ),
                    onPressed: () {
                      if (_formKey.currentState?.validate() ?? false) {
                        _login(context, model, _controllerUserEmail.text,
                            _controllerPassword.text);
                      }
                    },
                    child: const Text("Login"),
                  ),
                ],
              ),
            ],
          ),
        ),
      ),
    );
  }

  @override
  void dispose() {
    _focusNodePassword.dispose();
    _controllerUserEmail.dispose();
    _controllerPassword.dispose();
    super.dispose();
  }

  Future<void> _login(BuildContext context, LoginModel model, String email,
      String password) async {
    final navigator = Navigator.of(context);

    if (defaultTargetPlatform != TargetPlatform.linux &&
        defaultTargetPlatform != TargetPlatform.windows) {
      fcmToken = await FirebaseMessaging.instance.getToken();
    }

    setState(
      () {
        isLoading = true;
      },
    );

    fcmToken ??= '';

    var loginSuccess = await model.login(email, password, fcmToken!);

    if (loginSuccess) {
      navigator.pushNamed(RoutePaths.homeTabs);
    } else {
      setState(
        () {
          isLoading = false;
          final snackBar = SnackBar(
              content: const Text('Login Failed!'),
              action: SnackBarAction(
                label: 'OK',
                onPressed: () {},
              ));

          ScaffoldMessenger.of(context).showSnackBar(snackBar);
        },
      );
    }
  }
}


正确答案


根据 的文档Access-Control-Allow-Origin 源响应应该是单个 URL(即请求者)或单个字符 *

尝试改变:

AllowedOrigins:   []string{"https://*, http://*"},

AllowedOrigins:   []string{"*"},