Vert.x-Web

router.route().handler(BodyHandler.create());

router.post("/some/path/uploads").handler(ctx -> {

  List<FileUpload> uploads = ctx.fileUploads();
  // 使用uploads做一些事情

});

Cookie someCookie = ctx.request().getCookie("mycookie");
String cookieValue = someCookie.getValue();

// 使用cookie做一些事情

// 添加一个cookie——它将自动写回到响应中
ctx.response().addCookie(Cookie.cookie("othercookie", "somevalue"));

Router router = Router.router(vertx);

//使用默认配置创建一个集群session储存器
SessionStore store = ClusteredSessionStore.create(vertx);

SessionHandler sessionHandler = SessionHandler.create(store);

// session处理器控制用于session的cookie
// 举个例子，它可以包含同站策略（译者注：即samesite policy）的配置
// 比如这个，使用严格模式的同站策略
sessionHandler.setCookieSameSite(CookieSameSite.STRICT);

// 确保所有请求都可以路由经过这个session处理器
router.route().handler(sessionHandler);

// 现在您的应用程序可以开始处理了
router.route("/somepath/blah/").handler(ctx -> {

  Session session = ctx.session();
  session.put("foo", "bar");
  // 等等

});

router.route().handler(sessionHandler);

//现在是您的程序在处理
router.route("/somepath/blah").handler(ctx -> {

  Session session = ctx.session();

  // 放置一些数据到session中
  session.put("foo", "bar");

  // 从session获取数据
  int age = session.get("age");

  // 从session中移除数据
  JsonObject obj = session.remove("myobj");

});

router.route().handler(SessionHandler.create(LocalSessionStore.create(vertx)));

AuthenticationHandler basicAuthHandler = BasicAuthHandler.create(authProvider);

router.route().handler(SessionHandler.create(LocalSessionStore.create(vertx)));

AuthenticationHandler basicAuthHandler = BasicAuthHandler.create(authProvider);

// 所有以'/private/'路径开头的请求都会被保护
router.route("/private/*").handler(basicAuthHandler);

router.route("/someotherpath").handler(ctx -> {

  // 这里是公开访问的地方 —— 不需要登录

});

router.route("/private/somepath").handler(ctx -> {

  // 这里需要登录

  // 这里的值为true
  boolean isAuthenticated = ctx.user() != null;

});

router.route().handler(SessionHandler.create(LocalSessionStore.create(vertx)));

// 所有以'/private/'路径开头的请求都会被保护
router
  .route("/private/*")
  .handler(RedirectAuthHandler.create(authProvider));

// 处理实际的登录请求
// 您其中一个页面必须要POST表单登陆数据
router.post("/login").handler(FormLoginHandler.create(authProvider));

// 设置静态服务器处理静态资源
router.route().handler(StaticHandler.create());

router
  .route("/someotherpath")
  .handler(ctx -> {
    //  这里是公开访问的地方 —— 不需要登录
  });

router
  .route("/private/somepath")
  .handler(ctx -> {

    // 这里需要登录

    // 这里的值是true
    boolean isAuthenticated = ctx.user() != null;

  });

Router router = Router.router(vertx);

JWTAuthOptions authConfig = new JWTAuthOptions()
  .setKeyStore(new KeyStoreOptions()
    .setType("jceks")
    .setPath("keystore.jceks")
    .setPassword("secret"));

JWTAuth jwt = JWTAuth.create(vertx, authConfig);

router.route("/login").handler(ctx -> {
 //这是个例子，身份认证应当使用其他的提供者
  if (
    "paulo".equals(ctx.request().getParam("username")) &&
      "secret".equals(ctx.request().getParam("password"))) {
    ctx.response()
      .end(jwt.generateToken(new JsonObject().put("sub", "paulo")));
  } else {
    ctx.fail(401);
  }
});

Router router = Router.router(vertx);

JWTAuthOptions authConfig = new JWTAuthOptions()
  .setKeyStore(new KeyStoreOptions()
    .setType("jceks")
    .setPath("keystore.jceks")
    .setPassword("secret"));

JWTAuth authProvider = JWTAuth.create(vertx, authConfig);

