在Flutter Web中实现登录功能但避免发布
来源:stackoverflow
时间:2024-03-06 15:45:27 364浏览 收藏
“纵有疾风来,人生不言弃”,这句话送给正在学习Golang的朋友们,也希望在阅读本文《在Flutter Web中实现登录功能但避免发布》后,能够真的帮助到大家。我也会在后续的文章中,陆续更新Golang相关的技术文章,有好的建议欢迎大家在评论留言,非常感谢!
问题内容
我有一个正在构建的应用程序,并且一年内没有更改登录代码,更新后我的 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{"*"},今天带大家了解了的相关知识,希望对你有所帮助;关于Golang的技术知识我们会一点点深入介绍,欢迎大家关注golang学习网公众号,一起学习编程~
声明:本文转载于:stackoverflow 如有侵犯,请联系study_golang@163.com删除
相关阅读
更多>
-
502 收藏
-
502 收藏
-
501 收藏
-
501 收藏
-
501 收藏
最新阅读
更多>
-
139 收藏
-
204 收藏
-
325 收藏
-
478 收藏
-
486 收藏
-
439 收藏
-
357 收藏
-
352 收藏
-
101 收藏
-
440 收藏
-
212 收藏
-
143 收藏
课程推荐
更多>
-
- 前端进阶之JavaScript设计模式
- 设计模式是开发人员在软件开发过程中面临一般问题时的解决方案,代表了最佳的实践。本课程的主打内容包括JS常见设计模式以及具体应用场景,打造一站式知识长龙服务,适合有JS基础的同学学习。
- 立即学习 543次学习
-
- GO语言核心编程课程
- 本课程采用真实案例,全面具体可落地,从理论到实践,一步一步将GO核心编程技术、编程思想、底层实现融会贯通,使学习者贴近时代脉搏,做IT互联网时代的弄潮儿。
- 立即学习 516次学习
-
- 简单聊聊mysql8与网络通信
- 如有问题加微信:Le-studyg;在课程中,我们将首先介绍MySQL8的新特性,包括性能优化、安全增强、新数据类型等,帮助学生快速熟悉MySQL8的最新功能。接着,我们将深入解析MySQL的网络通信机制,包括协议、连接管理、数据传输等,让
- 立即学习 500次学习
-
- JavaScript正则表达式基础与实战
- 在任何一门编程语言中,正则表达式,都是一项重要的知识,它提供了高效的字符串匹配与捕获机制,可以极大的简化程序设计。
- 立即学习 487次学习
-
- 从零制作响应式网站—Grid布局
- 本系列教程将展示从零制作一个假想的网络科技公司官网,分为导航,轮播,关于我们,成功案例,服务流程,团队介绍,数据部分,公司动态,底部信息等内容区块。网站整体采用CSSGrid布局,支持响应式,有流畅过渡和展现动画。
- 立即学习 485次学习