{"id":51498,"date":"2025-08-10T23:29:55","date_gmt":"2025-08-10T15:29:55","guid":{"rendered":"https:\/\/www.wsisp.com\/helps\/51498.html"},"modified":"2025-08-10T23:29:55","modified_gmt":"2025-08-10T15:29:55","slug":"how-websites-work-%e7%bd%91%e7%ab%99%e5%a6%82%e4%bd%95%e8%bf%90%e4%bd%9c","status":"publish","type":"post","link":"https:\/\/www.wsisp.com\/helps\/51498.html","title":{"rendered":"How Websites Work \u7f51\u7ad9\u5982\u4f55\u8fd0\u4f5c"},"content":{"rendered":"<h5 id=\"njHYM\">\u5b98\u65b9\u89c6\u9891\u94fe\u63a5<\/h5>\n<p id=\"u627d83a1\">https:\/\/www.youtube.com\/watch?v&#061;iWoiwFRLV4I<\/p>\n<h2 id=\"F2Fu5\">Task1 How websites work \u7f51\u7ad9\u5982\u4f55\u5de5\u4f5c<\/h2>\n<h5 id=\"L0Fuq\">\u56fe\u7247\u7248<\/h5>\n<p id=\"u152ec1e4\">\n<p class=\"img-center\"><img loading=\"lazy\" decoding=\"async\" alt=\"\" height=\"655\" id=\"u1dccb8d7\" src=\"https:\/\/www.wsisp.com\/helps\/wp-content\/uploads\/2025\/08\/20250810152944-6898bae8e19e5.png\" width=\"1323\" \/><\/p>\n<p id=\"ue13ea9a8\">\n<p class=\"img-center\"><img loading=\"lazy\" decoding=\"async\" alt=\"\" height=\"535\" id=\"u856f6a50\" src=\"https:\/\/www.wsisp.com\/helps\/wp-content\/uploads\/2025\/08\/20250810152945-6898bae9684bf.png\" width=\"1286\" \/><\/p>\n<p id=\"ue2e407f9\">\n<p class=\"img-center\"><img loading=\"lazy\" decoding=\"async\" alt=\"\" height=\"327\" id=\"u0b700d4d\" src=\"https:\/\/www.wsisp.com\/helps\/wp-content\/uploads\/2025\/08\/20250810152945-6898bae9ab39d.png\" width=\"1263\" \/><\/p>\n<h5 id=\"PxDnj\">\u6587\u5b57\u7248<\/h5>\n<p id=\"u6824d42e\">By the end of this room, you&#039;ll know how websites are created and will be introduced to some basic security issues. \u5728\u672c\u8bfe\u7ed3\u675f\u65f6&#xff0c;\u4f60\u5c06\u4e86\u89e3\u7f51\u7ad9\u662f\u5982\u4f55\u521b\u5efa\u7684&#xff0c;\u5e76\u5c06\u88ab\u4ecb\u7ecd\u4e00\u4e9b\u57fa\u672c\u7684\u5b89\u5168\u95ee\u9898\u3002<\/p>\n<p id=\"u8ec15c50\">When you visit a website, your browser (like Safari or Google Chrome) makes a request to a web server asking for information about the page you&#039;re visiting. It will respond with data that your browser uses to show you the page; a web server is just a dedicated computer somewhere else in the world that handles your requests. \u5f53\u4f60\u8bbf\u95ee\u4e00\u4e2a\u7f51\u7ad9\u65f6&#xff0c;\u4f60\u7684\u6d4f\u89c8\u5668 (\u5982 Safari \u6216 Google Chrome) \u4f1a\u5411 Web \u670d\u52a1\u5668\u53d1\u51fa\u8bf7\u6c42&#xff0c;\u8be2\u95ee\u5173\u4e8e\u4f60\u6b63\u5728\u8bbf\u95ee\u7684\u9875\u9762\u7684\u4fe1\u606f\u3002\u5b83\u4f1a\u4ee5\u4f60\u7684\u6d4f\u89c8\u5668\u7528\u6765\u5411\u4f60\u663e\u793a\u9875\u9762\u7684\u6570\u636e\u4f5c\u4e3a\u54cd\u5e94&#xff1b;Web \u670d\u52a1\u5668\u53ea\u662f\u4e16\u754c\u4e0a\u5176\u4ed6\u5730\u65b9\u7684\u4e00\u53f0\u4e13\u7528\u8ba1\u7b97\u673a&#xff0c;\u8d1f\u8d23\u5904\u7406\u4f60\u7684\u8bf7\u6c42\u3002<\/p>\n<p id=\"u4c791131\">\n<p class=\"img-center\"><img loading=\"lazy\" decoding=\"async\" alt=\"\" height=\"404\" id=\"u6653a831\" src=\"https:\/\/www.wsisp.com\/helps\/wp-content\/uploads\/2025\/08\/20250810152945-6898bae9e1d82.png\" width=\"1280\" \/><\/p>\n<p id=\"u2e2e710c\">\n<p class=\"img-center\"><img loading=\"lazy\" decoding=\"async\" alt=\"\" height=\"439\" id=\"uab5179b0\" src=\"https:\/\/www.wsisp.com\/helps\/wp-content\/uploads\/2025\/08\/20250810152946-6898baea24e9e.png\" width=\"1239\" \/><\/p>\n<p id=\"ua6708fe7\">\n<p id=\"ufcab19e7\">There are two major components that make up a website: \u7f51\u7ad9\u4e3b\u8981\u7531\u4e24\u4e2a\u7ec4\u6210\u90e8\u5206\u6784\u6210&#xff1a;<\/p>\n<li id=\"udebaab5d\">Front End (Client-Side) &#8211; the way your browser renders a website. \u524d\u7aef (\u5ba2\u6237\u7aef)\u2014\u2014 \u6d4f\u89c8\u5668\u5448\u73b0\u7f51\u7ad9\u7684\u65b9\u5f0f\u3002<\/li>\n<li id=\"ub67fdbff\">Back End (Server-Side) &#8211; a server that processes your request and returns a response. \u540e\u7aef (Server-Side)\u2014\u2014 \u5904\u7406\u4f60\u7684\u8bf7\u6c42\u5e76\u8fd4\u56de\u54cd\u5e94\u7684\u670d\u52a1\u5668\u3002<\/li>\n<p id=\"ue26996a8\">There are many other processes involved in your browser making a request to a web server, but for now, you just need to understand that you make a request to a server, and it responds with data your browser uses to render information to you. \u6d4f\u89c8\u5668\u5411 Web \u670d\u52a1\u5668\u53d1\u51fa\u8bf7\u6c42\u8fd8\u6d89\u53ca\u8bb8\u591a\u5176\u4ed6\u8fc7\u7a0b&#xff0c;\u4f46\u76ee\u524d&#xff0c;\u4f60\u53ea\u9700\u8981\u7406\u89e3\u4f60\u5411\u670d\u52a1\u5668\u53d1\u51fa\u4e86\u8bf7\u6c42&#xff0c;\u670d\u52a1\u5668\u4f1a\u7528\u6d4f\u89c8\u5668\u7528\u4e8e\u5411\u4f60\u5448\u73b0\u4fe1\u606f\u7684\u6570\u636e\u8fdb\u884c\u54cd\u5e94\u3002<\/p>\n<h5 id=\"HaFUg\">\u95ee\u9898<\/h5>\n<p id=\"u844b1464\">\n<p class=\"img-center\"><img loading=\"lazy\" decoding=\"async\" alt=\"\" height=\"209\" id=\"uf6fe9c88\" src=\"https:\/\/www.wsisp.com\/helps\/wp-content\/uploads\/2025\/08\/20250810152946-6898baea76184.png\" width=\"1272\" \/><\/p>\n<h5 id=\"DXojZ\">\u7b54\u6848<\/h5>\n<p id=\"uc2ddba13\">\n<p class=\"img-center\"><img loading=\"lazy\" decoding=\"async\" alt=\"\" height=\"193\" id=\"ub5d6b721\" src=\"https:\/\/www.wsisp.com\/helps\/wp-content\/uploads\/2025\/08\/20250810152946-6898baea9e58f.png\" width=\"1285\" \/><\/p>\n<h2 id=\"O3Ivo\">Task2 HTML<\/h2>\n<h5 id=\"PTBmy\">\u56fe\u7247\u7248<\/h5>\n<p id=\"uaa6a9f30\">\n<p class=\"img-center\"><img loading=\"lazy\" decoding=\"async\" alt=\"\" height=\"564\" id=\"u8d63d392\" src=\"https:\/\/www.wsisp.com\/helps\/wp-content\/uploads\/2025\/08\/20250810152946-6898baeab9f77.png\" width=\"1276\" \/><\/p>\n<p id=\"u6e4f47b0\">\n<p class=\"img-center\"><img loading=\"lazy\" decoding=\"async\" alt=\"\" height=\"514\" id=\"u3be5feed\" src=\"https:\/\/www.wsisp.com\/helps\/wp-content\/uploads\/2025\/08\/20250810152947-6898baeb15eb5.png\" width=\"1258\" \/><\/p>\n<p id=\"u01c2aa20\">\n<p class=\"img-center\"><img loading=\"lazy\" decoding=\"async\" alt=\"\" height=\"395\" id=\"u4bcd6386\" src=\"https:\/\/www.wsisp.com\/helps\/wp-content\/uploads\/2025\/08\/20250810152947-6898baeb62347.png\" width=\"1271\" \/><\/p>\n<h5 id=\"Div0W\">\u6587\u5b57\u7248<\/h5>\n<p id=\"u051ffef5\">Websites are primarily created using: \u7f51\u7ad9\u4e3b\u8981\u662f\u901a\u8fc7\u4ee5\u4e0b\u65b9\u5f0f\u521b\u5efa\u7684&#xff1a;<\/p>\n<ul>\n<li id=\"uad4d3b14\">HTML, to build websites and define their structure HTML, \u7528\u4e8e\u6784\u5efa\u7f51\u7ad9\u5e76\u5b9a\u4e49\u5176\u7ed3\u6784<\/li>\n<li id=\"ue4740a99\">CSS, to make websites look pretty by adding styling options CSS, \u901a\u8fc7\u6dfb\u52a0\u6837\u5f0f\u9009\u9879\u4f7f\u7f51\u7ad9\u770b\u8d77\u6765\u6f02\u4eae<\/li>\n<li id=\"u63d3c497\">JavaScript, implement complex features on pages using interactivity JavaScript, \u4f7f\u7528\u4ea4\u4e92\u6027\u5728\u9875\u9762\u4e0a\u5b9e\u73b0\u590d\u6742\u7684\u529f\u80fd<\/li>\n<\/ul>\n<p id=\"u89ac54ab\">HyperText Markup Language (HTML) is the language websites are written in. Elements (also known as tags) are the building blocks of HTML pages and tells the browser how to display content. The code snippet below shows a simple HTML document, the structure of which is the same for every website: \u8d85\u6587\u672c\u6807\u8bb0\u8bed\u8a00 (HTML) \u662f\u7528\u4e8e\u7f16\u5199\u7f51\u7ad9\u7684\u8bed\u8a00\u3002\u5143\u7d20 (\u4e5f\u79f0\u4e3a\u6807\u7b7e) \u662f HTML \u9875\u9762\u7684\u6784\u5efa\u5757&#xff0c;\u544a\u8bc9\u6d4f\u89c8\u5668\u5982\u4f55\u663e\u793a\u5185\u5bb9\u3002\u4e0b\u9762\u7684\u4ee3\u7801\u7247\u6bb5\u663e\u793a\u4e86\u4e00\u4e2a\u7b80\u5355\u7684 HTML \u6587\u6863&#xff0c;\u5176\u7ed3\u6784\u5bf9\u4e8e\u6bcf\u4e2a\u7f51\u7ad9\u90fd\u662f\u76f8\u540c\u7684&#xff1a;<\/p>\n<p id=\"u0558e51a\">\n<p class=\"img-center\"><img loading=\"lazy\" decoding=\"async\" alt=\"\" height=\"206\" id=\"u89398a51\" src=\"https:\/\/www.wsisp.com\/helps\/wp-content\/uploads\/2025\/08\/20250810152947-6898baebe052a.png\" width=\"328\" \/><\/p>\n<p id=\"u053913a8\">The HTML structure (as shown in the screenshot) has the following components: HTML \u7ed3\u6784 (\u5982\u622a\u56fe\u6240\u793a) \u5305\u542b\u4ee5\u4e0b\u7ec4\u4ef6&#xff1a;<\/p>\n<ul>\n<li id=\"ucdc9182a\">The &lt;!DOCTYPE html&gt; defines that the page is a HTML5 document. This helps with standardisation across different browsers and tells the browser to use HTML5 to interpret the page. &lt;!DOCTYPE html&gt; \u5c06\u9875\u9762\u5b9a\u4e49\u4e3a HTML5 \u6587\u6863\u3002\u8fd9\u6709\u52a9\u4e8e\u5728\u4e0d\u540c\u6d4f\u89c8\u5668\u4e4b\u95f4\u5b9e\u73b0\u6807\u51c6\u5316&#xff0c;\u5e76\u544a\u8bc9\u6d4f\u89c8\u5668\u4f7f\u7528 HTML5 \u6765\u89e3\u91ca\u9875\u9762\u3002<\/li>\n<li id=\"ua7eefcf5\">The &lt;html&gt; element is the root element of the HTML page &#8211; all other elements come after this element. &lt;html&gt; \u5143\u7d20\u662f HTML \u9875\u9762\u7684\u6839\u5143\u7d20 \u2014\u2014 \u6240\u6709\u5176\u4ed6\u5143\u7d20\u90fd\u4f4d\u4e8e\u8be5\u5143\u7d20\u4e4b\u540e\u3002<\/li>\n<li id=\"ucecb0fe8\">The &lt;head&gt; element contains information about the page (such as the page title) &lt;head&gt; \u5143\u7d20\u5305\u542b\u6709\u5173\u9875\u9762\u7684\u4fe1\u606f (\u5982\u9875\u9762\u6807\u9898)<\/li>\n<li id=\"ue214d579\">The &lt;body&gt; element defines the HTML document&#039;s body; only content inside of the body is shown in the browser. &lt;body&gt; \u5143\u7d20\u5b9a\u4e49 HTML \u6587\u6863\u7684\u4e3b\u4f53&#xff1b;\u6d4f\u89c8\u5668\u53ea\u663e\u793a\u4e3b\u4f53\u5185\u90e8\u7684\u5185\u5bb9\u3002<\/li>\n<li id=\"u36da26cd\">The &lt;h1&gt; element defines a large heading &lt;h1&gt; \u5143\u7d20\u5b9a\u4e49\u4e00\u4e2a\u5927\u6807\u9898<\/li>\n<li id=\"u0043de17\">The &lt;p&gt; element defines a paragraph &lt;p&gt; \u5143\u7d20\u5b9a\u4e49\u4e00\u4e2a\u6bb5\u843d<\/li>\n<li id=\"uffc9bcd7\">There are many other elements (tags) used for different purposes. For example, there are tags for buttons (&lt;button&gt;), images (&lt;img&gt;), lists, and much more.  \u8fd8\u6709\u8bb8\u591a\u5176\u4ed6\u5143\u7d20 (\u6807\u7b7e) \u7528\u4e8e\u4e0d\u540c\u7684\u76ee\u7684\u3002\u4f8b\u5982&#xff0c;\u6709\u7528\u4e8e\u6309\u94ae (&lt;button&gt;)\u3001\u56fe\u50cf (&lt;img&gt;)\u3001\u5217\u8868\u7b49\u7684\u6807\u7b7e\u3002<\/li>\n<\/ul>\n<p id=\"u147c303d\">Tags can contain attributes such as the class attribute which can be used to style an element (e.g. make the tag a different color) &lt;p class&#061;&#034;bold-text&#034;&gt;, or the src attribute which is used on images to specify the location of an image: &lt;img src&#061;&#034;img\/cat.jpg&#034;&gt;.An element can have multiple attributes each with its own unique purpose, e.g., &lt;p attribute1&#061;&#034;value1&#034; attribute2&#061;&#034;value2&#034;&gt;. \u6807\u7b7e\u53ef\u4ee5\u5305\u542b\u5c5e\u6027&#xff0c;\u4f8b\u5982\u7528\u4e8e\u6837\u5f0f\u5316\u5143\u7d20\u7684 class \u5c5e\u6027 (\u4f8b\u5982&#xff0c;\u4f7f\u6807\u7b7e\u5177\u6709\u4e0d\u540c\u7684\u989c\u8272)&lt;p class&#061;\u201c\u7c97\u4f53\u6587\u672c\u201d&gt;, \u6216\u7528\u4e8e\u56fe\u50cf\u7684 src \u5c5e\u6027\u6765\u6307\u5b9a\u56fe\u50cf\u7684\u4f4d\u7f6e&#xff1a;&lt;img src&#061;\u201cimg\/cat.jpg\u201d&gt;\u3002\u5143\u7d20\u53ef\u4ee5\u5177\u6709\u591a\u4e2a\u5c5e\u6027&#xff0c;\u6bcf\u4e2a\u5c5e\u6027\u90fd\u6709\u5176\u72ec\u7279\u7684\u7528\u9014&#xff0c;\u4f8b\u5982&#xff0c;&lt;p attribute1&#061;\u201cvalue1\u201d attribute2&#061;\u201cvalue2\u201d&gt;\u3002<\/p>\n<p id=\"ufbf4ec4c\">Elements can also have an id attribute (&lt;p id&#061;&#034;example&#034;&gt;), which is unique to the element. Unlike the class attribute, where multiple elements can use the same class, an element must have different id&#039;s to identify them uniquely. Element id&#039;s are used for styling and to identify it by JavaScript. \u5143\u7d20\u4e5f\u53ef\u4ee5\u6709\u4e00\u4e2a id \u5c5e\u6027 (&lt;p id&#061;\u201cexample\u201d&gt;), \u8fd9\u4e2a\u5c5e\u6027\u5bf9\u5143\u7d20\u6765\u8bf4\u662f\u552f\u4e00\u7684\u3002\u4e0e class \u5c5e\u6027\u4e0d\u540c&#xff0c;\u5728 class \u5c5e\u6027\u4e2d&#xff0c;\u591a\u4e2a\u5143\u7d20\u53ef\u4ee5\u4f7f\u7528\u76f8\u540c\u7684\u7c7b&#xff0c;\u800c\u5143\u7d20\u5fc5\u987b\u6709\u4e0d\u540c\u7684 id \u624d\u80fd\u552f\u4e00\u6807\u8bc6\u5b83\u4eec\u3002\u5143\u7d20\u7684 id \u7528\u4e8e\u6837\u5f0f\u8bbe\u8ba1\u548c JavaScript \u6807\u8bc6\u3002<\/p>\n<p id=\"u6b64489f\">You can view the HTML of any website by right-clicking and selecting &#034;View Page Source&#034; (Chrome) \/ &#034;Show Page Source&#034; (Safari). \u60a8\u53ef\u4ee5\u901a\u8fc7\u53f3\u952e\u5355\u51fb\u5e76\u9009\u62e9 \u201c\u67e5\u770b\u9875\u9762\u6e90\u4ee3\u7801\u201d(Chrome)\/\u201c\u663e\u793a\u9875\u9762\u6e90\u4ee3\u7801\u201d(Safari) \u6765\u67e5\u770b\u4efb\u4f55\u7f51\u7ad9\u7684 HTML\u3002<\/p>\n<h5 id=\"Yk7lW\">\u95ee\u9898<\/h5>\n<p id=\"u0a01622b\">\n<p class=\"img-center\"><img loading=\"lazy\" decoding=\"async\" alt=\"\" height=\"540\" id=\"uddbfc7c9\" src=\"https:\/\/www.wsisp.com\/helps\/wp-content\/uploads\/2025\/08\/20250810152948-6898baec37705.png\" width=\"1293\" \/><\/p>\n<h5 id=\"v4eUD\">\u7b54\u6848<\/h5>\n<h6 id=\"a3sGM\">\u95ee\u9898\u4e00<\/h6>\n<p id=\"u23b58efb\">\u70b9\u51fb\u4e00\u4e0b\u90a3\u4e2aview site<\/p>\n<p id=\"ufea95386\">\u5c31\u884c<\/p>\n<h6 id=\"Cg1ua\">\u95ee\u9898\u4e8c<\/h6>\n<p id=\"uefa3f7df\">\n<p class=\"img-center\"><img loading=\"lazy\" decoding=\"async\" alt=\"\" height=\"865\" id=\"u75b57299\" src=\"https:\/\/www.wsisp.com\/helps\/wp-content\/uploads\/2025\/08\/20250810152948-6898baecc92bc.png\" width=\"1049\" \/><\/p>\n<p id=\"ueac1c7c4\">\u6539\u5b8c\u4e4b<\/p>\n<p id=\"u389166c1\">\n<p class=\"img-center\"><img loading=\"lazy\" decoding=\"async\" alt=\"\" height=\"856\" id=\"u3e107a0c\" src=\"https:\/\/www.wsisp.com\/helps\/wp-content\/uploads\/2025\/08\/20250810152949-6898baedae17a.png\" width=\"1050\" \/><\/p>\n<p id=\"u74e2cfb8\">\u7b54\u6848\u5c31\u662f\u56fe\u7247\u91cc\u9762\u7684 HTMLHERO<\/p>\n<p id=\"u55c30bc4\">\n<h6 id=\"GLa8G\">\u95ee\u9898\u4e09<\/h6>\n<p id=\"u36cab119\">\n<p class=\"img-center\"><img loading=\"lazy\" decoding=\"async\" alt=\"\" height=\"878\" id=\"u218a0bea\" src=\"https:\/\/www.wsisp.com\/helps\/wp-content\/uploads\/2025\/08\/20250810152950-6898baee87760.png\" width=\"1020\" \/><\/p>\n<p id=\"uad370f3f\">\n<p class=\"img-center\"><img loading=\"lazy\" decoding=\"async\" alt=\"\" height=\"874\" id=\"u6fa9ff15\" src=\"https:\/\/www.wsisp.com\/helps\/wp-content\/uploads\/2025\/08\/20250810152951-6898baef2edb8.png\" width=\"1044\" \/><\/p>\n<p>&lt;img src&#061;&#039;img\/dog-1.png&#039;&gt; <\/p>\n<p id=\"uc83f4570\">\n<p class=\"img-center\"><img loading=\"lazy\" decoding=\"async\" alt=\"\" height=\"880\" id=\"u60a217e0\" src=\"https:\/\/www.wsisp.com\/helps\/wp-content\/uploads\/2025\/08\/20250810152952-6898baf02d81f.png\" width=\"1041\" \/><\/p>\n<p id=\"u578c974f\">\n<p id=\"u98288d1f\">\n<p id=\"u0928871a\">\n<p class=\"img-center\"><img loading=\"lazy\" decoding=\"async\" alt=\"\" height=\"615\" id=\"ue67b256c\" src=\"https:\/\/www.wsisp.com\/helps\/wp-content\/uploads\/2025\/08\/20250810152953-6898baf13743b.png\" width=\"816\" \/><\/p>\n<h2 id=\"TaGBC\">Task3 JavaScript<\/h2>\n<h5 id=\"xa0Qh\">\u56fe\u7247\u7248<\/h5>\n<p id=\"u881436f9\">\n<p class=\"img-center\"><img loading=\"lazy\" decoding=\"async\" alt=\"\" height=\"533\" id=\"u014d226e\" src=\"https:\/\/www.wsisp.com\/helps\/wp-content\/uploads\/2025\/08\/20250810152953-6898baf19c938.png\" width=\"1316\" \/><\/p>\n<h5 id=\"vZmxk\">\u6587\u5b57\u7248<\/h5>\n<p id=\"ub9632ed6\">JavaScript (JS) is one of the most popular coding languages in the world and allows pages to become interactive. HTML is used to create the website structure and content, while JavaScript is used to control the functionality of web pages &#8211; without JavaScript, a page would not have interactive elements and would always be static. JS can dynamically update the page in real-time, giving functionality to change the style of a button when a particular event on the page occurs (such as when a user clicks a button) or to display moving animations. JavaScript (JS) \u662f\u4e16\u754c\u4e0a\u6700\u6d41\u884c\u7684\u7f16\u7a0b\u8bed\u8a00\u4e4b\u4e00&#xff0c;\u5b83\u5141\u8bb8\u9875\u9762\u53d8\u5f97\u5177\u6709\u4ea4\u4e92\u6027\u3002HTML \u7528\u4e8e\u521b\u5efa\u7f51\u7ad9\u7ed3\u6784\u548c\u5185\u5bb9&#xff0c;\u800c JavaScript \u7528\u4e8e\u63a7\u5236 Web \u9875\u9762\u7684\u529f\u80fd \u2014\u2014 \u5982\u679c\u6ca1\u6709 JavaScript, \u9875\u9762\u5c06\u6ca1\u6709\u4ea4\u4e92\u5143\u7d20&#xff0c;\u5e76\u4e14\u59cb\u7ec8\u662f\u9759\u6001\u7684\u3002JS \u53ef\u4ee5\u5b9e\u65f6\u52a8\u6001\u66f4\u65b0\u9875\u9762&#xff0c;\u5f53\u9875\u9762\u4e0a\u53d1\u751f\u7279\u5b9a\u4e8b\u4ef6\u65f6 (\u4f8b\u5982&#xff0c;\u5f53\u7528\u6237\u70b9\u51fb\u6309\u94ae\u65f6), \u53ef\u4ee5\u66f4\u6539\u6309\u94ae\u7684\u6837\u5f0f&#xff0c;\u6216\u663e\u793a\u52a8\u753b\u3002<\/p>\n<p id=\"u43dec951\">JavaScript is added within the page source code and can be either loaded within &lt;script&gt; tags or can be included remotely with the src attribute: &lt;script src&#061;&#034;\/location\/of\/javascript_file.js&#034;&gt;&lt;\/script&gt; JavaScript \u88ab\u6dfb\u52a0\u5230\u9875\u9762\u6e90\u4ee3\u7801\u4e2d&#xff0c;\u53ef\u4ee5\u5728 &lt;script&gt; \u6807\u7b7e\u4e2d\u52a0\u8f7d&#xff0c;\u4e5f\u53ef\u4ee5\u901a\u8fc7 src \u5c5e\u6027\u8fdc\u7a0b\u5305\u542b&#xff1a;&lt;script src&#061;&#034;\/location\/of\/javascript_file.js&#034;&gt;&lt;\/script&gt;<\/p>\n<p id=\"ua9b3eb6a\">The following JavaScript code finds a HTML element on the page with the id of &#034;demo&#034; and changes the element&#039;s contents to &#034;Hack the Planet&#034; : document.getElementById(&#034;demo&#034;).innerHTML &#061; &#034;Hack the Planet&#034;; \u4ee5\u4e0b JavaScript \u4ee3\u7801\u5728\u9875\u9762\u4e0a\u627e\u5230\u4e00\u4e2a ID \u4e3a \u201cdemo\u201d \u7684 HTML \u5143\u7d20&#xff0c;\u5e76\u5c06\u8be5\u5143\u7d20\u7684\u5185\u5bb9\u66f4\u6539\u4e3a \u201cHack the Planet\u201d:document.getElementById (&#034;demo&#034;).innerHTML &#061;\u201cHack the Planet\u201d;<\/p>\n<p id=\"uba214b2b\">HTML elements can also have events, such as &#034;onclick&#034; or &#034;onhover&#034; that execute JavaScript when the event occurs. The following code changes the text of the element with the demo ID to Button Clicked: &lt;button onclick&#061;&#039;document.getElementById(&#034;demo&#034;).innerHTML &#061; &#034;Button Clicked&#034;;&#039;&gt;Click Me!&lt;\/button&gt; &#8211; onclick events can also be defined inside the JavaScript script tags, and not on elements directly. HTML \u5143\u7d20\u4e5f\u53ef\u4ee5\u5305\u542b\u4e8b\u4ef6&#xff0c;\u4f8b\u5982 \u201conclick\u201d \u6216 \u201conhover\u201d, \u8fd9\u4e9b\u4e8b\u4ef6\u5728\u4e8b\u4ef6\u53d1\u751f\u65f6\u6267\u884c JavaScript\u3002\u4ee5\u4e0b\u4ee3\u7801\u5c06\u5177\u6709 demo ID \u7684\u5143\u7d20\u6587\u672c\u66f4\u6539\u4e3a \u201cButton Clicked\u201d:&lt;button \u03bfnclick&#061;\u2018document.getElementById (&#034;demo&#034;).innerHTML&#061;\u201cButton Clicked\u201d;\u2018&gt;Click Me!&lt;\/button&gt;\u2014\u2014onclick \u4e8b\u4ef6\u4e5f\u53ef\u4ee5\u5728 JavaScript \u811a\u672c\u6807\u7b7e\u4e2d\u5b9a\u4e49&#xff0c;\u800c\u4e0d\u662f\u76f4\u63a5\u5728\u5143\u7d20\u4e0a\u5b9a\u4e49\u3002<\/p>\n<h5 id=\"ZYgvg\">\u95ee\u9898<\/h5>\n<p id=\"u1db40858\">\n<p class=\"img-center\"><img loading=\"lazy\" decoding=\"async\" alt=\"\" height=\"345\" id=\"ueb078d79\" src=\"https:\/\/www.wsisp.com\/helps\/wp-content\/uploads\/2025\/08\/20250810152954-6898baf22b085.png\" width=\"1291\" \/><\/p>\n<h5 id=\"G39oN\">\u7b54\u6848<\/h5>\n<p id=\"u6afa096b\">\n<p class=\"img-center\"><img loading=\"lazy\" decoding=\"async\" alt=\"\" height=\"779\" id=\"u74e7fbc2\" src=\"2025-08-10lbkbit1nev1.png\" width=\"1030\" \/><\/p>\n<p id=\"ubc6beec7\">\n<p class=\"img-center\"><img loading=\"lazy\" decoding=\"async\" alt=\"\" height=\"930\" id=\"u2e9a25f7\" src=\"2025-08-10jaozbblrenf.png\" width=\"1249\" \/><\/p>\n<p id=\"u342ccec0\">\n<p class=\"img-center\"><img loading=\"lazy\" decoding=\"async\" alt=\"\" height=\"355\" id=\"udee978a4\" src=\"2025-08-10ygnw3dohzgo.png\" width=\"1310\" \/><\/p>\n<h2 id=\"X5M4k\">Task4 Sensitive Data Exposure \u654f\u611f\u6570\u636e\u66b4\u9732<\/h2>\n<h5 id=\"h0xe8\">\u56fe\u7247\u7248<\/h5>\n<p id=\"u956db583\">\n<p class=\"img-center\"><img loading=\"lazy\" decoding=\"async\" alt=\"\" height=\"625\" id=\"u4c702a27\" src=\"2025-08-100pxgxpp113j.png\" width=\"1299\" \/><\/p>\n<h5 id=\"mkm6V\">\u6587\u5b57\u7248<\/h5>\n<p id=\"u0515c175\">Sensitive Data Exposure occurs when a website doesn&#039;t properly protect (or remove) sensitive clear-text information to the end-user; usually found in a site&#039;s frontend source code. \u5f53\u7f51\u7ad9\u672a\u80fd\u9002\u5f53\u5730\u4fdd\u62a4 (\u6216\u5220\u9664) \u654f\u611f\u7684\u660e\u6587\u4fe1\u606f\u7ed9\u6700\u7ec8\u7528\u6237\u65f6&#xff0c;\u5c31\u4f1a\u53d1\u751f\u654f\u611f\u6570\u636e\u6cc4\u9732&#xff1b;\u8fd9\u4e9b\u4fe1\u606f\u901a\u5e38\u5b58\u5728\u4e8e\u7f51\u7ad9\u7684\u524d\u7aef\u6e90\u4ee3\u7801\u4e2d\u3002<\/p>\n<p id=\"u470fb4da\">We now know that websites are built using many HTML elements (tags), all of which we can see simply by &#034;viewing the page source&#034;. A website developer may have forgotten to remove login credentials, hidden links to private parts of the website or other sensitive data shown in HTML or JavaScript. \u6211\u4eec\u73b0\u5728\u77e5\u9053\u7f51\u7ad9\u662f\u4f7f\u7528\u8bb8\u591a HTML \u5143\u7d20 (\u6807\u7b7e) \u6784\u5efa\u7684&#xff0c;\u6240\u6709\u8fd9\u4e9b\u5143\u7d20\u90fd\u53ef\u4ee5\u901a\u8fc7\u7b80\u5355\u7684 \u201c\u67e5\u770b\u9875\u9762\u6e90\u4ee3\u7801\u201d \u6765\u67e5\u770b\u3002\u7f51\u7ad9\u5f00\u53d1\u4eba\u5458\u53ef\u80fd\u5fd8\u8bb0\u5220\u9664\u767b\u5f55\u51ed\u636e\u3001\u6307\u5411\u7f51\u7ad9\u79c1\u6709\u90e8\u5206\u7684\u9690\u85cf\u94fe\u63a5&#xff0c;\u6216\u8005 HTML \u6216 JavaScript \u4e2d\u663e\u793a\u7684\u5176\u4ed6\u654f\u611f\u6570\u636e\u3002<\/p>\n<p id=\"u8048aa4c\">\n<p class=\"img-center\"><img loading=\"lazy\" decoding=\"async\" alt=\"\" height=\"302\" id=\"u36000cbc\" src=\"2025-08-10qjwtgqbkfgk.png\" width=\"727\" \/><\/p>\n<p id=\"u8048aa4c\">Sensitive information can be potentially leveraged to further an attacker&#039;s access within different parts of a web application. For example, there could be HTML comments with temporary login credentials, and if you viewed the page&#039;s source code and found this, you could use these credentials to log in elsewhere on the application (or worse, used to access other backend components of the site). \u654f\u611f\u4fe1\u606f\u53ef\u80fd\u88ab\u7528\u4e8e\u8fdb\u4e00\u6b65\u5229\u7528\u653b\u51fb\u8005\u5bf9 Web \u5e94\u7528\u7a0b\u5e8f\u4e0d\u540c\u90e8\u5206\u7684\u8bbf\u95ee\u3002\u4f8b\u5982&#xff0c;\u53ef\u80fd\u4f1a\u51fa\u73b0\u5e26\u6709\u4e34\u65f6\u767b\u5f55\u51ed\u636e\u7684 HTML \u6ce8\u91ca&#xff0c;\u5982\u679c\u4f60\u67e5\u770b\u9875\u9762\u7684\u6e90\u4ee3\u7801\u5e76\u53d1\u73b0\u8fd9\u4e00\u70b9&#xff0c;\u4f60\u53ef\u4ee5\u4f7f\u7528\u8fd9\u4e9b\u51ed\u636e\u5728\u5e94\u7528\u7a0b\u5e8f\u7684\u5176\u4ed6\u5730\u65b9\u767b\u5f55 (\u6216\u8005\u66f4\u7cdf&#xff0c;\u7528\u4e8e\u8bbf\u95ee\u7f51\u7ad9\u7684\u5176\u4ed6\u540e\u7aef\u7ec4\u4ef6)\u3002<\/p>\n<p id=\"ucf02b7dc\">Whenever you&#039;re assessing a web application for security issues, one of the first things you should do is review the page source code to see if you can find any exposed login credentials or hidden links. \u6bcf\u5f53\u4f60\u8bc4\u4f30 Web \u5e94\u7528\u7a0b\u5e8f\u7684\u5b89\u5168\u95ee\u9898\u65f6&#xff0c;\u9996\u5148\u8981\u505a\u7684\u4e8b\u60c5\u4e4b\u4e00\u5c31\u662f\u68c0\u67e5\u9875\u9762\u6e90\u4ee3\u7801&#xff0c;\u770b\u770b\u662f\u5426\u80fd\u627e\u5230\u4efb\u4f55\u66b4\u9732\u7684\u767b\u5f55\u51ed\u636e\u6216\u9690\u85cf\u7684\u94fe\u63a5<\/p>\n<h5 id=\"ShcMr\">\u95ee\u9898<\/h5>\n<h5 id=\"NDOf2\">\u7b54\u6848<\/h5>\n<p id=\"u75f074bf\">\n<p class=\"img-center\"><img loading=\"lazy\" decoding=\"async\" alt=\"\" height=\"948\" id=\"uefb31bf2\" src=\"2025-08-102ok41pj3xbx.png\" width=\"1591\" \/><\/p>\n<p id=\"ubc028ac0\">\n<p class=\"img-center\"><img loading=\"lazy\" decoding=\"async\" alt=\"\" height=\"834\" id=\"u8f6352fd\" src=\"2025-08-10xhykzemrbnn.png\" width=\"1915\" \/><\/p>\n<p id=\"u530fb620\">\n<p class=\"img-center\"><img loading=\"lazy\" decoding=\"async\" alt=\"\" height=\"215\" id=\"ue7baaa54\" src=\"2025-08-101pjau4qruzk.png\" width=\"1275\" \/><\/p>\n<p id=\"u850075d5\">\n<p id=\"uecccdbeb\">\n<p id=\"u3dca7811\">\n<h2 id=\"nGcmZ\">Task5 HTML Injection HTML \u6ce8\u5165<\/h2>\n<h5 id=\"JCVRk\">\u56fe\u7247\u7248<\/h5>\n<p id=\"u59f5d624\">\n<p class=\"img-center\"><img loading=\"lazy\" decoding=\"async\" alt=\"\" height=\"365\" id=\"uca0b8b39\" src=\"2025-08-10kdifkog0tip.png\" width=\"1276\" \/><\/p>\n<p id=\"u613e5238\">\n<p class=\"img-center\"><img loading=\"lazy\" decoding=\"async\" alt=\"\" height=\"646\" id=\"u95961310\" src=\"2025-08-1040pbbmroupq.png\" width=\"1261\" \/><\/p>\n<p id=\"u224a7707\">\n<p class=\"img-center\"><img loading=\"lazy\" decoding=\"async\" alt=\"\" height=\"274\" id=\"ub15eb108\" src=\"2025-08-10tktehv13hah.png\" width=\"1260\" \/><\/p>\n<h5 id=\"Mq3Zu\">\u6587\u5b57\u7248<\/h5>\n<p id=\"udb9a4503\">HTML Injection is a vulnerability that occurs when unfiltered user input is displayed on the page. If a website fails to sanitise user input (filter any &#034;malicious&#034; text that a user inputs into a website), and that input is used on the page, an attacker can inject HTML code into a vulnerable website. HTML \u6ce8\u5165\u662f\u4e00\u79cd\u6f0f\u6d1e&#xff0c;\u5f53\u9875\u9762\u4e0a\u663e\u793a\u672a\u7ecf\u8fc7\u6ee4\u7684\u7528\u6237\u8f93\u5165\u65f6&#xff0c;\u5c31\u4f1a\u53d1\u751f\u8fd9\u79cd\u60c5\u51b5\u3002\u5982\u679c\u7f51\u7ad9\u672a\u80fd\u6e05\u7406\u7528\u6237\u8f93\u5165 (\u8fc7\u6ee4\u7528\u6237\u8f93\u5165\u5230\u7f51\u7ad9\u7684\u4efb\u4f55 \u201c\u6076\u610f\u201d \u6587\u672c), \u5e76\u4e14\u8be5\u8f93\u5165\u5728\u9875\u9762\u4e0a\u88ab\u4f7f\u7528&#xff0c;\u653b\u51fb\u8005\u5c31\u53ef\u4ee5\u5411\u6613\u53d7\u653b\u51fb\u7684\u7f51\u7ad9\u6ce8\u5165 HTML \u4ee3\u7801\u3002<\/p>\n<p id=\"uc00bd434\">Input sanitisation is very important in keeping a website secure, as information a user inputs into a website is often used in other frontend and backend functionality. A vulnerability you&#039;ll explore in another lab is database injection, where you can manipulate a database lookup query to log in as another user by controlling the input that&#039;s directly used in the query &#8211; but for now, let&#039;s focus on HTML injection (which is client-side). \u8f93\u5165\u6e05\u7406\u5bf9\u4e8e\u4fdd\u6301\u7f51\u7ad9\u5b89\u5168\u975e\u5e38\u91cd\u8981&#xff0c;\u56e0\u4e3a\u7528\u6237\u8f93\u5165\u7f51\u7ad9\u7684\u4fe1\u606f\u901a\u5e38\u7528\u4e8e\u5176\u4ed6\u524d\u7aef\u548c\u540e\u7aef\u529f\u80fd\u3002\u4f60\u5c06\u5728\u53e6\u4e00\u4e2a\u5b9e\u9a8c\u5ba4\u4e2d\u63a2\u8ba8\u7684\u4e00\u4e2a\u6f0f\u6d1e\u662f\u6570\u636e\u5e93\u6ce8\u5165&#xff0c;\u5728\u90a3\u91cc&#xff0c;\u4f60\u53ef\u4ee5\u901a\u8fc7\u63a7\u5236\u67e5\u8be2\u4e2d\u76f4\u63a5\u4f7f\u7528\u7684\u8f93\u5165\u6765\u64cd\u4f5c\u6570\u636e\u5e93\u67e5\u8be2\u67e5\u8be2&#xff0c;\u4ee5\u53e6\u4e00\u4e2a\u7528\u6237\u7684\u8eab\u4efd\u767b\u5f55 \u2014\u2014 \u4f46\u73b0\u5728&#xff0c;\u8ba9\u6211\u4eec\u96c6\u4e2d\u5173\u6ce8 HTML \u6ce8\u5165 (\u8fd9\u662f\u5ba2\u6237\u7aef\u7684\u529f\u80fd)\u3002<\/p>\n<p id=\"u21b79509\">When a user has control of how their input is displayed, they can submit HTML (or JavaScript) code, and the browser will use it on the page, allowing the user to control the page&#039;s appearance and functionality. \u5f53\u7528\u6237\u53ef\u4ee5\u63a7\u5236\u5176\u8f93\u5165\u7684\u663e\u793a\u65b9\u5f0f\u65f6&#xff0c;\u4ed6\u4eec\u53ef\u4ee5\u63d0\u4ea4 HTML (\u6216 JavaScript) \u4ee3\u7801&#xff0c;\u6d4f\u89c8\u5668\u5c06\u5728\u9875\u9762\u4e0a\u4f7f\u7528\u8be5\u4ee3\u7801&#xff0c;\u4ece\u800c\u5141\u8bb8\u7528\u6237\u63a7\u5236\u9875\u9762\u7684\u5916\u89c2\u548c\u529f\u80fd\u3002<\/p>\n<p id=\"ue8bf6514\">\n<p class=\"img-center\"><img loading=\"lazy\" decoding=\"async\" alt=\"\" height=\"649\" id=\"u3b604733\" src=\"2025-08-10v253es4s0cf.png\" width=\"1256\" \/><\/p>\n<p id=\"u65372482\">\n<p class=\"img-center\"><img loading=\"lazy\" decoding=\"async\" alt=\"\" height=\"633\" id=\"uc931b7d7\" src=\"2025-08-10ejlm04aq5f5.png\" width=\"1266\" \/><\/p>\n<p id=\"u06834774\"> The image above shows how a form outputs text to the page. Whatever the user inputs into the &#034;What&#039;s your name&#034; field is passed to a JavaScript function and output to the page, which means if the user adds their own HTML or JavaScript in the field, it&#039;s used in the sayHi function and is added to the page &#8211; this means you can add your own HTML (such as a &lt;h1&gt; tag) and it will output your input as pure HTML. \u4e0a\u56fe\u663e\u793a\u4e86\u8868\u5355\u5982\u4f55\u5c06\u6587\u672c\u8f93\u51fa\u5230\u9875\u9762\u3002\u65e0\u8bba\u7528\u6237\u5728 \u201cWhat is your name\u201d \u5b57\u6bb5\u4e2d\u8f93\u5165\u4ec0\u4e48&#xff0c;\u90fd\u4f1a\u4f20\u9012\u7ed9 JavaScript \u51fd\u6570\u5e76\u8f93\u51fa\u5230\u9875\u9762\u3002\u8fd9\u610f\u5473\u7740&#xff0c;\u5982\u679c\u7528\u6237\u5728\u8be5\u5b57\u6bb5\u4e2d\u6dfb\u52a0\u4e86\u81ea\u5df1\u7684 HTML \u6216 JavaScript, \u5b83\u5c06\u88ab sayHi \u51fd\u6570\u4f7f\u7528\u5e76\u6dfb\u52a0\u5230\u9875\u9762\u4e2d \u2014\u2014 \u8fd9\u610f\u5473\u7740\u4f60\u53ef\u4ee5\u6dfb\u52a0\u81ea\u5df1\u7684 HTML (\u4f8b\u5982 &lt; h1&gt; \u6807\u7b7e), \u5b83\u4f1a\u5c06\u4f60\u7684\u8f93\u5165\u8f93\u51fa\u4e3a\u7eaf HTML\u3002<\/p>\n<p id=\"u519db1ce\">The general rule is never to trust user input. To prevent malicious input, the website developer should sanitise everything the user enters before using it in the JavaScript function; in this case, the developer could remove any HTML tags. \u4e00\u822c\u89c4\u5219\u662f\u6c38\u8fdc\u4e0d\u8981\u4fe1\u4efb\u7528\u6237\u8f93\u5165\u3002\u4e3a\u4e86\u9632\u6b62\u6076\u610f\u8f93\u5165&#xff0c;\u7f51\u7ad9\u5f00\u53d1\u4eba\u5458\u5e94\u8be5\u5728 JavaScript \u51fd\u6570\u4e2d\u4f7f\u7528\u7528\u6237\u8f93\u5165\u7684\u6240\u6709\u5185\u5bb9\u4e4b\u524d\u8fdb\u884c\u6e05\u7406&#xff1b;\u5728\u8fd9\u79cd\u60c5\u51b5\u4e0b&#xff0c;\u5f00\u53d1\u4eba\u5458\u53ef\u4ee5\u5220\u9664\u4efb\u4f55 HTML \u6807\u7b7e\u3002<\/p>\n<h5 id=\"Gd2Dd\">\u95ee\u9898<\/h5>\n<p id=\"u7744b7fb\">\n<p class=\"img-center\"><img loading=\"lazy\" decoding=\"async\" alt=\"\" height=\"195\" id=\"u4329b13a\" src=\"2025-08-10gzzuhz5dvob.png\" width=\"1266\" \/><\/p>\n<h5 id=\"Hvrm8\">\u7b54\u6848<\/h5>\n<p id=\"ub0e11403\">\n<p class=\"img-center\"><img loading=\"lazy\" decoding=\"async\" alt=\"\" height=\"860\" id=\"ub6999815\" src=\"2025-08-100qiibafkikq.png\" width=\"1033\" \/><\/p>\n<p>&lt;a href&#061;&#039;http:\/\/hacker.com&#039;&gt; <\/p>\n<p id=\"u29ffa98e\">\n<p class=\"img-center\"><img loading=\"lazy\" decoding=\"async\" alt=\"\" height=\"839\" id=\"u049d68ba\" src=\"2025-08-100hjll1wpbqy.png\" width=\"1045\" \/><\/p>\n<p id=\"ubbd7b32f\">\n<p class=\"img-center\"><img loading=\"lazy\" decoding=\"async\" alt=\"\" height=\"640\" id=\"u1c61c355\" src=\"2025-08-10v0jqiucvaga.png\" width=\"1209\" \/><\/p>\n<p id=\"u31ec1971\">\n<p class=\"img-center\"><img loading=\"lazy\" decoding=\"async\" alt=\"\" height=\"234\" id=\"u63a6b6b3\" src=\"2025-08-10bke3lkukhvd.png\" width=\"819\" \/><\/p>\n<h5 id=\"GsjcS\"><\/h5>\n<p class=\"img-center\"><img loading=\"lazy\" decoding=\"async\" alt=\"\" height=\"650\" id=\"uab1d495b\" src=\"2025-08-10etsswf4myve.png\" width=\"1171\" \/><\/p>\n<h2 id=\"LMkie\">\u7406\u89e3\u548c\u8865\u5145<\/h2>\n<h4 id=\"WvFaT\">\u6587\u4ef6\u7b7e\u540d\u8bc6\u522b\u8868<\/h4>\n<table id=\"QSaXe\">\n<tbody>\n<tr>\n<td>\n<p id=\"u7ff51a75\">\u6587\u4ef6\u683c\u5f0f<\/p>\n<\/td>\n<td>\n<p id=\"ued2cfe40\">\u5e38\u7528\u540e\u7f00<\/p>\n<\/td>\n<td>\n<p id=\"u934831cb\">\u6587\u4ef6\u5934 (Hex)<\/p>\n<\/td>\n<td>\n<p id=\"u972bd4be\">\u6587\u4ef6\u5c3e (Hex)<\/p>\n<\/td>\n<td>\n<p id=\"ud7599072\">\u8bf4\u660e<\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p id=\"ua50f35bf\">JPEG<\/p>\n<\/td>\n<td>\n<p id=\"uf83ca2fb\">.jpg\/.jpeg<\/p>\n<\/td>\n<td>\n<p id=\"u1a03b524\">FF D8 FF<\/p>\n<\/td>\n<td>\n<p id=\"u8c7fc217\">FF D9<\/p>\n<\/td>\n<td>\n<p id=\"u20305d3f\">\u56fe\u50cf\u538b\u7f29\u6807\u51c6<\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p id=\"u2c032dc1\">PNG<\/p>\n<\/td>\n<td>\n<p id=\"u741aa3e9\">.png<\/p>\n<\/td>\n<td>\n<p id=\"ufb7549d0\">89 50 4E 47<\/p>\n<\/td>\n<td>\n<p id=\"u5da5ff88\">00 00 00 00 49 45 4E 44 AE 42 60 82<\/p>\n<\/td>\n<td>\n<p id=\"uf37dd0ab\">\u65e0\u635f\u4f4d\u56fe\u683c\u5f0f<\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p id=\"ubee81e76\">BMP<\/p>\n<\/td>\n<td>\n<p id=\"u8a83fe12\">.bmp<\/p>\n<\/td>\n<td>\n<p id=\"u95cb6374\">42 4D (BM)<\/p>\n<\/td>\n<td>\n<p id=\"u20d2b284\">\u65e0\u56fa\u5b9a\u6587\u4ef6\u5c3e<\/p>\n<\/td>\n<td>\n<p id=\"u4944a983\">Windows \u4f4d\u56fe\u683c\u5f0f<\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p id=\"u4d3af526\">GIF<\/p>\n<\/td>\n<td>\n<p id=\"u24d261d4\">.gif<\/p>\n<\/td>\n<td>\n<p id=\"u9bb1e75d\">47 49 46 38 (GIF8)<\/p>\n<\/td>\n<td>\n<p id=\"ua79dbd7f\">3B<\/p>\n<\/td>\n<td>\n<p id=\"u5ee0e0eb\">\u52a8\u56fe\u683c\u5f0f<\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p id=\"u9f742dc7\">XML<\/p>\n<\/td>\n<td>\n<p id=\"u78b00468\">.xml<\/p>\n<\/td>\n<td>\n<p id=\"u827db86b\">3C 3F 78 6D 6C (&lt;?xml)<\/p>\n<\/td>\n<td>\n<p id=\"u53d7d005\">\u65e0\u56fa\u5b9a\u6587\u4ef6\u5c3e<\/p>\n<\/td>\n<td>\n<p id=\"ub4ed4c23\">\u7ed3\u6784\u5316\u6570\u636e\u6807\u8bb0\u8bed\u8a00<\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p id=\"u3b0fe965\">HTML<\/p>\n<\/td>\n<td>\n<p id=\"u07fd080e\">.html\/.htm<\/p>\n<\/td>\n<td>\n<p id=\"u2e397ca6\">3C 21 44 4F 43 \u6216 68 74 6D 6C<\/p>\n<\/td>\n<td>\n<p id=\"u2f64a6e9\">\u65e0\u56fa\u5b9a\u6587\u4ef6\u5c3e<\/p>\n<\/td>\n<td>\n<p id=\"ubf8449b6\">\u8d85\u6587\u672c\u6807\u8bb0\u8bed\u8a00<\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p id=\"u21fb81a3\">MS Office<\/p>\n<\/td>\n<td>\n<p id=\"uc31a4ef8\">.doc\/.xls<\/p>\n<\/td>\n<td>\n<p id=\"u4f368c77\">D0 CF 11 E0<\/p>\n<\/td>\n<td>\n<p id=\"u94fd738b\">FD FF FF FF (FAT\u6587\u4ef6\u5c3e)<\/p>\n<\/td>\n<td>\n<p id=\"ued5b646d\">\u65e7\u7248Office\u4e8c\u8fdb\u5236\u683c\u5f0f<\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p id=\"uf7e8f20d\">MS Access<\/p>\n<\/td>\n<td>\n<p id=\"u40ec415a\">.mdb<\/p>\n<\/td>\n<td>\n<p id=\"u2977029c\">53 74 61 6E 64 61 72 64 20 4A<\/p>\n<\/td>\n<td>\n<p id=\"u7741bc86\">\u65e0\u56fa\u5b9a\u6587\u4ef6\u5c3e<\/p>\n<\/td>\n<td>\n<p id=\"ub5870d82\">Access\u6570\u636e\u5e93\u683c\u5f0f<\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p id=\"ua2cbbf9a\">PDF<\/p>\n<\/td>\n<td>\n<p id=\"u403f4cc1\">.pdf<\/p>\n<\/td>\n<td>\n<p id=\"u3dd24b1b\">25 50 44 46 2D 31 2E<\/p>\n<\/td>\n<td>\n<p id=\"u4d9193f8\">25 25 45 4F 46 (%%EOF)<\/p>\n<\/td>\n<td>\n<p id=\"ub0515fab\">\u8de8\u5e73\u53f0\u6587\u6863\u683c\u5f0f<\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p id=\"u012bdeaa\">ZIP<\/p>\n<\/td>\n<td>\n<p id=\"u2496538d\">.zip<\/p>\n<\/td>\n<td>\n<p id=\"uc0f2e341\">50 4B 03 04<\/p>\n<\/td>\n<td>\n<p id=\"ue67dfb58\">50 4B 05 06<\/p>\n<\/td>\n<td>\n<p id=\"u8a396a1b\">\u538b\u7f29\u6587\u4ef6\u683c\u5f0f<\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p id=\"u25f9601e\">RAR<\/p>\n<\/td>\n<td>\n<p id=\"u30a4b1a1\">.rar<\/p>\n<\/td>\n<td>\n<p id=\"u0509ebed\">52 61 72 21 1A 07 00<\/p>\n<\/td>\n<td>\n<p id=\"uea380749\">C4 3D 7B 00<\/p>\n<\/td>\n<td>\n<p id=\"uc9a68e7f\">WinRAR\u538b\u7f29\u683c\u5f0f<\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p id=\"ua15692d4\">WAV<\/p>\n<\/td>\n<td>\n<p id=\"u517dc222\">.wav<\/p>\n<\/td>\n<td>\n<p id=\"u553e9fb0\">52 49 46 46 xx xx xx xx 57 41 56 45<\/p>\n<\/td>\n<td>\n<p id=\"u94556e11\">\u65e0\u56fa\u5b9a\u6587\u4ef6\u5c3e<\/p>\n<\/td>\n<td>\n<p id=\"u7b678112\">\u97f3\u9891\u6ce2\u5f62\u683c\u5f0f<\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p id=\"u740e7685\">AVI<\/p>\n<\/td>\n<td>\n<p id=\"ubc5227bc\">.avi<\/p>\n<\/td>\n<td>\n<p id=\"u9ca86070\">52 49 46 46 xx xx xx xx 41 56 49 20<\/p>\n<\/td>\n<td>\n<p id=\"ubfe017d1\">\u65e0\u56fa\u5b9a\u6587\u4ef6\u5c3e<\/p>\n<\/td>\n<td>\n<p id=\"uabc21aaf\">\u97f3\u89c6\u9891\u5bb9\u5668\u683c\u5f0f<\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p id=\"u99279daa\">TIFF<\/p>\n<\/td>\n<td>\n<p id=\"uc5e1a3c3\">.tif\/.tiff<\/p>\n<\/td>\n<td>\n<p id=\"u31bd01fc\">49 49 2A 00 \u6216 4D 4D 00 2A<\/p>\n<\/td>\n<td>\n<p id=\"uae730460\">00 00 00 00<\/p>\n<\/td>\n<td>\n<p id=\"ub5305549\">\u9ad8\u8d28\u91cf\u56fe\u50cf\u683c\u5f0f<\/p>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<p id=\"u4b6cc7f8\">\u6587\u4ef6\u5934\u5c3e\u8bf4\u660e&#xff1a;<\/p>\n<li id=\"u898133a9\">xx \u8868\u793a\u53ef\u53d8\u957f\u5ea6\u5b57\u6bb5<\/li>\n<li id=\"u728ef5cf\">\u90e8\u5206\u683c\u5f0f\u901a\u8fc7 \u9b54\u672f\u6570\u5b57(Magic Number) \u800c\u975e\u6587\u4ef6\u5c3e\u8bc6\u522b<\/li>\n<li id=\"ub1524d25\">\u538b\u7f29\u683c\u5f0f&#xff08;ZIP\/RAR&#xff09;\u6709\u660e\u786e\u7684\u76ee\u5f55\u7ed3\u675f\u6807\u8bb0<\/li>\n<hr id=\"CJRi9\" \/>\n<h4 id=\"kgo93\">\u6587\u4ef6\u540e\u7f00\u4e13\u4e1a\u89e3\u6790<\/h4>\n<h5 id=\"JBxC8\">1. \u8de8\u5e73\u53f0\u7279\u6027\u5bf9\u6bd4<\/h5>\n<table id=\"XZeXS\">\n<tbody>\n<tr>\n<td>\n<p id=\"ube4e14cb\">\u7279\u6027<\/p>\n<\/td>\n<td>\n<p id=\"u3dbb811f\">Windows<\/p>\n<\/td>\n<td>\n<p id=\"ueeace466\">Linux\/macOS<\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p id=\"u43e52769\">\u540e\u7f00\u4f9d\u8d56\u5ea6<\/p>\n<\/td>\n<td>\n<p id=\"u791f377e\">\u9ad8\u5ea6\u4f9d\u8d56&#xff08;\u9690\u85cf\u5df2\u77e5\u6269\u5c55\u540d&#xff09;<\/p>\n<\/td>\n<td>\n<p id=\"u9d930ccc\">\u53ef\u9009&#xff08;\u4e3b\u8981\u9760MIME\u7c7b\u578b&#xff09;<\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p id=\"u1b62f135\">\u4fee\u6539\u540e\u679c<\/p>\n<\/td>\n<td>\n<p id=\"u79858915\">\u5bfc\u81f4\u5173\u8054\u7a0b\u5e8f\u9519\u8bef<\/p>\n<\/td>\n<td>\n<p id=\"u1001225c\">\u4e0d\u5f71\u54cd\u6587\u4ef6\u5185\u5bb9\u8bc6\u522b<\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p id=\"u1c621ee2\">\u5b89\u5168\u98ce\u9669<\/p>\n<\/td>\n<td>\n<p id=\"u75d6b3c9\">\u9ad8\u5371&#xff08;\u5982&#xff1a;virus.txt.exe&#xff09;<\/p>\n<\/td>\n<td>\n<p id=\"u6e66d72d\">\u8f83\u4f4e&#xff08;\u9700&#043;x\u6743\u9650\u624d\u53ef\u6267\u884c&#xff09;<\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p id=\"u1d3f2266\">\u9ed8\u8ba4\u5904\u7406<\/p>\n<\/td>\n<td>\n<p id=\"u7d5c9fd5\">\u6839\u636e\u540e\u7f00\u9009\u62e9\u7a0b\u5e8f<\/p>\n<\/td>\n<td>\n<p id=\"u414522cc\">\u6839\u636e\u6587\u4ef6\u7b7e\u540d&#043;MIME\u7c7b\u578b<\/p>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<h5 id=\"Ob74s\">2. \u6587\u4ef6\u8bc6\u522b\u4f18\u5148\u7ea7<\/h5>\n<p id=\"ueb3d9fd8\">\u5728\u6570\u5b57\u53d6\u8bc1\u4e2d\u6309\u4ee5\u4e0b\u987a\u5e8f\u5224\u65ad\u6587\u4ef6\u7c7b\u578b&#xff1a;<\/p>\n<li id=\"ubc7009b6\">\u6587\u4ef6\u5934\u7b7e\u540d&#xff08;\u6700\u53ef\u9760&#xff0c;\u4f18\u5148\u7ea7\u6700\u9ad8&#xff09;<\/li>\n<li id=\"ude25a762\">\u6587\u4ef6\u7ed3\u6784\u89e3\u6790&#xff08;\u5982ZIP\u7684\u76ee\u5f55\u7ed3\u6784&#xff09;<\/li>\n<li id=\"u3bf52557\">MIME\u7c7b\u578b\u68c0\u6d4b&#xff08;HTTP\u4f20\u8f93\u6807\u51c6&#xff09;<\/li>\n<li id=\"uf0a4fada\">\u6587\u4ef6\u540e\u7f00\u540d&#xff08;\u6700\u4e0d\u53ef\u9760&#xff09;<\/li>\n<hr id=\"icvov\" \/>\n<h4 id=\"rDor4\">\u6587\u4ef6\u7b7e\u540d\u5b9e\u6218\u5e94\u7528<\/h4>\n<h5 id=\"QaMHH\">1. \u53d6\u8bc1\u5de5\u5177\u4f7f\u7528<\/h5>\n<p># \u4f7f\u7528file\u547d\u4ee4\u8bc6\u522b\u771f\u5b9e\u7c7b\u578b&#xff08;Linux\/macOS&#xff09;<br \/>\n$ file -k suspicious.doc<br \/>\nsuspicious.doc: Microsoft Office 2007&#043; DOCX (Zip archive data)<\/p>\n<p># \u4f7f\u7528hexdump\u9a8c\u8bc1\u6587\u4ef6\u5934<br \/>\n$ hexdump -C -n 8 suspicious.doc<br \/>\n00000000  50 4b 03 04 14 00 08 00  |PK&#8230;&#8230;..| <\/p>\n<h5 id=\"uy9pm\">2. \u6076\u610f\u6587\u4ef6\u68c0\u6d4b<\/h5>\n<p>def detect_malicious(file_path):<br \/>\n    signatures &#061; {<br \/>\n        &#034;PE&#034;: b&#034;MZ\\\\x90\\\\x00&#034;,  # Windows\u53ef\u6267\u884c\u6587\u4ef6<br \/>\n        &#034;ELF&#034;: b&#034;\\\\x7fELF&#034;,     # Linux\u53ef\u6267\u884c\u6587\u4ef6<br \/>\n        &#034;Macro&#034;: b&#034;D0 CF 11 E0&#034; # \u5b8f\u75c5\u6bd2\u5e38\u7528<br \/>\n    }<\/p>\n<p>    with open(file_path, &#034;rb&#034;) as f:<br \/>\n        header &#061; f.read(4)<br \/>\n        for name, sig in signatures.items():<br \/>\n            if header.startswith(sig):<br \/>\n                return f&#034;\u5371\u9669! \u68c0\u6d4b\u5230{name}\u7b7e\u540d&#034;<br \/>\n    return &#034;\u6587\u4ef6\u7b7e\u540d\u6b63\u5e38&#034; <\/p>\n<h5 id=\"GddNe\">3. \u6587\u4ef6\u4fee\u590d\u6280\u5de7<\/h5>\n<p id=\"u78147384\">\u5f53\u6587\u4ef6\u5934\u635f\u574f\u65f6&#xff1a;<\/p>\n<li id=\"uc56d4134\">\u4f7f\u7528 hex\u7f16\u8f91\u5668 \u624b\u52a8\u4fee\u590d&#xff08;\u5982HxD&#xff09;<\/li>\n<li id=\"ue056b321\">\u901a\u8fc7 \u5df2\u77e5\u7ed3\u6784 \u91cd\u5efa\u5934\u4fe1\u606f<\/li>\n<ul>\n<li>\n<ul>\n<li id=\"uae69bf46\">JPEG&#xff1a;\u8865\u5168 FF D8 FF E0 \u540e\u63a5 JFIF<\/li>\n<li id=\"u280e76ec\">PNG&#xff1a;\u8865\u5168 89 50 4E 47 0D 0A 1A 0A<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<hr id=\"UDFeW\" \/>\n<p id=\"u4c242e0d\">\n","protected":false},"excerpt":{"rendered":"<p>\u6587\u7ae0\u6d4f\u89c8\u9605\u8bfb282\u6b21\uff0c\u70b9\u8d5e4\u6b21\uff0c\u6536\u85cf9\u6b21\u3002\u672c\u6587\u6458\u8981\uff08150\u5b57\uff09\uff1a \u672c\u6559\u7a0b\u7cfb\u7edf\u4ecb\u7ecd\u4e86\u7f51\u7ad9\u5de5\u4f5c\u539f\u7406\u4e0e\u524d\u7aef\u6280\u672f\u57fa\u7840\uff0c\u5305\u542b\u4e94\u4e2a\u6838\u5fc3\u90e8\u5206\uff1a1) \u7f51\u7ad9\u8fd0\u884c\u673a\u5236\uff08\u5ba2\u6237\u7aef\/\u670d\u52a1\u7aef\u67b6\u6784\uff09\uff1b2) HTML\u7ed3\u6784\u89e3\u6790\uff08\u6587\u6863\u7c7b\u578b\u3001\u5143\u7d20\u6807\u7b7e\u53ca\u5c5e\u6027\uff09\uff1b3) JavaScript\u4ea4\u4e92\u529f\u80fd\u5b9e\u73b0\uff1b4) \u654f\u611f\u6570\u636e\u66b4\u9732\u98ce\u9669\uff08\u6e90\u7801\u6cc4\u9732\u9690\u60a3\uff09\uff1b5) HTML\u6ce8\u5165\u6f0f\u6d1e\u539f\u7406\u3002\u7279\u522b\u5f3a\u8c03\u6587\u4ef6\u7b7e\u540d\u8bc6\u522b\u6280\u672f\uff0c\u5217\u4e3e\u4e86JPEG\/PNG\/PDF\u7b4915\u79cd\u5e38\u89c1\u6587\u4ef6\u7684\u5341\u516d\u8fdb\u5236\u7279\u5f81\u5934\u5c3e\u6807\u8bc6\uff0c\u6307\u51fa\u6587\u4ef6\u540e\u7f00\u4e0d\u53ef\u9760\u6027\uff0c\u5efa\u8bae\u901a\u8fc7Magic Number\u8fdb\u884c\u7cbe\u786e\u8bc6\u522b\u3002\u6559\u7a0b\u5305\u542b\u5b9e\u8df5\u6f14\u793a\uff0c\u5982\u901a\u8fc7\u5f00\u53d1\u8005\u5de5\u5177\u67e5\u770b\u6e90\u7801\u3001\u4fee\u6539HTML\u5143\u7d20<\/p>\n","protected":false},"author":2,"featured_media":51478,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[567,187,5099,5101,78,5100,122],"topic":[],"class_list":["post-51498","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-server","tag-html","tag-javascript","tag-tryhackme","tag-5101","tag-78","tag-5100","tag-122"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v20.3 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>How Websites Work \u7f51\u7ad9\u5982\u4f55\u8fd0\u4f5c - \u7f51\u7855\u4e92\u8054\u5e2e\u52a9\u4e2d\u5fc3<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.wsisp.com\/helps\/51498.html\" \/>\n<meta property=\"og:locale\" content=\"zh_CN\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"How Websites Work \u7f51\u7ad9\u5982\u4f55\u8fd0\u4f5c - \u7f51\u7855\u4e92\u8054\u5e2e\u52a9\u4e2d\u5fc3\" \/>\n<meta property=\"og:description\" content=\"\u6587\u7ae0\u6d4f\u89c8\u9605\u8bfb282\u6b21\uff0c\u70b9\u8d5e4\u6b21\uff0c\u6536\u85cf9\u6b21\u3002\u672c\u6587\u6458\u8981\uff08150\u5b57\uff09\uff1a \u672c\u6559\u7a0b\u7cfb\u7edf\u4ecb\u7ecd\u4e86\u7f51\u7ad9\u5de5\u4f5c\u539f\u7406\u4e0e\u524d\u7aef\u6280\u672f\u57fa\u7840\uff0c\u5305\u542b\u4e94\u4e2a\u6838\u5fc3\u90e8\u5206\uff1a1) \u7f51\u7ad9\u8fd0\u884c\u673a\u5236\uff08\u5ba2\u6237\u7aef\/\u670d\u52a1\u7aef\u67b6\u6784\uff09\uff1b2) HTML\u7ed3\u6784\u89e3\u6790\uff08\u6587\u6863\u7c7b\u578b\u3001\u5143\u7d20\u6807\u7b7e\u53ca\u5c5e\u6027\uff09\uff1b3) JavaScript\u4ea4\u4e92\u529f\u80fd\u5b9e\u73b0\uff1b4) \u654f\u611f\u6570\u636e\u66b4\u9732\u98ce\u9669\uff08\u6e90\u7801\u6cc4\u9732\u9690\u60a3\uff09\uff1b5) HTML\u6ce8\u5165\u6f0f\u6d1e\u539f\u7406\u3002\u7279\u522b\u5f3a\u8c03\u6587\u4ef6\u7b7e\u540d\u8bc6\u522b\u6280\u672f\uff0c\u5217\u4e3e\u4e86JPEG\/PNG\/PDF\u7b4915\u79cd\u5e38\u89c1\u6587\u4ef6\u7684\u5341\u516d\u8fdb\u5236\u7279\u5f81\u5934\u5c3e\u6807\u8bc6\uff0c\u6307\u51fa\u6587\u4ef6\u540e\u7f00\u4e0d\u53ef\u9760\u6027\uff0c\u5efa\u8bae\u901a\u8fc7Magic Number\u8fdb\u884c\u7cbe\u786e\u8bc6\u522b\u3002\u6559\u7a0b\u5305\u542b\u5b9e\u8df5\u6f14\u793a\uff0c\u5982\u901a\u8fc7\u5f00\u53d1\u8005\u5de5\u5177\u67e5\u770b\u6e90\u7801\u3001\u4fee\u6539HTML\u5143\u7d20\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.wsisp.com\/helps\/51498.html\" \/>\n<meta property=\"og:site_name\" content=\"\u7f51\u7855\u4e92\u8054\u5e2e\u52a9\u4e2d\u5fc3\" \/>\n<meta property=\"article:published_time\" content=\"2025-08-10T15:29:55+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.wsisp.com\/helps\/wp-content\/uploads\/2025\/08\/20250810152944-6898bae8e19e5.png\" \/>\n<meta name=\"author\" content=\"admin\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"\u4f5c\u8005\" \/>\n\t<meta name=\"twitter:data1\" content=\"admin\" \/>\n\t<meta name=\"twitter:label2\" content=\"\u9884\u8ba1\u9605\u8bfb\u65f6\u95f4\" \/>\n\t<meta name=\"twitter:data2\" content=\"9 \u5206\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.wsisp.com\/helps\/51498.html\",\"url\":\"https:\/\/www.wsisp.com\/helps\/51498.html\",\"name\":\"How Websites Work \u7f51\u7ad9\u5982\u4f55\u8fd0\u4f5c - \u7f51\u7855\u4e92\u8054\u5e2e\u52a9\u4e2d\u5fc3\",\"isPartOf\":{\"@id\":\"https:\/\/www.wsisp.com\/helps\/#website\"},\"datePublished\":\"2025-08-10T15:29:55+00:00\",\"dateModified\":\"2025-08-10T15:29:55+00:00\",\"author\":{\"@id\":\"https:\/\/www.wsisp.com\/helps\/#\/schema\/person\/358e386c577a3ab51c4493330a20ad41\"},\"breadcrumb\":{\"@id\":\"https:\/\/www.wsisp.com\/helps\/51498.html#breadcrumb\"},\"inLanguage\":\"zh-Hans\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.wsisp.com\/helps\/51498.html\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.wsisp.com\/helps\/51498.html#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"\u9996\u9875\",\"item\":\"https:\/\/www.wsisp.com\/helps\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"How Websites Work \u7f51\u7ad9\u5982\u4f55\u8fd0\u4f5c\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.wsisp.com\/helps\/#website\",\"url\":\"https:\/\/www.wsisp.com\/helps\/\",\"name\":\"\u7f51\u7855\u4e92\u8054\u5e2e\u52a9\u4e2d\u5fc3\",\"description\":\"\u9999\u6e2f\u670d\u52a1\u5668_\u9999\u6e2f\u4e91\u670d\u52a1\u5668\u8d44\u8baf_\u670d\u52a1\u5668\u5e2e\u52a9\u6587\u6863_\u670d\u52a1\u5668\u6559\u7a0b\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/www.wsisp.com\/helps\/?s={search_term_string}\"},\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"zh-Hans\"},{\"@type\":\"Person\",\"@id\":\"https:\/\/www.wsisp.com\/helps\/#\/schema\/person\/358e386c577a3ab51c4493330a20ad41\",\"name\":\"admin\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"zh-Hans\",\"@id\":\"https:\/\/www.wsisp.com\/helps\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/gravatar.wp-china-yes.net\/avatar\/?s=96&d=mystery\",\"contentUrl\":\"https:\/\/gravatar.wp-china-yes.net\/avatar\/?s=96&d=mystery\",\"caption\":\"admin\"},\"sameAs\":[\"http:\/\/wp.wsisp.com\"],\"url\":\"https:\/\/www.wsisp.com\/helps\/author\/admin\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"How Websites Work \u7f51\u7ad9\u5982\u4f55\u8fd0\u4f5c - \u7f51\u7855\u4e92\u8054\u5e2e\u52a9\u4e2d\u5fc3","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.wsisp.com\/helps\/51498.html","og_locale":"zh_CN","og_type":"article","og_title":"How Websites Work \u7f51\u7ad9\u5982\u4f55\u8fd0\u4f5c - \u7f51\u7855\u4e92\u8054\u5e2e\u52a9\u4e2d\u5fc3","og_description":"\u6587\u7ae0\u6d4f\u89c8\u9605\u8bfb282\u6b21\uff0c\u70b9\u8d5e4\u6b21\uff0c\u6536\u85cf9\u6b21\u3002\u672c\u6587\u6458\u8981\uff08150\u5b57\uff09\uff1a \u672c\u6559\u7a0b\u7cfb\u7edf\u4ecb\u7ecd\u4e86\u7f51\u7ad9\u5de5\u4f5c\u539f\u7406\u4e0e\u524d\u7aef\u6280\u672f\u57fa\u7840\uff0c\u5305\u542b\u4e94\u4e2a\u6838\u5fc3\u90e8\u5206\uff1a1) \u7f51\u7ad9\u8fd0\u884c\u673a\u5236\uff08\u5ba2\u6237\u7aef\/\u670d\u52a1\u7aef\u67b6\u6784\uff09\uff1b2) HTML\u7ed3\u6784\u89e3\u6790\uff08\u6587\u6863\u7c7b\u578b\u3001\u5143\u7d20\u6807\u7b7e\u53ca\u5c5e\u6027\uff09\uff1b3) JavaScript\u4ea4\u4e92\u529f\u80fd\u5b9e\u73b0\uff1b4) \u654f\u611f\u6570\u636e\u66b4\u9732\u98ce\u9669\uff08\u6e90\u7801\u6cc4\u9732\u9690\u60a3\uff09\uff1b5) HTML\u6ce8\u5165\u6f0f\u6d1e\u539f\u7406\u3002\u7279\u522b\u5f3a\u8c03\u6587\u4ef6\u7b7e\u540d\u8bc6\u522b\u6280\u672f\uff0c\u5217\u4e3e\u4e86JPEG\/PNG\/PDF\u7b4915\u79cd\u5e38\u89c1\u6587\u4ef6\u7684\u5341\u516d\u8fdb\u5236\u7279\u5f81\u5934\u5c3e\u6807\u8bc6\uff0c\u6307\u51fa\u6587\u4ef6\u540e\u7f00\u4e0d\u53ef\u9760\u6027\uff0c\u5efa\u8bae\u901a\u8fc7Magic Number\u8fdb\u884c\u7cbe\u786e\u8bc6\u522b\u3002\u6559\u7a0b\u5305\u542b\u5b9e\u8df5\u6f14\u793a\uff0c\u5982\u901a\u8fc7\u5f00\u53d1\u8005\u5de5\u5177\u67e5\u770b\u6e90\u7801\u3001\u4fee\u6539HTML\u5143\u7d20","og_url":"https:\/\/www.wsisp.com\/helps\/51498.html","og_site_name":"\u7f51\u7855\u4e92\u8054\u5e2e\u52a9\u4e2d\u5fc3","article_published_time":"2025-08-10T15:29:55+00:00","og_image":[{"url":"https:\/\/www.wsisp.com\/helps\/wp-content\/uploads\/2025\/08\/20250810152944-6898bae8e19e5.png"}],"author":"admin","twitter_card":"summary_large_image","twitter_misc":{"\u4f5c\u8005":"admin","\u9884\u8ba1\u9605\u8bfb\u65f6\u95f4":"9 \u5206"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/www.wsisp.com\/helps\/51498.html","url":"https:\/\/www.wsisp.com\/helps\/51498.html","name":"How Websites Work \u7f51\u7ad9\u5982\u4f55\u8fd0\u4f5c - \u7f51\u7855\u4e92\u8054\u5e2e\u52a9\u4e2d\u5fc3","isPartOf":{"@id":"https:\/\/www.wsisp.com\/helps\/#website"},"datePublished":"2025-08-10T15:29:55+00:00","dateModified":"2025-08-10T15:29:55+00:00","author":{"@id":"https:\/\/www.wsisp.com\/helps\/#\/schema\/person\/358e386c577a3ab51c4493330a20ad41"},"breadcrumb":{"@id":"https:\/\/www.wsisp.com\/helps\/51498.html#breadcrumb"},"inLanguage":"zh-Hans","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.wsisp.com\/helps\/51498.html"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/www.wsisp.com\/helps\/51498.html#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"\u9996\u9875","item":"https:\/\/www.wsisp.com\/helps"},{"@type":"ListItem","position":2,"name":"How Websites Work \u7f51\u7ad9\u5982\u4f55\u8fd0\u4f5c"}]},{"@type":"WebSite","@id":"https:\/\/www.wsisp.com\/helps\/#website","url":"https:\/\/www.wsisp.com\/helps\/","name":"\u7f51\u7855\u4e92\u8054\u5e2e\u52a9\u4e2d\u5fc3","description":"\u9999\u6e2f\u670d\u52a1\u5668_\u9999\u6e2f\u4e91\u670d\u52a1\u5668\u8d44\u8baf_\u670d\u52a1\u5668\u5e2e\u52a9\u6587\u6863_\u670d\u52a1\u5668\u6559\u7a0b","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.wsisp.com\/helps\/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"zh-Hans"},{"@type":"Person","@id":"https:\/\/www.wsisp.com\/helps\/#\/schema\/person\/358e386c577a3ab51c4493330a20ad41","name":"admin","image":{"@type":"ImageObject","inLanguage":"zh-Hans","@id":"https:\/\/www.wsisp.com\/helps\/#\/schema\/person\/image\/","url":"https:\/\/gravatar.wp-china-yes.net\/avatar\/?s=96&d=mystery","contentUrl":"https:\/\/gravatar.wp-china-yes.net\/avatar\/?s=96&d=mystery","caption":"admin"},"sameAs":["http:\/\/wp.wsisp.com"],"url":"https:\/\/www.wsisp.com\/helps\/author\/admin"}]}},"_links":{"self":[{"href":"https:\/\/www.wsisp.com\/helps\/wp-json\/wp\/v2\/posts\/51498","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.wsisp.com\/helps\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.wsisp.com\/helps\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.wsisp.com\/helps\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/www.wsisp.com\/helps\/wp-json\/wp\/v2\/comments?post=51498"}],"version-history":[{"count":0,"href":"https:\/\/www.wsisp.com\/helps\/wp-json\/wp\/v2\/posts\/51498\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.wsisp.com\/helps\/wp-json\/wp\/v2\/media\/51478"}],"wp:attachment":[{"href":"https:\/\/www.wsisp.com\/helps\/wp-json\/wp\/v2\/media?parent=51498"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.wsisp.com\/helps\/wp-json\/wp\/v2\/categories?post=51498"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.wsisp.com\/helps\/wp-json\/wp\/v2\/tags?post=51498"},{"taxonomy":"topic","embeddable":true,"href":"https:\/\/www.wsisp.com\/helps\/wp-json\/wp\/v2\/topic?post=51498"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}