router.route("/protected/*").handler(JWTAuthHandler.create(authProvider));

router.route("/protected/somepage").handler(ctx -> {
  // 一些处理器代码
});

JWTAuthOptions authConfig = new JWTAuthOptions()
  .setKeyStore(new KeyStoreOptions()
    .setType("jceks")
    .setPath("keystore.jceks")
    .setPassword("secret"));

JWTAuth authProvider = JWTAuth.create(vertx, authConfig);

authProvider
  .generateToken(
    new JsonObject()
      .put("sub", "paulo")
      .put("someKey", "some value"),
    new JWTOptions());

Handler<RoutingContext> handler = ctx -> {
  String theSubject = ctx.user().principal().getString("sub");
  String someKey = ctx.user().principal().getString("someKey");
};

router.route().handler(
  // 创建将执行认证的处理器
  AuthorizationHandler.create(
    // 认证什么
    PermissionBasedAuthorization.create("can-do-work"))
    // 在哪里查找用户的授权
    .addAuthorizationProvider(authProvider));

router.route("/listproducts/*").handler(
  // 创建将执行认证的处理器
  AuthorizationHandler.create(
    // 认证什么
    PermissionBasedAuthorization.create("list_products"))
    // 在哪里查找用户的授权
    .addAuthorizationProvider(authProvider));

// 只有 "admin"可以访问 /private/settings
router.route("/private/settings/*").handler(
  // 创建将执行认证的处理器
  AuthorizationHandler.create(
    // 认证什么
    RoleBasedAuthorization.create("admin"))
    .addAuthorizationProvider(authProvider));

ChainAuthHandler chain = ChainAuthHandler.any();

// 将http basic认证处理器添加到处理器链路中
chain.add(BasicAuthHandler.create(provider));
// 将表单重定向认证处理器添加到处理器链路中
chain.add(RedirectAuthHandler.create(provider));

// 保护您的路由
router.route("/secure/resource").handler(chain);
// 您的app
router.route("/secure/resource").handler(ctx -> {
  // 做一些事情
});

ChainAuthHandler chain =
  ChainAuthHandler.any()
    .add(authNHandlerA)
    .add(ChainAuthHandler.all()
      .add(authNHandlerB)
      .add(authNHandlerC));

// 保护您的代码
router.route("/secure/resource").handler(chain);
// 您的app
router.route("/secure/resource").handler(ctx -> {
  // 做一些事情
});

The request path is @{context.request().path()}

The variable 'foo' from the session is @{context.session().get('foo')}

The value 'bar' from the context data is @{context.get('bar')}

!!! 5
html
 head
   title= context.get('foo') + context.request().path()
 body

TemplateHandler handler = TemplateHandler.create(engine);

router.get("/dynamic").handler(ctx -> {

  ctx.put("request_path", ctx.request().path());
  ctx.put("session_data", ctx.session().data());

  ctx.next();
});

router.get("/dynamic/").handler(handler);

[snip]
<p th:text="${context.get('foo')}"></p>
<p th:text="${context.get('bar')}"></p>
<p th:text="${context.normalizedPath()}"></p>
<p th:text="${context.request().params().get('param1')}"></p>
<p th:text="${context.request().params().get('param2')}"></p>
[snip]

[snip]
<p th:text="${context.foo}"></p>
<p th:text="${context.bar}"></p>
<p th:text="${context.normalizedPath()}"></p>
<p th:text="${context.request().params().param1}"></p>
<p th:text="${context.request().params().param2}"></p>
[snip]

[snip]
<p th:text="{{context.foo}}"></p>
<p th:text="{{context.bar}}"></p>
<p th:text="{{context.normalizedPath()}}"></p>
<p th:text="{{context.request().params().param1}}"></p>
<p th:text="{{context.request().params().param2}}"></p>
[snip]

[snip]
final JsonObject context = new JsonObject()
 .put("foo", "badger")
 .put("bar", "fox")
 .put("context", new JsonObject().put("path", "/foo/bar"));

engine.render(context, "somedir/TestRockerTemplate2", render -> {
 // (...)
});
[snip]

