diff --git a/web/assets/js/model/xray.js b/web/assets/js/model/xray.js
index 38b0efcd..24823993 100644
--- a/web/assets/js/model/xray.js
+++ b/web/assets/js/model/xray.js
@@ -75,9 +75,9 @@ const UTLS_FINGERPRINT = {
 };
 
 const ALPN_OPTION = {
-    H3: "h3",
-    H2: "h2",
     HTTP1: "http/1.1",
+    H2: "h2",
+    H3: "h3",
 };
 
 const SNIFFING_OPTION = {
diff --git a/web/html/xui/form/tls_settings.html b/web/html/xui/form/tls_settings.html
index d8b0f3c5..b09145ff 100644
--- a/web/html/xui/form/tls_settings.html
+++ b/web/html/xui/form/tls_settings.html
@@ -76,7 +76,7 @@
             <td>
                 <a-form-item>
                     <a-checkbox-group v-model="inbound.stream.tls.alpn">
-                        <a-checkbox v-for="key in ALPN_OPTION" :value="key">[[ key ]]</a-checkbox>
+                        <a-checkbox v-for="key,value in ALPN_OPTION" :value="key">[[ value ]]</a-checkbox>
                     </a-checkbox-group>
                 </a-form-item>
             </td>