颤振网页与授权代码流-工作的例子想要
我正试图获得一个适用于Android、iOS和Web的Flutter v2应用程序。我让用户登录成功，使用授权代码流与Auth0集成。
但是，对于Web版本，我尝试了几个库和指南。但是我无法让它工作，也找不到完整的工作示例。
我尝试过的库和指南：
- https://pub.dev/packages/openid_client
- https://pub.dev/packages/simple_auth
- https://github.com/MaikuB/flutter_appauth/issues/70
- https://pub.dev/packages/flutter_appauth
- https://pub.dev/packages/oauth2
- https://robinjanke1.medium.com/oauth2-with-flutter-web-e7a2b0dac7f3
是否有任何示例工作应用程序可以用作模板/起点？
共有1个答案
1.示例#1，带有包:flutter_web_auth: ^0.4.0
示例/lib/main.dart
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'dart:async';
import 'dart:io' show HttpServer;
import 'package:flutter_web_auth/flutter_web_auth.dart';
const html = """
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Grant Access to Flutter</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
html, body { margin: 0; padding: 0; }
main {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
min-height: 100vh;
font-family: -apple-system,BlinkMacSystemFont,Segoe UI,Helvetica,Arial,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol;
}
#icon {
font-size: 96pt;
}
#text {
padding: 2em;
max-width: 260px;
text-align: center;
}
#button a {
display: inline-block;
padding: 6px 12px;
color: white;
border: 1px solid rgba(27,31,35,.2);
border-radius: 3px;
background-image: linear-gradient(-180deg, #34d058 0%, #22863a 90%);
text-decoration: none;
font-size: 14px;
font-weight: 600;
}
#button a:active {
background-color: #279f43;
background-image: none;
}
</style>
</head>
<body>
<main>
<div id="icon">🏇</div>
<div id="text">Press the button below to sign in using your Localtest.me account.</div>
<div id="button"><a href="foobar://success?code=1337">Sign in</a></div>
</main>
</body>
</html>
""";
void main() => runApp(MyApp());
class MyApp extends StatefulWidget {
@override
_MyAppState createState() => _MyAppState();
}
class _MyAppState extends State<MyApp> {
String _status = '';
@override
void initState() {
super.initState();
startServer();
}
Future<void> startServer() async {
final server = await HttpServer.bind('127.0.0.1', 43823);
server.listen((req) async {
setState(() { _status = 'Received request!'; });
req.response.headers.add('Content-Type', 'text/html');
req.response.write(html);
req.response.close();
});
}
void authenticate() async {
final url = 'http://localtest.me:43823/';
final callbackUrlScheme = 'foobar';
try {
final result = await FlutterWebAuth.authenticate(url: url, callbackUrlScheme: callbackUrlScheme);
setState(() { _status = 'Got result: $result'; });
} on PlatformException catch (e) {
setState(() { _status = 'Got error: $e'; });
}
}
@override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
appBar: AppBar(
title: const Text('Web Auth example'),
),
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Text('Status: $_status\n'),
const SizedBox(height: 80),
ElevatedButton(
child: Text('Authenticate'),
onPressed: () { this.authenticate(); },
),
],
),
),
),
);
}
}
2.带有包的示例#2:openidconnect
示例/lib/main.dart
import 'package:flutter/material.dart';
import 'package:openidconnect_example/choose.dart';
void main() {
runApp(MyApp());
}
//Credentials gathered from the playground
//login: dull-moth@example.com
//password: Yawning-Octopus-58
class MyApp extends StatefulWidget {
@override
_MyAppState createState() => _MyAppState();
}
class _MyAppState extends State<MyApp> {
@override
void initState() {
super.initState();
}
@override
Widget build(BuildContext context) {
return MaterialApp(
home: ChoosePage(),
);
}
}
-
嗨，我正在探索关于azure active Directory的一些身份验证和授权流。我以前在单页应用程序中使用誓言隐式流。在阅读microsoft文档之后，我已经理解了关于隐式流的以下内容。 隐式流： 单页javacript应用程序使用隐式流从azure active Directory获得获取访问令牌。它直接调用令牌endpoint来获取令牌，因此这使得隐式流不太安全。 NET Web应用程序
-
我想更好地理解隐式授权流和授权代码授权流之间的区别，因为我不确定我目前的理解是否正确。 隐式授权流主要由前端应用程序用于验证用户身份吗？ 隐式授权流是否只需要一个client_id、用户名和密码来进行身份验证，换句话说，永远不会发送client_secret？ 授权码只是一个短期令牌吗？ 将授权码交换为访问令牌后，客户端可以访问用户帐户多长时间？具体地说，如果客户端是一个长时间运行的脚本，那么用户
-
准备工作 微哨登录是基于 OAuth 2.0 协议标准构建的第三方网站应用授权登录系统。用户在微哨门户中访问第三方网站时，网站应用可通过网页授权机制，获取用户基本信息，进而实现业务逻辑。 在进行微哨登录接入之前，开发者需要在微哨开放平台注册开发者帐号，并拥有一个已审核通过的网站应用，获得相应的 App Key 和 App Secret ；或者通过学校管理员创建校内应用，并获得相应的 App Key
-
第三方服务商网页授权有两种： 第三方应用网页授权 企业网页授权 创建实例： use EasyWeChat\work\Application; $config = [ 'corp_id' => 'xxxxxxxxxxxxxxxxx', 'secret' => 'xxxxxxxxxx', // 应用的 secret ]; $app = new Application($conf
-
此文档为企业微信内部应用开发的网页授权 企业微信官方文档 创建实例： use EasyWeChat\work\Application; $config = [ 'corp_id' => 'xxxxxxxxxxxxxxxxx', 'secret' => 'xxxxxxxxxx', // 应用的 secret ]; $app = new Application($config)
-
关于 OAuth2.0 OAuth 是一个关于授权（authorization）的开放网络标准，在全世界得到广泛应用，目前的版本是 2.0 版。 摘自：RFC 6749 步骤解释： （A）用户打开客户端以后，客户端要求用户给予授权。 （B）用户同意给予客户端授权。 （C）客户端使用上一步获得的授权，向认证服务器申请令牌。 （D）认证服务器对客户端进行认证以后，确认无误，同意发放令牌。 （E）客户端