{"id":5864,"date":"2022-04-03T11:29:05","date_gmt":"2022-04-03T03:29:05","guid":{"rendered":"https:\/\/egonlin.com\/?p=5864"},"modified":"2022-04-03T13:00:36","modified_gmt":"2022-04-03T05:00:36","slug":"01-web%e5%ba%94%e7%94%a8","status":"publish","type":"post","link":"https:\/\/egonlin.com\/?p=5864","title":{"rendered":"01 Web\u5e94\u7528"},"content":{"rendered":"<h1>1-Web\u5e94\u7528<\/h1>\n<h2>\u4e00 Web\u5e94\u7528\u7a0b\u5e8f\u662f\u4ec0\u4e48<\/h2>\n<p>Web\u5e94\u7528\u7a0b\u5e8f\u662f\u4e00\u79cd\u53ef\u4ee5\u901a\u8fc7Web\u8bbf\u95ee\u7684\u5e94\u7528\u7a0b\u5e8f\uff0c\u7a0b\u5e8f\u7684\u6700\u5927\u597d\u5904\u662f\u7528\u6237\u5f88\u5bb9\u6613\u8bbf\u95ee\u5e94\u7528\u7a0b\u5e8f\uff0c\u7528\u6237\u53ea\u9700\u8981\u6709\u6d4f\u89c8\u5668\u5373\u53ef\uff0c\u4e0d\u9700\u8981\u518d\u5b89\u88c5\u5176\u4ed6\u8f6f\u4ef6<\/p>\n<p>\u5e94\u7528\u7a0b\u5e8f\u6709\u4e24\u79cd\u6a21\u5f0fC\/S\u3001B\/S\u3002C\/S\u662f\u5ba2\u6237\u7aef\/\u670d\u52a1\u5668\u7aef\u7a0b\u5e8f\uff0c\u4e5f\u5c31\u662f\u8bf4\u8fd9\u7c7b\u7a0b\u5e8f\u4e00\u822c\u72ec\u7acb\u8fd0\u884c\u3002\u800cB\/S\u5c31\u662f\u6d4f\u89c8\u5668\u7aef\/\u670d\u52a1\u5668\u7aef\u5e94\u7528\u7a0b\u5e8f\uff0c\u8fd9\u7c7b\u5e94\u7528\u7a0b\u5e8f\u4e00\u822c\u501f\u52a9IE\u7b49\u6d4f\u89c8\u5668\u6765\u8fd0\u884c\u3002WEB\u5e94\u7528\u7a0b\u5e8f\u4e00\u822c\u662fB\/S\u6a21\u5f0f\u3002Web\u5e94\u7528\u7a0b\u5e8f\u9996\u5148\u662f\u201c\u5e94\u7528\u7a0b\u5e8f\u201d\uff0c\u548c\u7528\u6807\u51c6\u7684\u7a0b\u5e8f\u8bed\u8a00\uff0c\u5982C\u3001C++\u7b49\u7f16\u5199\u51fa\u6765\u7684\u7a0b\u5e8f\u6ca1\u6709\u4ec0\u4e48\u672c\u8d28\u4e0a\u7684\u4e0d\u540c\u3002\u7136\u800cWeb\u5e94\u7528\u7a0b\u5e8f\u53c8\u6709\u81ea\u5df1\u72ec\u7279\u7684\u5730\u65b9\uff0c\u5c31\u662f\u5b83\u662f\u57fa\u4e8eWeb\u7684\uff0c\u800c\u4e0d\u662f\u91c7\u7528\u4f20\u7edf\u65b9\u6cd5\u8fd0\u884c\u7684\u3002\u6362\u53e5\u8bdd\u8bf4\uff0c\u5b83\u662f\u5178\u578b\u7684\u6d4f\u89c8\u5668\/\u670d\u52a1\u5668\u67b6\u6784\u7684\u4ea7\u7269\u3002<\/p>\n<h2>1.1 Web\u5e94\u7528\u7a0b\u5e8f\u7684\u4f18\u70b9<\/h2>\n<pre><code>\u7f51\u7edc\u5e94\u7528\u7a0b\u5e8f\u4e0d\u9700\u8981\u4efb\u4f55\u590d\u6742\u7684\u201c\u5c55\u5f00\u201d\u8fc7\u7a0b\uff0c\u4f60\u6240\u9700\u8981\u7684\u53ea\u662f\u4e00\u4e2a\u9002\u7528\u7684\u6d4f\u89c8\u5668\uff1b\n\u7f51\u7edc\u5e94\u7528\u7a0b\u5e8f\u901a\u5e38\u8017\u8d39\u5f88\u5c11\u7684\u7528\u6237\u786c\u76d8\u7a7a\u95f4\uff0c\u6216\u8005\u4e00\u70b9\u90fd\u4e0d\u8017\u8d39\uff1b\n\u5b83\u4eec\u4e0d\u9700\u8981\u66f4\u65b0\uff0c\u56e0\u4e3a\u6240\u6709\u65b0\u7684\u7279\u6027\u90fd\u5728\u670d\u52a1\u5668\u4e0a\u6267\u884c\uff0c\u4ece\u800c\u81ea\u52a8\u4f20\u8fbe\u5230\u7528\u6237\u7aef\uff1b\n\u7f51\u7edc\u5e94\u7528\u7a0b\u5e8f\u548c\u670d\u52a1\u5668\u7aef\u7684\u7f51\u7edc\u4ea7\u54c1\u90fd\u5f88\u5bb9\u6613\u7ed3\u5408\uff0c\u5982email\u529f\u80fd\u548c\u641c\u7d22\u529f\u80fd\uff1b\n\u56e0\u4e3a\u5b83\u4eec\u5728\u7f51\u7edc\u6d4f\u89c8\u5668\u7a97\u53e3\u4e2d\u8fd0\u884c\uff0c\u6240\u4ee5\u5927\u591a\u6570\u60c5\u51b5\u4e0b\u5b83\u4eec\u662f\u901a\u8fc7\u8de8\u5e73\u53f0\u4f7f\u7528\u7684 (\u4f8b\u5982Windows\uff0cMac\uff0cLinux\u7b49\u7b49)<\/code><\/pre>\n<h2>1.2 Web\u5e94\u7528\u7a0b\u5e8f\u7684\u7f3a\u70b9<\/h2>\n<pre><code>\u7f51\u7edc\u5e94\u7528\u7a0b\u5e8f\u5f3a\u8c03\u6d4f\u89c8\u5668\u7684\u9002\u7528\u6027\u3002\u5982\u679c\u6d4f\u89c8\u5668\u65b9\u6ca1\u6709\u63d0\u4f9b\u7279\u5b9a\u7684\u529f\u80fd\uff0c\u6216\u8005\u5f03\u7528\u7279\u5b9a\u7684\u5e73\u53f0\u6216\u64cd\u4f5c\u7cfb\u7edf\u7248\u672c\uff08\u5bfc\u81f4\u4e0d\u9002\u7528\uff09\uff0c\u5c31\u4f1a\u5f71\u54cd\u5927\u91cf\u7528\u6237\uff1b\n\u7f51\u7edc\u5e94\u7528\u4f9d\u9760\u4e92\u8054\u7f51\u8fdc\u7a0b\u670d\u52a1\u5668\u7aef\u7684\u5e94\u7528\u6587\u4ef6\u3002\u56e0\u6b64\uff0c\u5f53\u8fde\u63a5\u51fa\u95ee\u9898\u65f6\uff0c\u5e94\u7528\u5c06\u4e0d\u80fd\u6b63\u5e38\u4f7f\u7528\u3002\n\u8bb8\u591a\u7f51\u7edc\u5e94\u7528\u7a0b\u5e8f\u4e0d\u662f\u5f00\u6e90\u7684\uff0c\u53ea\u80fd\u4f9d\u8d56\u7b2c\u4e09\u65b9\u63d0\u4f9b\u7684\u670d\u52a1\uff0c\u56e0\u6b64\u4e0d\u80fd\u9488\u5bf9\u7528\u6237\u5b9a\u5236\u5316\u3001\u4e2a\u6027\u5316\uff0c\u800c\u4e14\u5927\u591a\u6570\u60c5\u51b5\u4e0b\u7528\u6237\u4e0d\u80fd\u79bb\u7ebf\u4f7f\u7528\uff0c\u56e0\u800c\u635f\u5931\u4e86\u5f88\u591a\u7075\u6d3b\u6027\uff1b\n\u5b83\u4eec\u5b8c\u5168\u4f9d\u8d56\u5e94\u7528\u670d\u52a1\u5546\u7684\u53ef\u53ca\u6027\u3002\u5982\u679c\u516c\u53f8\u5012\u95ed\uff0c\u670d\u52a1\u5668\u505c\u6b62\u4f7f\u7528\uff0c\u7528\u6237\u4e5f\u65e0\u6cd5\u8ffd\u7d22\u4ee5\u524d\u7684\u8d44\u6599\u3002\u5bf9\u6bd4\u800c\u770b\uff0c\u5373\u4f7f\u8f6f\u4ef6\u5236\u9020\u5546\u5012\u95ed\u4e86\uff0c\u4f20\u7edf\u7684\u5b89\u88c5\u8f6f\u4ef6\u4e5f\u53ef\u4ee5\u7ee7\u7eed\u8fd0\u884c\uff0c\u5c3d\u7ba1\u4e0d\u80fd\u518d\u66f4\u65b0\u6216\u6709\u5176\u4ed6\u7528\u6237\u670d\u52a1\uff1b\n\u76f8\u4f3c\u5730\uff0c\u63d0\u4f9b\u65b9\u516c\u53f8\u5bf9\u8f6f\u4ef6\u548c\u5176\u529f\u80fd\u6709\u4e86\u66f4\u5927\u7684\u63a7\u5236\u6743\u3002\u53ea\u8981\u4ed6\u4eec\u613f\u610f\u5c31\u80fd\u4e3a\u8f6f\u4ef6\u6dfb\u52a0\u65b0\u7279\u6027\uff0c\u5373\u4f7f\u7528\u6237\u60f3\u7b49bugs\u5148\u88ab\u89e3\u51b3\u518d\u66f4\u65b0\u3002\u8df3\u8fc7\u8f83\u5dee\u7684\u8f6f\u4ef6\u7248\u672c\u4e5f\u4e0d\u53ef\u80fd\u4e86\u3002\u516c\u53f8\u53ef\u4ee5\u5f3a\u52a0\u4e0d\u53d7\u6b22\u8fce\u7684\u7279\u6027\u7ed9\u7528\u6237\uff0c\u4e5f\u53ef\u4ee5\u968f\u610f\u51cf\u5c11\u5e26\u5bbd\u6765\u524a\u51cf\u5f00\u652f\u3002\n\u516c\u53f8\u7406\u8bba\u4e0a\u53ef\u4ee5\u68c0\u7d22\u4efb\u4f55\u7684\u7528\u6237\u884c\u4e3a\u3002\u8fd9\u6709\u53ef\u80fd\u5f15\u8d77\u9690\u79c1\u5b89\u5168\u95ee\u9898\u3002<\/code><\/pre>\n<h2>1.3 B\/S\u67b6\u6784\u4f18\u70b9<\/h2>\n<p>\u6d4f\u89c8\u5668\/\u670d\u52a1\u5668\u67b6\u6784\uff08Browser\/Server,\u7b80\u79f0B\/S\uff09\u80fd\u591f\u5f88\u597d\u5730\u5e94\u7528\u5728\u5e7f\u57df\u7f51\u4e0a\uff0c\u6210\u4e3a\u8d8a\u6765\u8d8a\u591a\u7684\u4f01\u4e1a\u7684\u9009\u62e9\u3002\u6d4f\u89c8\u5668\/\u670d\u52a1\u5668\u67b6\u6784\u76f8\u5bf9\u4e8e\u5176\u4ed6\u51e0\u79cd\u5e94\u7528\u7a0b\u5e8f\u4f53\u7cfb\u7ed3\u6784\uff0c\u6709\u5982\u4e0b3\u65b9\u9762\u7684\u4f18\u70b9\uff1a<\/p>\n<pre><code>\u8fd9\u79cd\u67b6\u6784\u91c7\u7528Internet\u4e0a\u6807\u51c6\u7684\u901a\u4fe1\u534f\u8bae\uff08\u901a\u5e38\u662fTCP\/IP\u534f\u8bae\uff09\u4f5c\u4e3a\u5ba2\u6237\u673a\u540c\u670d\u52a1\u5668\u901a\u4fe1\u7684\u534f\u8bae\u3002\u8fd9\u6837\u53ef\u4ee5\u4f7f\u4f4d\u4e8eInternet\u4efb\u610f\u4f4d\u7f6e\u7684\u4eba\u90fd\u80fd\u591f\u6b63\u5e38\u8bbf\u95ee\u670d\u52a1\u5668\u3002\u5bf9\u4e8e\u670d\u52a1\u5668\u6765\u8bf4\uff0c\u901a\u8fc7\u76f8\u5e94\u7684Web\u670d\u52a1\u548c\u6570\u636e\u5e93\u670d\u52a1\u53ef\u4ee5\u5bf9\u6570\u636e\u8fdb\u884c\u5904\u7406\u3002\u5bf9\u5916\u91c7\u7528\u6807\u51c6\u7684\u901a\u4fe1\u534f\u8bae\uff0c\u4ee5\u4fbf\u5171\u4eab\u6570\u636e\u3002\n\u5728\u670d\u52a1\u5668\u4e0a\u5bf9\u6570\u636e\u8fdb\u884c\u5904\u7406\uff0c\u5c31\u5904\u7406\u7684\u7ed3\u679c\u751f\u6210\u7f51\u9875\uff0c\u4ee5\u65b9\u4fbf\u5ba2\u6237\u7aef\u76f4\u63a5\u4e0b\u8f7d\u3002\n\u5728\u5ba2\u6237\u673a\u4e0a\u5bf9\u6570\u636e\u7684\u5904\u7406\u88ab\u8fdb\u4e00\u6b65\u7b80\u5316\uff0c\u5c06\u6d4f\u89c8\u5668\u4f5c\u4e3a\u5ba2\u6237\u7aef\u7684\u5e94\u7528\u7a0b\u5e8f\uff0c\u4ee5\u5b9e\u73b0\u5bf9\u6570\u636e\u7684\u663e\u793a\u3002\u4e0d\u518d\u9700\u8981\u4e3a\u5ba2\u6237\u7aef\u5355\u72ec\u7f16\u5199\u548c\u5b89\u88c5\u5176\u4ed6\u7c7b\u578b\u7684\u5e94\u7528\u7a0b\u5e8f\u3002\u8fd9\u6837\uff0c\u5728\u5ba2\u6237\u7aef\u53ea\u9700\u8981\u5b89\u88c5\u4e00\u5957\u5185\u7f6e\u6d4f\u89c8\u5668\u7684\u64cd\u4f5c\u7cfb\u7edf\uff0c\u76f4\u63a5\u5b89\u88c5\u4e00\u5957\u6d4f\u89c8\u5668\uff0c\u5c31\u53ef\u4ee5\u5b9e\u73b0\u670d\u52a1\u5668\u4e0a\u6570\u636e\u7684\u8bbf\u95ee\u3002\u800c\u6d4f\u89c8\u5668\u662f\u8ba1\u7b97\u673a\u7684\u6807\u51c6\u8bbe\u5907<\/code><\/pre>\n<p>\u603b\u7ed3\u4e00\u4e0b\uff0c\u672c\u8d28\u4e0a\uff1a\u6d4f\u89c8\u5668\u662f\u4e00\u4e2asocket\u5ba2\u6237\u7aef\uff0c\u670d\u52a1\u5668\u662f\u4e00\u4e2asocket\u670d\u52a1\u7aef<\/p>\n<h2>\u4e8c \u57fa\u4e8eSOCKET\u5199\u4e00\u4e2aweb\u5e94\u7528<\/h2>\n<h3>2.1 main.py<\/h3>\n<pre><code class=\"language-yaml\">import socket\n\ndef server_run():\n    soc = socket.socket()\n    soc.bind((&#039;127.0.0.1&#039;, 8008))\n    soc.listen(5)\n    while True:\n        conn, addr = soc.accept()\n        recv_data = conn.recv(1024)\n        print(recv_data)\n        # 1 \u76f4\u63a5\u5728send\u91cc\u5199\uff0c\u53d1\u9001\u7ed9\u5ba2\u6237\u7aef\n        # conn.send(b&#039;HTTP\/1.1 200 OK\\r\\n\\r\\n&lt;h1&gt;hello web&lt;\/h1&gt;&lt;img src=&quot;https:\/\/gss2.bdstatic.com\/9fo3dSag_xI4khGkpoWK1HF6hhy\/baike\/c0%3Dbaike92%2C5%2C5%2C92%2C30\/sign=5e3814acf9edab64607f4592965fc4a6\/14ce36d3d539b600c0c465d0eb50352ac65cb74b.jpg&quot;&gt;&lt;\/img&gt;&#039;)\n        #2 \u6253\u5f00\u4e00\u4e2ahtml\u6587\u4ef6\uff0c\u53d1\u9001\u7ed9\u5ba2\u6237\u7aef\n        # with open(&#039;index.html&#039;,&#039;r&#039;,encoding=&#039;utf-8&#039;) as f:\n        #     data=f.read()\n        # conn.send((&#039;HTTP\/1.1 200 OK\\r\\n\\r\\n%s&#039;%data).encode(&#039;utf-8&#039;))\n        # 3 \u52a8\u6001\u7f51\u9875\uff0c\u5b57\u7b26\u4e32\u66ff\u6362\n        import time\n        now=time.strftime(&quot;%Y-%m-%d %H:%M:%S&quot;, time.localtime())\n        print(now)\n        with open(&#039;index.html&#039;,&#039;r&#039;,encoding=&#039;utf-8&#039;) as f:\n            data=f.read()\n        data=data.replace(&#039;@@@&#039;,now)\n        conn.send((&#039;HTTP\/1.1 200 OK\\r\\n\\r\\n%s&#039;%data).encode(&#039;utf-8&#039;))\n        conn.close()\n\nif __name__ == &#039;__main__&#039;:\n    server_run()<\/code><\/pre>\n<h3>2.2 index.html<\/h3>\n<pre><code class=\"language-yaml\">&lt;!DOCTYPE html&gt;\n&lt;html lang=&quot;en&quot;&gt;\n&lt;head&gt;\n    &lt;meta charset=&quot;UTF-8&quot;&gt;\n    &lt;title&gt;Title&lt;\/title&gt;\n&lt;\/head&gt;\n&lt;body&gt;\n&lt;h2&gt;@@@&lt;\/h2&gt;\n\n&lt;img src=&quot;https:\/\/gss2.bdstatic.com\/9fo3dSag_xI4khGkpoWK1HF6hhy\/baike\/c0%3Dbaike92%2C5%2C5%2C92%2C30\/sign=5e3814acf9edab64607f4592965fc4a6\/14ce36d3d539b600c0c465d0eb50352ac65cb74b.jpg&quot; alt=&quot;&quot;&gt;\n&lt;\/body&gt;\n&lt;\/html&gt;<\/code><\/pre>\n<h2>\u4e09 \u624b\u64b8\u7b80\u5355web\u6846\u67b6<\/h2>\n<h3>3.1 main.py<\/h3>\n<pre><code class=\"language-yaml\">import socket\n\nimport pymysql\ndef index(request):\n    return &#039;&lt;img src=&quot;https:\/\/gss2.bdstatic.com\/9fo3dSag_xI4khGkpoWK1HF6hhy\/baike\/c0%3Dbaike92%2C5%2C5%2C92%2C30\/sign=5e3814acf9edab64607f4592965fc4a6\/14ce36d3d539b600c0c465d0eb50352ac65cb74b.jpg&quot;&gt;&lt;\/img&gt;&#039;\n\ndef login(request):\n    with open(&#039;login.html&#039;,&#039;r&#039;,encoding=&#039;utf-8&#039;) as f :\n        data=f.read()\n    return data\ndef time(request):\n    import datetime\n    now=datetime.datetime.now().strftime(&#039;%Y-%m-%d %X&#039;)\n    with open(&#039;time.html&#039;,&#039;r&#039;,encoding=&#039;utf-8&#039;) as f :\n        data=f.read()\n    data=data.replace(&#039;@@time@@&#039;,now)\n    return data\ndef user_list(request):\n    # \u521b\u5efa\u8fde\u63a5\n    conn = pymysql.connect(host=&#039;127.0.0.1&#039;, port=3306, user=&#039;root&#039;, passwd=&#039;123456&#039;, db=&#039;lqz&#039;)\n    cursor = conn.cursor(cursor=pymysql.cursors.DictCursor)\n    cursor.execute(&quot;select id,name,password from user&quot;)\n    user_list = cursor.fetchall()\n    cursor.close()\n    conn.close()\n    tr_list=[]\n    for row in user_list:\n        tr=&#039;&lt;tr&gt;&lt;td&gt;%s&lt;\/td&gt;&lt;td&gt;%s&lt;\/td&gt;&lt;td&gt;%s&lt;\/td&gt;&lt;\/tr&gt;&#039;%(row[&#039;id&#039;],row[&#039;name&#039;],row[&#039;password&#039;])\n        tr_list.append(tr)\n\n    with open(&#039;user_list.html&#039;,&#039;r&#039;,encoding=&#039;utf-8&#039;) as f:\n        data=f.read()\n    data=data.replace(&#039;@@body@@&#039;,&#039;&#039;.join(tr_list))\n    return data\n\ndef user_list_new(request):\n    # \u521b\u5efa\u8fde\u63a5\n    conn = pymysql.connect(host=&#039;127.0.0.1&#039;, port=3306, user=&#039;root&#039;, passwd=&#039;123456&#039;, db=&#039;lqz&#039;)\n    cursor = conn.cursor(cursor=pymysql.cursors.DictCursor)\n    cursor.execute(&quot;select id,name,password from user&quot;)\n    user_list = cursor.fetchall()\n    cursor.close()\n    conn.close()\n    with open(&#039;user_list_new.html&#039;,&#039;r&#039;,encoding=&#039;utf-8&#039;) as f:\n        data=f.read()\n    from jinja2 import Template\n    template=Template(data)\n    response=template.render(user_list=user_list)\n    # response=template.render({&#039;user_list&#039;:user_list})\n    return response\n\nurls = [\n    (&#039;\/index&#039;, index),\n    (&#039;\/login&#039;, login),\n    (&#039;\/time&#039;, time),\n    (&#039;\/user_list&#039;, user_list),\n    (&#039;\/user_list_new&#039;, user_list_new),\n]\n\ndef run():\n    soc = socket.socket()\n    soc.bind((&#039;127.0.0.1&#039;, 8006))\n    soc.listen(5)\n    while True:\n        conn, port = soc.accept()\n        data = conn.recv(1024)\n        # data=data.decode(&#039;utf-8&#039;)\n        print(data)\n        data = str(data, encoding=&#039;utf-8&#039;)\n        request_list = data.split(&#039;\\r\\n\\r\\n&#039;)\n        head_list = request_list[0].split(&#039;\\r\\n&#039;)\n        method, url, htt = head_list[0].split(&#039; &#039;)\n        # conn.send(b&#039;hello web&#039;)\n        conn.send(b&#039;HTTP\/1.1 200 OK \\r\\n\\r\\n&#039;)\n        print(url)\n        func_name = None\n        for u in urls:\n            if url == u[0]:\n                func_name = u[1]\n                break\n        if func_name:\n            response = func_name(data)\n        else:\n            response = &#039;404 not found&#039;\n\n        conn.send(response.encode(&#039;utf-8&#039;))\n        conn.close()\n\nif __name__ == &#039;__main__&#039;:\n    run()\n<\/code><\/pre>\n<h3>3.2 login.html<\/h3>\n<pre><code class=\"language-yaml\">&lt;!DOCTYPE html&gt;\n&lt;html lang=&quot;en&quot;&gt;\n&lt;head&gt;\n    &lt;meta charset=&quot;UTF-8&quot;&gt;\n    &lt;title&gt;Title&lt;\/title&gt;\n&lt;\/head&gt;\n&lt;body&gt;\n\n&lt;form action=&quot;&quot;&gt;\n    &lt;p&gt;\u7528\u6237\u540d\uff1a&lt;input type=&quot;text&quot;&gt;&lt;\/p&gt;\n    &lt;p&gt;\u5bc6\u7801\uff1a&lt;input type=&quot;password&quot;&gt;&lt;\/p&gt;\n\n&lt;\/form&gt;\n&lt;\/body&gt;\n&lt;\/html&gt;<\/code><\/pre>\n<h3>3.3 time.html<\/h3>\n<pre><code class=\"language-yaml\">&lt;!DOCTYPE html&gt;\n&lt;html lang=&quot;en&quot;&gt;\n&lt;head&gt;\n    &lt;meta charset=&quot;UTF-8&quot;&gt;\n    &lt;title&gt;Title&lt;\/title&gt;\n&lt;\/head&gt;\n&lt;body&gt;\n\n@@time@@\n&lt;\/body&gt;\n&lt;\/html&gt;\n<\/code><\/pre>\n<h3>3.4 user_list.html<\/h3>\n<pre><code class=\"language-yaml\">&lt;!DOCTYPE html&gt;\n&lt;html lang=&quot;en&quot;&gt;\n&lt;head&gt;\n    &lt;meta charset=&quot;UTF-8&quot;&gt;\n    &lt;title&gt;\u7528\u6237\u5217\u8868&lt;\/title&gt;\n&lt;\/head&gt;\n&lt;body&gt;\n\n&lt;table border=&quot;1&quot;&gt;\n    &lt;thead&gt;\n        &lt;tr&gt;\n            &lt;th&gt;id&lt;\/th&gt;\n            &lt;th&gt;\u7528\u6237\u540d&lt;\/th&gt;\n            &lt;th&gt;\u5bc6\u7801&lt;\/th&gt;\n        &lt;\/tr&gt;\n    &lt;\/thead&gt;\n    &lt;tbody&gt;\n        @@body@@\n    &lt;\/tbody&gt;\n\n&lt;\/table&gt;\n\n&lt;\/body&gt;\n&lt;\/html&gt;\n<\/code><\/pre>\n<h3>3.5 user_list_new<\/h3>\n<pre><code class=\"language-yaml\">&lt;!DOCTYPE html&gt;\n&lt;html lang=&quot;en&quot;&gt;\n&lt;head&gt;\n    &lt;meta charset=&quot;UTF-8&quot;&gt;\n    &lt;title&gt;\u7528\u6237\u5217\u8868&lt;\/title&gt;\n&lt;\/head&gt;\n&lt;body&gt;\n&lt;table border=&quot;1&quot;&gt;\n    &lt;thead&gt;\n    &lt;tr&gt;\n        &lt;th&gt;id&lt;\/th&gt;\n        &lt;th&gt;name&lt;\/th&gt;\n        &lt;th&gt;password&lt;\/th&gt;\n    &lt;\/tr&gt;\n    &lt;\/thead&gt;\n    &lt;tbody&gt;\n\n    {% for user in user_list%}\n    &lt;tr&gt;\n        &lt;td&gt;{{user.id}}&lt;\/td&gt;\n        &lt;td&gt;{{user.name}}&lt;\/td&gt;\n        &lt;td&gt;{{user.password}}&lt;\/td&gt;\n    &lt;\/tr&gt;\n    {%endfor%}\n\n    &lt;\/tbody&gt;\n\n&lt;\/table&gt;\n\n&lt;\/body&gt;\n&lt;\/html&gt;\n<\/code><\/pre>\n","protected":false},"excerpt":{"rendered":"<p>1-Web\u5e94\u7528 \u4e00 Web\u5e94\u7528\u7a0b\u5e8f\u662f\u4ec0\u4e48 Web\u5e94\u7528\u7a0b\u5e8f\u662f\u4e00\u79cd\u53ef\u4ee5\u901a\u8fc7Web\u8bbf\u95ee\u7684\u5e94\u7528\u7a0b\u5e8f\uff0c\u7a0b\u5e8f\u7684\u6700\u5927\u597d\u5904\u662f\u7528 [&hellip;]<\/p>\n","protected":false},"author":3,"featured_media":5818,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":[],"categories":[385,393],"tags":[],"_links":{"self":[{"href":"https:\/\/egonlin.com\/index.php?rest_route=\/wp\/v2\/posts\/5864"}],"collection":[{"href":"https:\/\/egonlin.com\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/egonlin.com\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/egonlin.com\/index.php?rest_route=\/wp\/v2\/users\/3"}],"replies":[{"embeddable":true,"href":"https:\/\/egonlin.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=5864"}],"version-history":[{"count":0,"href":"https:\/\/egonlin.com\/index.php?rest_route=\/wp\/v2\/posts\/5864\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/egonlin.com\/index.php?rest_route=\/wp\/v2\/media\/5818"}],"wp:attachment":[{"href":"https:\/\/egonlin.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=5864"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/egonlin.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=5864"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/egonlin.com\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=5864"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}