@import io.vertx.core.json.JsonObject
@args (JsonObject context, String foo, String bar)
Hello @foo and @bar
Request path is @context.getString("path")

[snip]
TemplateEngine engine = HTTLTemplateEngine.create(vertx);
final JsonObject context = new JsonObject()
 .put("foo", "badger")
 .put("bar", "fox");

engine.render(context, "somedir/test-httl-template1.httl", render -> {
 // (...)
});
[snip]

<!-- #set(String foo, String bar) -->
Hello ${foo} and ${bar}

[snip]
TemplateEngine engine = RythmTemplateEngine.create(vertx);
final JsonObject context = new JsonObject()
 .put("foo", "badger")
 .put("bar", "fox");

engine.render(context, "somedir/test-rythm-template1.html", render -> {
 // (...)
});
[snip]

<!-- #set(String foo, String bar) -->
Hello @foo and @bar

Router router = Router.router(vertx);

SockJSHandlerOptions options = new SockJSHandlerOptions()
  .setHeartbeatInterval(2000);

SockJSHandler sockJSHandler = SockJSHandler.create(vertx, options);

Router router = Router.router(vertx);

SockJSHandlerOptions options = new SockJSHandlerOptions()
  .setHeartbeatInterval(2000);

SockJSHandler sockJSHandler = SockJSHandler.create(vertx, options);

router.route("/myapp/*")
  .subRouter(sockJSHandler.socketHandler(sockJSSocket -> {

  // 将数据回写
  sockJSSocket.handler(sockJSSocket::write);

}));

<html>
<head>
 <script src="https://unpkg.io/sockjs-client@1.5.0/dist/sockjs.min.js"></script>
</head>
<body>
 ...
</body>
</html>

var sock = new SockJS('http://mydomain.com/myapp');

sock.onopen = function() {
 console.log('open');
};

sock.onmessage = function(e) {
 console.log('message', e.data);
};

sock.onevent = function(event, message) {
 console.log('event: %o, message:%o', event, message);
 return true; // 为了标记消息已被处理了
};

sock.onunhandled = function(json) {
 console.log('this message has no address:', json);
};

sock.onclose = function() {
 console.log('close');
};

sock.send('test');

sock.close();

Router router = Router.router(vertx);

SockJSHandlerOptions options = new SockJSHandlerOptions()
  .setRegisterWriteHandler(true);

SockJSHandler sockJSHandler = SockJSHandler.create(vertx, options);

router.route("/myapp/*")
  .subRouter(sockJSHandler.socketHandler(sockJSSocket -> {

  // 获取 writeHandlerID 并将其存放 (例如放在本地 map 里)
  String writeHandlerID = sockJSSocket.writeHandlerID();

}));

eventBus.send(writeHandlerID, Buffer.buffer("foo"));

Router router = Router.router(vertx);

SockJSHandler sockJSHandler = SockJSHandler.create(vertx);


// 允许客户端向地址 `demo.orderMgr` 发送消息
PermittedOptions inboundPermitted1 = new PermittedOptions()
  .setAddress("demo.orderMgr");

// 允许客户端向地址 `demo.persistor` 发送
// 包含有 `action` 的值为 `find`、
// `collecton` 的值为 `albums` 的消息。
PermittedOptions inboundPermitted2 = new PermittedOptions()
  .setAddress("demo.persistor")
  .setMatch(new JsonObject().put("action", "find")
    .put("collection", "albums"));

// 允许 `wibble` 值为 `foo` 的消息。
PermittedOptions inboundPermitted3 = new PermittedOptions()
  .setMatch(new JsonObject().put("wibble", "foo"));

// 让我们定义 服务端 -> 客户端 发送消息匹配规则

// 允许向客户端发送地址为 `ticker.mystock` 的消息
PermittedOptions outboundPermitted1 = new PermittedOptions()
  .setAddress("ticker.mystock");

// 允许向客户端发送地址以 `news.` 开头的消息
//（例如 news.europe, news.usa, 等）
PermittedOptions outboundPermitted2 = new PermittedOptions()
  .setAddressRegex("news\\..+");

