Skip to content

Commit 20da007

Browse files
ArgoZhangArgoZhang
authored
doc(ITotpService): add sample code (#5912)
* chore: 更新解决方案依赖 * chore: 增加 Otp 服务 * chore: bump version 9.5.11 * refactor: 更新默认值 * doc: 更新示例 * chore: bump version 9.5.12 * doc: 增加本地化 * doc: 更改示例文档名称 * doc: 更新文档 * doc: 增加使用步骤 * doc: 更新文档 * refactor: 更新参数默认值
1 parent a5803ed commit 20da007

File tree

13 files changed

+96
-71
lines changed

13 files changed

+96
-71
lines changed

‎BootstrapBlazor.sln‎

Lines changed: 0 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -78,8 +78,6 @@ Project("{2150E333-8FDC-42A3-9474-1A3956D46DE8}") = "tools", "tools", "{9BAF50BE
7878
EndProject
7979
Project("{FAE04EC0-301F-11D3-BF4B-00C04F79EFBC}") = "UnitTest.Benchmarks", "tools\Benchmarks\UnitTest.Benchmarks.csproj", "{3E6D8D0E-5A36-4CFD-8612-7D64E3FFE7B1}"
8080
EndProject
81-
Project("{FAE04EC0-301F-11D3-BF4B-00C04F79EFBC}") = "BootstrapBlazor.Authenticator", "..\BootstrapBlazor.Extensions\src\components\BootstrapBlazor.Authenticator\BootstrapBlazor.Authenticator.csproj", "{51641ADB-69FA-6DDF-F83F-FEA0C5AFFD88}"
82-
EndProject
8381
Global
8482
GlobalSection(SolutionConfigurationPlatforms) = preSolution
8583
Debug|Any CPU = Debug|Any CPU
@@ -114,10 +112,6 @@ Global
114112
{3E6D8D0E-5A36-4CFD-8612-7D64E3FFE7B1}.Debug|Any CPU.Build.0 = Debug|Any CPU
115113
{3E6D8D0E-5A36-4CFD-8612-7D64E3FFE7B1}.Release|Any CPU.ActiveCfg = Release|Any CPU
116114
{3E6D8D0E-5A36-4CFD-8612-7D64E3FFE7B1}.Release|Any CPU.Build.0 = Release|Any CPU
117-
{51641ADB-69FA-6DDF-F83F-FEA0C5AFFD88}.Debug|Any CPU.ActiveCfg = Debug|Any CPU
118-
{51641ADB-69FA-6DDF-F83F-FEA0C5AFFD88}.Debug|Any CPU.Build.0 = Debug|Any CPU
119-
{51641ADB-69FA-6DDF-F83F-FEA0C5AFFD88}.Release|Any CPU.ActiveCfg = Release|Any CPU
120-
{51641ADB-69FA-6DDF-F83F-FEA0C5AFFD88}.Release|Any CPU.Build.0 = Release|Any CPU
121115
EndGlobalSection
122116
GlobalSection(SolutionProperties) = preSolution
123117
HideSolutionNode = FALSE
@@ -134,7 +128,6 @@ Global
134128
{D8AEAFE7-10AF-4A5B-BC67-FE740A2CA1DF} = {7C1D79F1-87BC-42C1-BD5A-CDE4044AC1BD}
135129
{C075C6C8-B9CB-4AC0-9BDF-B2002B4AB99C} = {EA765165-0542-41C8-93F2-85787FEDEDFF}
136130
{3E6D8D0E-5A36-4CFD-8612-7D64E3FFE7B1} = {9BAF50BE-141D-4429-93A9-942F373D1F68}
137-
{51641ADB-69FA-6DDF-F83F-FEA0C5AFFD88} = {A2182155-43ED-44C1-BF6F-1B70EBD2DFFE}
138131
EndGlobalSection
139132
GlobalSection(ExtensibilityGlobals) = postSolution
140133
SolutionGuid = {0DCB0756-34FA-4FD0-AE1D-D3F08B5B3A6B}

‎src/BootstrapBlazor.Server/BootstrapBlazor.Server.csproj‎

Lines changed: 2 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -21,6 +21,7 @@
2121

2222
<ItemGroup>
2323
<PackageReference Include="BootstrapBlazor.AntDesignIcon" Version="9.0.3" />
24+
<PackageReference Include="BootstrapBlazor.Authenticator" Version="9.0.0" />
2425
<PackageReference Include="BootstrapBlazor.AzureOpenAI" Version="9.0.0" />
2526
<PackageReference Include="BootstrapBlazor.AzureTranslator" Version="9.0.0" />
2627
<PackageReference Include="BootstrapBlazor.BaiduSpeech" Version="9.0.0" />
@@ -50,6 +51,7 @@
5051
<PackageReference Include="BootstrapBlazor.MaterialDesign" Version="9.0.1" />
5152
<PackageReference Include="BootstrapBlazor.MeiliSearch" Version="9.1.9" />
5253
<PackageReference Include="BootstrapBlazor.Mermaid" Version="9.0.4" />
54+
<PackageReference Include="BootstrapBlazor.Middleware" Version="9.0.0" />
5355
<PackageReference Include="BootstrapBlazor.MindMap" Version="9.1.6" />
5456
<PackageReference Include="BootstrapBlazor.MouseFollower" Version="9.0.1" />
5557
<PackageReference Include="BootstrapBlazor.OctIcon" Version="9.0.4" />
@@ -69,16 +71,11 @@
6971
<PackageReference Include="BootstrapBlazor.UniverSheet" Version="9.0.3" />
7072
<PackageReference Include="BootstrapBlazor.VideoPlayer" Version="9.0.3" />
7173
<PackageReference Include="BootstrapBlazor.WinBox" Version="9.0.7" />
72-
</ItemGroup>
73-
74-
<ItemGroup>
75-
<PackageReference Include="BootstrapBlazor.Middleware" Version="9.0.0" />
7674
<PackageReference Include="Longbow.Logging" Version="9.0.0" />
7775
<PackageReference Include="Longbow.Tasks" Version="9.0.0" />
7876
</ItemGroup>
7977

8078
<ItemGroup>
81-
<ProjectReference Include="..\..\..\BootstrapBlazor.Extensions\src\components\BootstrapBlazor.Authenticator\BootstrapBlazor.Authenticator.csproj" />
8279
<ProjectReference Include="..\BootstrapBlazor\BootstrapBlazor.csproj" />
8380
</ItemGroup>
8481

‎src/BootstrapBlazor.Server/Components/Samples/Authenticators.razor‎

Lines changed: 0 additions & 39 deletions
This file was deleted.

‎src/BootstrapBlazor.Server/Components/Samples/OtpServices.razor‎

Lines changed: 56 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,56 @@
1+
@page "/otp-service"
2+
3+
<HeadContent>
4+
<style>
5+
.qrcode {
6+
display: flex;
7+
justify-content: center;
8+
}
9+
10+
.progress {
11+
max-width: 500px;
12+
margin: 0 auto;
13+
}
14+
15+
.opt-progress-label {
16+
position: absolute;
17+
top: 50%;
18+
left: 50%;
19+
transform: translate(-50%, -50%);
20+
font-size: 0.75rem;
21+
color: var(--bs-body-color);
22+
}
23+
</style>
24+
</HeadContent>
25+
26+
<h3>@Localizer["Title"]</h3>
27+
28+
<h4>@Localizer["SubTitle"]</h4>
29+
30+
<PackageTips Name="BootstrapBlazor.Authenticator"></PackageTips>
31+
32+
<DemoBlock Title="@Localizer["BaseUsageTitle"]" Introduction="@Localizer["BaseUsageIntro"]" Name="Normal">
33+
<QRCode Content="@_content" Width="190" class="mb-3"></QRCode>
34+
<OtpInput Value="@_code" IsReadonly="true" class="text-center mb-3"></OtpInput>
35+
<div class="position-relative">
36+
<BootstrapBlazor.Components.Progress Value="@_progress" IsShowValue="false"></BootstrapBlazor.Components.Progress>
37+
<span class="opt-progress-label">@_remain</span>
38+
</div>
39+
</DemoBlock>
40+
41+
<p class="code-label mt-3">1. 服务注入</p>
42+
43+
<Pre>[Inject]
44+
[NotNull]
45+
private ITotpService? TotpService { get; set; }</Pre>
46+
47+
<p class="code-label">2. 生成二维码</p>
48+
<p>调用 <code>TotpService</code> 实例方法 <code>GenerateOtpUri</code> 得到二维码内容，配合二维码组件 <code>QRCode</code> 显示二维码</p>
49+
50+
<p class="code-label">3. 使用 <code>Microsoft Authenticator</code> <code>Google Authenticator</code> 等支持 <b>TOTP</b> 协议的软件，扫描二维码</p>
51+
52+
<p class="code-label">4. 验证逻辑</p>
53+
54+
<p>网页内使用 <code>OtpInput</code> 让用户填写手机 <code>App</code> 终端的密码，后台通过调用 <code>TotpService</code> 实例方法 <code>Compute</code> 得到当前时间窗口内的密码，与客户录入的比对，如果一致则密码正确</p>
55+
56+
<div>通过使用本服务可以很方便的构建 <code>2FA</code> 应用</div>

‎src/BootstrapBlazor.Server/Components/Samples/Authenticators.razor.cs‎ renamed to ‎src/BootstrapBlazor.Server/Components/Samples/OtpServices.razor.cs‎

Lines changed: 12 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -7,13 +7,13 @@
77
namespace BootstrapBlazor.Server.Components.Samples;
88

99
/// <summary>
10-
/// Authenticators sample
10+
/// OtpServices sample
1111
/// </summary>
12-
public partial class Authenticators
12+
public partial class OtpServices
1313
{
1414
[Inject]
1515
[NotNull]
16-
private IStringLocalizer<Anchors>? Localizer { get; set; }
16+
private IStringLocalizer<OtpServices>? Localizer { get; set; }
1717

1818
[Inject]
1919
[NotNull]
@@ -34,7 +34,15 @@ protected override void OnInitialized()
3434
{
3535
base.OnInitialized();
3636

37-
_content = TotpService.GenerateOtpUri();
37+
_content = TotpService.GenerateOtpUri(new OtpOptions()
38+
{
39+
AccountName = "BootstrapBlazor",
40+
IssuerName = "BootstrapBlazor",
41+
UserName = "Simulator",
42+
SecretKey = "OMM2LVLFX6QJHMYI",
43+
Algorithm = OtpHashMode.Sha1,
44+
Type = OtpType.Totp
45+
});
3846
_code = TotpService.Compute("OMM2LVLFX6QJHMYI");
3947
}
4048

‎src/BootstrapBlazor.Server/Extensions/MenusLocalizerExtensions.cs‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1538,6 +1538,12 @@ void AddServices(DemoMenuItem item)
15381538
Url = "theme-provider"
15391539
},
15401540
new()
1541+
{
1542+
IsNew = true,
1543+
Text = Localizer["TotpService"],
1544+
Url = "otp-service"
1545+
},
1546+
new()
15411547
{
15421548
Text = Localizer["Title"],
15431549
Url = "title"

‎src/BootstrapBlazor.Server/Extensions/ServiceCollectionSharedExtensions.cs‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -30,8 +30,8 @@ public static IServiceCollection AddBootstrapBlazorServices(this IServiceCollect
3030
services.AddSingleton<MenuService>();
3131
services.AddScoped<FanControllerDataService>();
3232

33-
// 增加 Authenticator 服务
34-
services.AddBootstrapBlazorAuthenticator();
33+
// 增加 ITotpService 服务
34+
services.AddBootstrapBlazorTotpService();
3535

3636
// 增加示例网站配置
3737
services.AddOptionsMonitor<WebsiteOptions>();

‎src/BootstrapBlazor.Server/Locales/en-US.json‎

Lines changed: 6 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -4920,7 +4920,7 @@
49204920
"UniverSheet": "UniverSheet",
49214921
"ShieldBadge": "ShieldBadge",
49224922
"OtpInput": "OtpInput",
4923-
"Authenticator": "Authenticator"
4923+
"TotpService": "ITotpService"
49244924
},
49254925
"BootstrapBlazor.Server.Components.Samples.Table.TablesHeader": {
49264926
"TablesHeaderTitle": "Header grouping function",
@@ -7103,8 +7103,10 @@
71037103
"OtpInputsValidateFormTitle": "ValidateForm",
71047104
"OtpInputsValidateFormIntro": "When the password is not provided, click the Submit button, the password box will be displayed in red and it will be prompted that it cannot be empty."
71057105
},
7106-
"BootstrapBlazor.Server.Components.Samples.Authenticators": {
7107-
"Title": "Authenticator",
7108-
"SubTitle": "An implementation TOTP RFC 6238 and HOTP RFC 4226 Authenticator service."
7106+
"BootstrapBlazor.Server.Components.Samples.OtpServices": {
7107+
"Title": "ITotpService",
7108+
"SubTitle": "An implementation TOTP RFC 6238 and HOTP RFC 4226 Authenticator service.",
7109+
"BaseUsageTitle": "Basic usage",
7110+
"BaseUsageIntro": "By calling the <code>Compute</code> method of the <code>ITotpService</code> service instance, you can get the password in the current time window. By calling the <code>Instance.GetRemainingSeconds</code> method, you can display the remaining validity time of the current password. In this example, the progress bar is used for dynamic display."
71097111
}
71107112
}

‎src/BootstrapBlazor.Server/Locales/zh-CN.json‎

Lines changed: 6 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -4920,7 +4920,7 @@
49204920
"UniverSheet": "表格组件 UniverSheet",
49214921
"ShieldBadge": "徽章组件 ShieldBadge",
49224922
"OtpInput": "验证码输入框 OtpInput",
4923-
"Authenticator": "密码验证服务 Authenticator"
4923+
"TotpService": "时间密码验证服务 ITotpService"
49244924
},
49254925
"BootstrapBlazor.Server.Components.Samples.Table.TablesHeader": {
49264926
"TablesHeaderTitle": "表头分组功能",
@@ -7103,8 +7103,10 @@
71037103
"OtpInputsValidateFormTitle": "表单内使用",
71047104
"OtpInputsValidateFormIntro": "密码未提供值时，点击提交按钮，密码框显示为红色，并且提示不可为空"
71057105
},
7106-
"BootstrapBlazor.Server.Components.Samples.Authenticators": {
7107-
"Title": "Authenticator 密码验证服务",
7108-
"SubTitle": "实现 TOTP RFC 6238 和 HOTP RFC 4226 认证器服务"
7106+
"BootstrapBlazor.Server.Components.Samples.OtpServices": {
7107+
"Title": "ITotpService 时间密码验证服务",
7108+
"SubTitle": "实现 TOTP RFC 6238 和 HOTP RFC 4226 认证器服务",
7109+
"BaseUsageTitle": "基本用法",
7110+
"BaseUsageIntro": "通过调用 <code>ITotpService</code> 服务实例方法 <code>Compute</code> 得到当前时间窗口内密码, 通过调用 <code>Instance.GetRemainingSeconds</code> 方法可以显示当前密码剩余有效时间，本例中通过进度条进行动态显示"
71097111
}
71107112
}

‎src/BootstrapBlazor.Server/docs.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -230,7 +230,7 @@
230230
"univer-sheet": "UniverSheets",
231231
"shield-badge": "ShieldBadges",
232232
"opt-input": "OtpInputs",
233-
"authenticator": "Authenticators"
233+
"otp-service": "OtpServices"
234234
},
235235
"video": {
236236
"table": "BV1ap4y1x7Qn?p=1",

0 commit comments

Comments
 (0)