• 正则验证用户名和跨域postmessage

    正则验证用户名

    首先

    大小写字母，数字，特殊符号 至少出现一次 8-14位

    ^(?=.*[A-Za-z])(?=.*\d)(?=.*[!@#\$%^&*])[A-Za-z\d!@#\$%^&*]{8,14}$

    (?=...) 是正则表达式中的正向前瞻（positive lookahead）构造。它的作用是在匹配文本的过程中，要求满足括号内规定的条件，但不消耗文本（不包括它在匹配结果中）。它通常用于需要同时满足多个条件的情况。

    假设你有一个正则表达式 (?=pattern)，其中 pattern 是要查找的条件。

    1. pattern 可以是任何有效的正则表达式，用于描述你要查找的条件。例如，pattern 可以是字母、数字、特殊字符或它们的组合。

    2. 当正则表达式引擎在字符串中进行匹配时，它会尝试查找满足 pattern 的部分，但不消耗字符串中的字符。这意味着它只是在当前位置尝试匹配 pattern，而不会移动正则表达式引擎的位置指针。

    3. 如果 pattern 成功匹配，正向前瞻就会返回成功（true），否则返回失败（false）。不管成功还是失败，正则表达式引擎都会继续从当前位置向后匹配。

    这使得正向前瞻非常适合用于需要同时满足多个条件的匹配情况。例如，在用户名验证的正则表达式中，使用 (?= ...) 来确保用户名中包含字母、数字和特殊字符，而不需要改变正则表达式引擎的位置。这就是 (?= ...) 的具体操作。它帮助你同时检查多个条件，而不需要匹配整个字符串。

    解释：

    • ^：表示匹配字符串的开头。

    • (?=.*[A-Za-z])：使用正向前瞻（positive lookahead）确保字符串中至少包含一个字母。

    • (?=.*\d)：使用正向前瞻确保字符串中至少包含一个数字。

    • (?=.*[!@#\$%^&*])：使用正向前瞻确保字符串中至少包含一个特殊符号（在此示例中，列举了一些特殊符号，您可以根据需要扩展或更改）。

    • [A-Za-z\d!@#\$%^&*]{8,14}：匹配包含字母、数字和特殊符号的字符串，长度在8到14个字符之间。

    • $：表示匹配字符串的结尾。

    .* 组合在一起表示匹配任意长度的字符序列，包括空字符串（零字符）。这通常用于灵活地捕获或匹配文本中的内容

    1. html>
    2. <html>
    3. <head>
    4. 	<meta charset="utf-8">
    5. 	<meta name="viewport" content="width=device-width, initial-scale=1">
    6. 	<title>formtitle>
    7. head>
    8. <body>
    9. 	<form action="web.php" method="post">
    10. 		<input type="text" name="name" required pattern="^(?=.*[A-Za-z])(?=.*\d)(?=.*[!@#\$%^&*])[A-Za-z\d!@#\$%^&*]{8,14}$">
    11. 		<input type="submit" value="sumbit">
    12. 		
    13. 	form>
    14.  
    15. body>
    16. html>

    跨域postmessage

    首先在windows上配置好虚拟主机，这样可以通过域名来访问

    对两个网站分别进行以下配置

    1. html>
    2. <html lang="en">
    3.  
    4. <head>
    5.     <meta charset="UTF-8">
    6.     <meta name="viewport" content="width=device-width, initial-scale=1.0">
    7.     <title>2023title>
    8. head>
    10.  
    11. <body>
    12.     <div>
    13.         <h1>www.example.comh1>
    14.     div>
    15. body>
    16. <script>
    17.     window.addEventListener('message', (event) => {
    18.         if (event.origin === 'http://www.example1.com') {
    19.             const cookieData = event.data;
    20.             //处理cookieData
    21.             console.log('Receive message from parent:', cookieData);
    22.             window.parent.postMessage('child message', '*');
    23.         }
    24.     })
    25. script>
    26. html>

    1. html>
    2. <html lang="en">
    3. <head>
    4.     <meta charset="UTF-8">
    5.     <meta name="viewport" content="width=device-width, initial-scale=1.0">
    6.     <title>iframetitle>
    7. head>
    8. <body>
    9.     <iframe id="myIframe" src="http://www.example.com/" frameborder="0">iframe>
    10. body>
    11. <script>
    12.     window.onload = function() {
    13.         document.cookie = 'sessionid=example'
    14.         const cookieData = document.cookie
    15.         window.frames[0].postMessage(cookieData, 'http://www.example.com/');
    16.     }
    17.     //添加一个监听事件处理子页面的返回消息
    18.     window.addEventListener('message', (event) => {
    19.         if(event.origin === 'http://www.example.com')
    20.         console.log('Received message from child:', event.data);
    21.     })
    22. script>
    23. html>

  • 相关阅读:
    Vue vuex vue-router
    Arcgis 10.2.2 | arcgis license server无法启动的解决办法
    jre精简配合java的桌面小工具打包
    speedoffice（PPT）如何添加项目编号
    机器学习笔记之条件随机场(一)背景介绍
    动态路由协议（一）
    【微服务】Day04
    Batch_Normalization 、Layer_Normalization 、Group_Normalization你分的清楚吗
    Rust 构建跨平台 GUI 的新选择
    Mock.js 的语法规范学习
  • 原文地址：https://blog.csdn.net/weixin_64747212/article/details/133581429