// 让我们定义 客户端 -> 客户端 发送消息匹配规则
SockJSBridgeOptions options = new SockJSBridgeOptions().
  addInboundPermitted(inboundPermitted1).
  addInboundPermitted(inboundPermitted1).
  addInboundPermitted(inboundPermitted3).
  addOutboundPermitted(outboundPermitted1).
  addOutboundPermitted(outboundPermitted2);

// 将连接桥挂载到路由器上
router
  .route("/eventbus/*")
  .subRouter(sockJSHandler.bridge(options));

PermittedOptions inboundPermitted = new PermittedOptions()
  .setAddress("demo.orderService");

// 仅限用户已登录并且拥有权限 `place_orders`
inboundPermitted.setRequiredAuthority("place_orders");

SockJSBridgeOptions options = new SockJSBridgeOptions()
  .addInboundPermitted(inboundPermitted);

Router router = Router.router(vertx);

// 允许客户端向 `demo.orderService` 发送消息
PermittedOptions inboundPermitted = new PermittedOptions()
  .setAddress("demo.orderService");

// 仅限用户已登录并且拥有权限 `place_orders`
inboundPermitted.setRequiredAuthority("place_orders");

SockJSHandler sockJSHandler = SockJSHandler.create(vertx);

// 设置基础认证处理器：

router.route().handler(SessionHandler.create(LocalSessionStore.create(vertx)));

AuthenticationHandler basicAuthHandler = BasicAuthHandler.create(authProvider);

router.route("/eventbus/*").handler(basicAuthHandler);

// 将连接桥挂载到路由器上
router
  .route("/eventbus/*")
  .subRouter(sockJSHandler.bridge(new SockJSBridgeOptions()
    .addInboundPermitted(inboundPermitted)));

{
 "type": "send"|"publish"|"receive"|"register"|"unregister",
 "address": 发送/发布/注册/注销的信息总线地址
 "body": 消息体
}

{
 "type": "err",
 "failureType": "socketException",
 "message": "可选的，来自被引发的异常的消息"
}

Router router = Router.router(vertx);

// 让从客户端发送到 "demo.orderMgr"的任何消息通过
PermittedOptions inboundPermitted = new PermittedOptions()
  .setAddress("demo.someService");

SockJSHandler sockJSHandler = SockJSHandler.create(vertx);
SockJSBridgeOptions options = new SockJSBridgeOptions()
  .addInboundPermitted(inboundPermitted);

// 将桥挂载到路由上
router
  .route("/eventbus/*")
  .subRouter(sockJSHandler
    .bridge(options, be -> {
      if (be.type() == BridgeEventType.PUBLISH ||
        be.type() == BridgeEventType.RECEIVE) {

          if (be.getRawMessage().getString("body").equals("armadillos")) {
            // Reject it
            be.complete(false);
            return;
          }
        }
        be.complete(true);
      }));

Router router = Router.router(vertx);

// 初始化 SockJSHandler 处理器
SockJSHandler sockJSHandler = SockJSHandler.create(vertx);
SockJSBridgeOptions options = new SockJSBridgeOptions()
  .addInboundPermitted(inboundPermitted)
  .setPingTimeout(5000);

// 挂载桥到路由上
router
  .route("/eventbus/*")
  .subRouter(sockJSHandler.bridge(options, be -> {
    if (be.type() == BridgeEventType.SOCKET_IDLE) {
      // 做一些自定义处理
    }

      be.complete(true);
    }));

<script src="https://unpkg.io/sockjs-client@1.5.0/dist/sockjs.min.js"></script>
<script src='https://unpkg.io/@vertx/eventbus-bridge-client.js@1.0.0-1/vertx-eventbus.js'></script>

<script>

var eb = new EventBus('http://localhost:8080/eventbus', {"vertxbus_ping_interval": 300000}); // sends ping every 5 minutes.

eb.onopen = function() {

// 设置接收消息的处理器
eb.registerHandler('some-address', function(error, message) {
  console.log('received a message: ' + JSON.stringify(message));
});

// 发送信息
eb.send('some-address', {name: 'tim', age: 587});
}

</script>

var eb = new EventBus('http://localhost:8080/eventbus', {"vertxbus_ping_interval": 300000});

Router router = Router.router(vertx);

// 让从客户端发送到 'demo.orderService' 的任何消息通过
PermittedOptions inboundPermitted = new PermittedOptions()
  .setAddress("demo.orderService");

SockJSHandler sockJSHandler = SockJSHandler.create(vertx);
SockJSBridgeOptions options = new SockJSBridgeOptions()
  .addInboundPermitted(inboundPermitted);

// 将连接桥挂载到路由器上
router
  .route("/eventbus/*")
  .subRouter(sockJSHandler.bridge(options, be -> {
    if (
      be.type() == BridgeEventType.PUBLISH ||
        be.type() == BridgeEventType.SEND) {

      // 添加一些头
      JsonObject headers = new JsonObject()
        .put("header1", "val")
        .put("header2", "val2");

        JsonObject rawMessage = be.getRawMessage();
        rawMessage.put("headers", headers);
        be.setRawMessage(rawMessage);
      }
      be.complete(true);
    }));

<meta name="csrf-token" content="${X-XSRF-TOKEN}">

// 获取<meta>标签中的CSRF token
var token = document.querySelector('meta[name="csrf-token"]').getAttribute('content')

// 使用Fetch API发送请求
fetch('/process', {
 credentials: 'same-origin', // <-- 在请求中包含cookie
 headers: {
   'X-XSRF-TOKEN': token // <-- 将CSRF token放到header中
 },
 method: 'POST',
 body: {
   key: 'value'
 }
})

OAuth2Auth authProvider =
  GithubAuth
    .create(vertx, "CLIENTID", "CLIENT SECRET");
// 我们也需要一个用户session处理器
// 其用来确保用户数据可以在请求之间储存在session中
router.route()
  .handler(SessionHandler.create(LocalSessionStore.create(vertx)));
// 我们现在保护 "/protected" 下的一切资源
router.route("/protected").handler(
  OAuth2AuthHandler.create(
      vertx,
      authProvider,
      "http://localhost:8080/callback")
    // 我们现在配置oauth2处理器
    // 设置回调处理器
    // 回调处理器必须符合oauth2提供者的规范
    .setupCallback(router.route("/callback"))
    // 对于这个资源，
    // 我们要求用户具有查看用户电子邮件的权限
    .withScope("user:email")
);
// 应用程序的入口点
// 其会渲染一个自定义的模板
router.get("/").handler(ctx -> ctx.response()
  .putHeader("Content-Type", "text/html")
  .end(
    "<html>\n" +
      "  <body>\n" +
      "    <p>\n" +
      "      Well, hello there!\n" +
      "    </p>\n" +
      "    <p>\n" +
      "      We're going to the protected resource, if there is no\n" +
      "      user in the session we will talk to the GitHub API. Ready?\n" +
      "      <a href=\"/protected\">Click here</a> to begin!</a>\n" +
      "    </p>\n" +
      "    <p>\n" +
      "      <b>If that link doesn't work</b>, remember to provide your\n" +
      "      own <a href=\"https://github.com/settings/applications/new\">\n" +
      "      Client ID</a>!\n" +
      "    </p>\n" +
      "  </body>\n" +
      "</html>"));
// 受保护的资源
router.get("/protected").handler(ctx -> {
  // 此时，您的user对象应包含
  // 从Oauth2响应中的信息,因为这是受保护的资源
  // 如上面在处理程序配置中指定的，用户对象永远不会为null
  User user = ctx.user();
  // 只是将其转储到客户端以进行演示
  ctx.response().end(user.toString());
});

WebAuthn webAuthn = WebAuthn.create(
  vertx,
  new WebAuthnOptions()
    .setRelyingParty(new RelyingParty().setName("Vert.x WebAuthN Demo"))
    // 哪种认证类型是您想要的，是您关心的？
    // # 密钥
    .setAuthenticatorAttachment(AuthenticatorAttachment.CROSS_PLATFORM)
    // # 指纹
    .setAuthenticatorAttachment(AuthenticatorAttachment.PLATFORM)
    .setUserVerification(UserVerification.REQUIRED))
  // 从哪里加载证书？
  .authenticatorFetcher(fetcher)
  // 更新认证状态
  .authenticatorUpdater(updater);

// 解析请求体
router.post()
  .handler(BodyHandler.create());
// 添加session处理器
router.route()
  .handler(SessionHandler
    .create(LocalSessionStore.create(vertx)));

// 安全处理器
WebAuthnHandler webAuthNHandler = WebAuthnHandler.create(webAuthn)
  .setOrigin("https://192.168.178.74.xip.io:8443")
  // 需要回调
  .setupCallback(router.post("/webauthn/response"))
  // 可选的注册回调
  .setupCredentialsCreateCallback(router.post("/webauthn/register"))
  // 可选的登录回调
  .setupCredentialsGetCallback(router.post("/webauthn/login"));

// 保护其余的Route
router.route().handler(webAuthNHandler);

/**
* 将公钥证书转化为可序列化的JSON
* @param  {Object} pubKeyCred 公钥证书
* @return {Object}            - 编码为JSON的公钥证书
*/
var publicKeyCredentialToJSON = (pubKeyCred) => {
 if (pubKeyCred instanceof Array) {
   let arr = [];
   for (let i of pubKeyCred) { arr.push(publicKeyCredentialToJSON(i)) }

   return arr
 }

 if (pubKeyCred instanceof ArrayBuffer) {
   return base64url.encode(pubKeyCred)
 }

 if (pubKeyCred instanceof Object) {
   let obj = {};

   for (let key in pubKeyCred) {
     obj[key] = publicKeyCredentialToJSON(pubKeyCred[key])
   }

   return obj
 }

 return pubKeyCred
};

/**
* 生成安全随机数的Buffer
* @param  {Number} len - buffer的长度（默认为32byte）
* @return {Uint8Array} - 随机字符串
*/
var generateRandomBuffer = (len) => {
 len = len || 32;

 let randomBuffer = new Uint8Array(len);
 window.crypto.getRandomValues(randomBuffer);

 return randomBuffer
};

/**
* 解码arrayBuffer必填字段
*/
var preformatMakeCredReq = (makeCredReq) => {
 makeCredReq.challenge = base64url.decode(makeCredReq.challenge);
 makeCredReq.user.id = base64url.decode(makeCredReq.user.id);

 return makeCredReq
};

/**
* 解码arrayBuffer必填字段
*/
var preformatGetAssertReq = (getAssert) => {
 getAssert.challenge = base64url.decode(getAssert.challenge);

 for (let allowCred of getAssert.allowCredentials) {
   allowCred.id = base64url.decode(allowCred.id)
 }

 return getAssert
};

// 使用之前定义的函数
getGetAssertionChallenge({name: 'your-user-name'})
.then((response) => {
 // base64必须解码为JavaScript Buffer
 let publicKey = preformatGetAssertReq(response);
 // 这个响应之后会传给浏览器
 // 用于通过于您的token/手机等互动产生断言
 return navigator.credentials.get({publicKey})
})
.then((response) => {
 // 将响应的buffer转为base64和json
 let getAssertionResponse = publicKeyCredentialToJSON(response);
 // 向服务器传送数据
 return sendWebAuthnResponse(getAssertionResponse)
})
.then((response) => {
 // 成功
 alert('Login success')
})
.catch((error) => alert(error));

// 工具函数

let sendWebAuthnResponse = (body) => {
 return fetch('/webauthn/response', {
   method: 'POST',
   credentials: 'include',
   headers: {
     'Content-Type': 'application/json'
   },
   body: JSON.stringify(body)
 })
   .then(response => {
     if (!response.ok) {
       throw new Error(`Server responded with error: ${response.statusText}`);
     }
     return response;
   })
};

let getGetAssertionChallenge = (formBody) => {
 return fetch('/webauthn/login', {
   method: 'POST',
   credentials: 'include',
   headers: {
     'Content-Type': 'application/json'
   },
   body: JSON.stringify(formBody)
 })
   .then(response => {
     if (!response.ok) {
       throw new Error(`Server responded with error: ${response.statusText}`);
     }
     return response;
   })
   .then((response) => response.json())
};

/* 处理注册表 */
getMakeCredentialsChallenge({name: 'myalias', displayName: 'Paulo Lopes'})
.then((response) => {
 // 将询问和id转为buffer并执行注册
 let publicKey = preformatMakeCredReq(response);
 //  创建一个新的密钥对
 return navigator.credentials.create({publicKey})
})
.then((response) => {
 // 将响应从buffer转为json
 let makeCredResponse = window.publicKeyCredentialToJSON(response);
 //  传送给服务器以辨认用户身份
 return sendWebAuthnResponse(makeCredResponse)
})
.then((response) => {
 alert('Registration completed')
})
.catch((error) => alert(error));

// 工具函数

let getMakeCredentialsChallenge = (formBody) => {
 return fetch('/webauthn/register', {
   method: 'POST',
   credentials: 'include',
   headers: {
     'Content-Type': 'application/json'
   },
   body: JSON.stringify(formBody)
 })
   .then(response => {
     if (!response.ok) {
       throw new Error(`Server responded with error: ${response.statusText}`);
     }
     return response;
   })
   .then((response) => response.json())
};

<html>
<head>
 <meta charset="UTF-8">
 <title>OTP Authenticator Verification Example Page</title>
</head>
<body>
<form action="/otp/verify" method="post" enctype="multipart/form-data">
 <div>
   <label>Code:</label>
   <input type="text" name="code"/><br/>
 </div>
 <div>
   <input type="submit" value="Submit"/>
 </div>
</form>
</body>
</html>

<html>
<head>
 <title>OTP Authenticator Registration Example Page</title>
</head>
<body>
 <p>Scan this QR Code in Google Authenticator</p>
 <img id="qrcode">
 <p>- or enter this key manually -</p>
 <span id="url"></span>

 <script>
 const key = document.getElementById('url');
 const qrcode = document.getElementById('qrcode');

 fetch(
   '/otp/register',
   {
     method: 'POST',
     headers: {
       'Accept': 'application/json'
     }
   })
   .then(res => {
     if (res.status === 200) {
       return res;
     }
     throw new Error(res.statusText);
   })
   .catch(err => console.error(err))
   .then(res => res.json())
   .then(json => {
     key.innerText = json.url;
     qrcode.src =
       'https://chart.googleapis.com/chart?chs=166x166&chld=L|0&cht=qr&chl=' +
       encodeURIComponent(json.url);
   });
 </script>
</body>
</html>

router.post()
  .handler(BodyHandler.create());
// add a session handler (OTP requires state)
router.route()
  .handler(SessionHandler
    .create(LocalSessionStore.create(vertx))
    .setCookieSameSite(CookieSameSite.STRICT));

// add the first authentication mode, for example HTTP Basic Authentication
router.route()
  .handler(basicAuthHandler);

final OtpAuthHandler otp = OtpAuthHandler
  .create(TotpAuth.create()
    .authenticatorFetcher(authr -> {
      // fetch authenticators from a database
      // ...
      return Future.succeededFuture(new io.vertx.ext.auth.otp.Authenticator());
    })
    .authenticatorUpdater(authr -> {
      // update or insert authenticators from a database
      // ...
      return Future.succeededFuture();
    }));

otp
  // the issuer for the application
  .issuer("Vert.x Demo")
  // handle code verification responses
  .verifyUrl("/verify-otp.html")
  // handle registration of authenticators
  .setupRegisterCallback(router.post("/otp/register"))
  // handle verification of authenticators
  .setupCallback(router.post("/otp/verify"));

// secure the rest of the routes
router.route()
  .handler(otp);

// To view protected details, user must be authenticated and
// using 2nd factor authentication
router.get("/protected")
  .handler(ctx -> ctx.end("Super secret content"));

router.route().handler(MethodOverrideHandler.create());

router.route(HttpMethod.GET, "/").handler(ctx -> {
  // 做 GET 相关操作……
});

router.route(HttpMethod.POST, "/").handler(ctx -> {
  // 做 POST 相关操作……
});

router.route().handler(MethodOverrideHandler.create(false));

router.route(HttpMethod.GET, "/").handler(ctx -> {
  // 做 GET 相关操作……
});

router.route(HttpMethod.POST, "/").handler(ctx -> {
  // 做 POST 相关操作……
});