websiteTeam/website
1
0
Fork 0
mirror of https://github.com/ZSCNetSupportDept/website.git synced 2025-10-29 01:15:04 +08:00
Code Activity

Web历史初版～～

Browse Source
This commit is contained in:
govolokatliai
2025-07-17 12:38:52 +08:00
parent 755322847f
commit 722ad2cef9
11 changed files with 1109 additions and 23 deletions
Download Patch File Download Diff File Expand all files Collapse all files

BIN
static/img/blog/basic_static_app_server.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 7.1 KiB

231
static/img/blog/fetching-a-page.svg Normal file
View File

@@ -0,0 +1,231 @@
<svg xmlns="http://www.w3.org/2000/svg" width="710" height="470" style="background-color:#fff" viewBox="-0.5 -0.5 710 470">
<rect width="100%" height="100%" fill="#FFF"/>
<rect width="710" height="470" fill="#FFF" pointer-events="all" rx="14.1" ry="14.1"/>
<rect width="320" height="420" x="20" y="30" fill="#FFF" stroke="#000" pointer-events="all" rx="9.6" ry="9.6"/>
<rect width="140" height="70" x="190" y="90" fill="#fff2cc" stroke="#d6b656" pointer-events="all" rx="2.1" ry="2.1"/>
<switch transform="translate(-.5 -.5)">
<foreignObject width="100%" height="100%" pointer-events="none" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow:visible;text-align:left">
<div xmlns="http://www.w3.org/1999/xhtml" style="display:flex;align-items:unsafe center;justify-content:unsafe center;width:134px;height:1px;padding-top:125px;margin-left:193px">
<div data-drawio-colors="color: rgb(0, 0, 0);" style="box-sizing:border-box;font-size:0;text-align:center">
<div style="display:inline-block;font-size:16px;font-family:monospace;color:#000;line-height:1.2;pointer-events:all;white-space:normal;overflow-wrap:normal">
image
</div>
</div>
</div>
</foreignObject>
<text x="260" y="130" font-family="Monospace" font-size="16" text-anchor="middle">image</text>
</switch>
<rect width="140" height="80" x="40" y="310" fill="#f8cecc" stroke="#b85450" pointer-events="all" rx="2.4" ry="2.4"/>
<switch transform="translate(-.5 -.5)">
<foreignObject width="100%" height="100%" pointer-events="none" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow:visible;text-align:left">
<div xmlns="http://www.w3.org/1999/xhtml" style="display:flex;align-items:unsafe center;justify-content:unsafe center;width:134px;height:1px;padding-top:350px;margin-left:43px">
<div data-drawio-colors="color: rgb(0, 0, 0);" style="box-sizing:border-box;font-size:0;text-align:center">
<div style="display:inline-block;font-size:16px;font-family:monospace;color:#000;line-height:1.2;pointer-events:all;white-space:normal;overflow-wrap:normal">
Video
</div>
</div>
</div>
</foreignObject>
<text x="110" y="355" font-family="Monospace" font-size="16" text-anchor="middle">Video</text>
</switch>
<rect width="140" height="80" x="190" y="310" fill="#ffe6cc" stroke="#d79b00" pointer-events="all" rx="2.4" ry="2.4"/>
<switch transform="translate(-.5 -.5)">
<foreignObject width="100%" height="100%" pointer-events="none" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow:visible;text-align:left">
<div xmlns="http://www.w3.org/1999/xhtml" style="display:flex;align-items:unsafe center;justify-content:unsafe center;width:134px;height:1px;padding-top:350px;margin-left:193px">
<div data-drawio-colors="color: rgb(0, 0, 0);" style="box-sizing:border-box;font-size:0;text-align:center">
<div style="display:inline-block;font-size:16px;font-family:monospace;color:#000;line-height:1.2;pointer-events:all;white-space:normal;overflow-wrap:normal">
Advertisement
</div>
</div>
</div>
</foreignObject>
<text x="260" y="355" font-family="Monospace" font-size="16" text-anchor="middle">Advertisement</text>
</switch>
<rect width="70" height="10" x="40" y="410" fill="#ccc" pointer-events="all" rx="3.6" ry="3.6"/>
<rect width="200" height="10" x="120" y="410" fill="#ccc" pointer-events="all" rx="3.6" ry="3.6"/>
<rect width="140" height="10" x="40" y="90" fill="#ccc" pointer-events="all" rx="3.6" ry="3.6"/>
<rect width="130" height="10" x="40" y="110" fill="#ccc" pointer-events="all" rx="3.6" ry="3.6"/>
<rect width="40" height="10" x="40" y="130" fill="#ccc" pointer-events="all" rx="3.6" ry="3.6"/>
<rect width="90" height="10" x="90" y="130" fill="#ccc" pointer-events="all" rx="3.6" ry="3.6"/>
<rect width="90" height="10" x="40" y="182" fill="#ccc" pointer-events="all" rx="3.6" ry="3.6"/>
<rect width="90" height="10" x="40" y="222" fill="#ccc" pointer-events="all" rx="3.6" ry="3.6"/>
<rect width="90" height="10" x="40" y="262" fill="#ccc" pointer-events="all" rx="3.6" ry="3.6"/>
<rect width="90" height="10" x="135" y="262" fill="#ccc" pointer-events="all" rx="3.6" ry="3.6"/>
<rect width="90" height="10" x="40" y="282" fill="#ccc" pointer-events="all" rx="3.6" ry="3.6"/>
<rect width="90" height="10" x="140" y="282" fill="#ccc" pointer-events="all" rx="3.6" ry="3.6"/>
<rect width="120" height="10" x="135" y="222" fill="#ccc" pointer-events="all" rx="3.6" ry="3.6"/>
<rect width="120" height="10" x="40" y="242" fill="#ccc" pointer-events="all" rx="3.6" ry="3.6"/>
<rect width="120" height="10" x="135" y="182" fill="#ccc" pointer-events="all" rx="3.6" ry="3.6"/>
<rect width="120" height="10" x="40" y="202" fill="#ccc" pointer-events="all" rx="3.6" ry="3.6"/>
<rect width="80" height="10" x="230" y="262" fill="#ccc" pointer-events="all" rx="3.6" ry="3.6"/>
<rect width="120" height="10" x="170" y="242" fill="#ccc" pointer-events="all" rx="3.6" ry="3.6"/>
<rect width="40" height="10" x="170" y="202" fill="#ccc" pointer-events="all" rx="3.6" ry="3.6"/>
<rect width="40" height="10" x="240" y="282" fill="#ccc" pointer-events="all" rx="3.6" ry="3.6"/>
<rect width="40" height="10" x="270" y="222" fill="#ccc" pointer-events="all" rx="3.6" ry="3.6"/>
<rect width="90" height="10" x="220" y="202" fill="#ccc" pointer-events="all" rx="3.6" ry="3.6"/>
<rect width="50" height="10" x="40" y="430" fill="#ccc" pointer-events="all" rx="3.6" ry="3.6"/>
<rect width="40" height="10" x="120" y="430" fill="#ccc" pointer-events="all" rx="3.6" ry="3.6"/>
<rect width="40" height="10" x="200" y="430" fill="#ccc" pointer-events="all" rx="3.6" ry="3.6"/>
<rect width="50" height="10" x="280" y="430" fill="#ccc" pointer-events="all" rx="3.6" ry="3.6"/>
<rect width="290" height="10" x="40" y="60" fill="#adadad" pointer-events="all" rx="3.6" ry="3.6"/>
<rect width="130" height="10" x="40" y="150" fill="#ccc" pointer-events="all" rx="3.6" ry="3.6"/>
<rect width="140" height="24" x="100" fill="none" pointer-events="all" rx=".72" ry=".72"/>
<switch transform="translate(-.5 -.5)">
<foreignObject width="100%" height="100%" pointer-events="none" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow:visible;text-align:left">
<div xmlns="http://www.w3.org/1999/xhtml" style="display:flex;align-items:unsafe center;justify-content:unsafe center;width:134px;height:1px;padding-top:12px;margin-left:103px">
<div data-drawio-colors="color: rgb(0, 0, 0);" style="box-sizing:border-box;font-size:0;text-align:center">
<div style="display:inline-block;font-size:16px;font-family:monospace;color:#000;line-height:1.2;pointer-events:all;white-space:normal;overflow-wrap:normal">
<div>
Web document
</div>
</div>
</div>
</div>
</foreignObject>
<text x="170" y="17" font-family="Monospace" font-size="16" text-anchor="middle">Web document</text>
</switch>
<g stroke="#000">
<path fill="none" stroke-miterlimit="10" d="M333 125h207V85h10" pointer-events="stroke"/>
<circle cx="330" cy="125" r="3" pointer-events="all"/>
</g>
<g stroke="#000">
<path fill="none" stroke-miterlimit="10" d="m283 85.01 132.5.49L550 85" pointer-events="stroke"/>
<circle cx="280" cy="85" r="3" pointer-events="all"/>
</g>
<g stroke="#000">
<path fill="none" stroke-miterlimit="10" d="M333 350h197v35h20" pointer-events="stroke"/>
<circle cx="330" cy="350" r="3" pointer-events="all"/>
</g>
<g stroke="#000">
<path fill="none" stroke-miterlimit="10" d="M180 307v-10h370" pointer-events="stroke"/>
<circle cx="180" cy="310" r="3" pointer-events="all"/>
</g>
<rect width="150" height="24" x="370" y="20" fill="none" pointer-events="all" rx=".72" ry=".72"/>
<switch transform="translate(-.5 -.5)">
<foreignObject width="100%" height="100%" pointer-events="none" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow:visible;text-align:left">
<div xmlns="http://www.w3.org/1999/xhtml" style="display:flex;align-items:unsafe center;justify-content:unsafe center;width:144px;height:1px;padding-top:32px;margin-left:373px">
<div data-drawio-colors="color: rgb(0, 0, 0);" style="box-sizing:border-box;font-size:0;text-align:center">
<div style="display:inline-block;font-size:16px;font-family:monospace;color:#000;line-height:1.2;pointer-events:all;white-space:normal;overflow-wrap:normal">
<div>
GET index.html
<br/>
</div>
</div>
</div>
</div>
</foreignObject>
<text x="445" y="37" font-family="Monospace" font-size="16" text-anchor="middle">GET index.html
</text>
</switch>
<rect width="150" height="24" x="370" y="60" fill="none" pointer-events="all" rx=".72" ry=".72"/>
<switch transform="translate(-.5 -.5)">
<foreignObject width="100%" height="100%" pointer-events="none" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow:visible;text-align:left">
<div xmlns="http://www.w3.org/1999/xhtml" style="display:flex;align-items:unsafe center;justify-content:unsafe center;width:144px;height:1px;padding-top:72px;margin-left:373px">
<div data-drawio-colors="color: rgb(0, 0, 0);" style="box-sizing:border-box;font-size:0;text-align:center">
<div style="display:inline-block;font-size:16px;font-family:monospace;color:#000;line-height:1.2;pointer-events:all;white-space:normal;overflow-wrap:normal">
<div>
GET styles.css
<br/>
</div>
</div>
</div>
</div>
</foreignObject>
<text x="445" y="77" font-family="Monospace" font-size="16" text-anchor="middle">GET styles.css
</text>
</switch>
<rect width="150" height="24" x="370" y="103" fill="none" pointer-events="all" rx=".72" ry=".72"/>
<switch transform="translate(-.5 -.5)">
<foreignObject width="100%" height="100%" pointer-events="none" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow:visible;text-align:left">
<div xmlns="http://www.w3.org/1999/xhtml" style="display:flex;align-items:unsafe center;justify-content:unsafe center;width:144px;height:1px;padding-top:115px;margin-left:373px">
<div data-drawio-colors="color: rgb(0, 0, 0);" style="box-sizing:border-box;font-size:0;text-align:center">
<div style="display:inline-block;font-size:16px;font-family:monospace;color:#000;line-height:1.2;pointer-events:all;white-space:normal;overflow-wrap:normal">
<div>
GET header.png
<br/>
</div>
</div>
</div>
</div>
</foreignObject>
<text x="445" y="120" font-family="Monospace" font-size="16" text-anchor="middle">GET header.png
</text>
</switch>
<rect width="150" height="24" x="370" y="268" fill="none" pointer-events="all" rx=".72" ry=".72"/>
<switch transform="translate(-.5 -.5)">
<foreignObject width="100%" height="100%" pointer-events="none" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow:visible;text-align:left">
<div xmlns="http://www.w3.org/1999/xhtml" style="display:flex;align-items:unsafe center;justify-content:unsafe center;width:144px;height:1px;padding-top:280px;margin-left:373px">
<div data-drawio-colors="color: rgb(0, 0, 0);" style="box-sizing:border-box;font-size:0;text-align:center">
<div style="display:inline-block;font-size:16px;font-family:monospace;color:#000;line-height:1.2;pointer-events:all;white-space:normal;overflow-wrap:normal">
<div>
GET video.mp4
<br/>
</div>
</div>
</div>
</div>
</foreignObject>
<text x="445" y="285" font-family="Monospace" font-size="16" text-anchor="middle">GET video.mp4
</text>
</switch>
<rect width="150" height="24" x="370" y="326" fill="none" pointer-events="all" rx=".72" ry=".72"/>
<switch transform="translate(-.5 -.5)">
<foreignObject width="100%" height="100%" pointer-events="none" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow:visible;text-align:left">
<div xmlns="http://www.w3.org/1999/xhtml" style="display:flex;align-items:unsafe center;justify-content:unsafe center;width:144px;height:1px;padding-top:338px;margin-left:373px">
<div data-drawio-colors="color: rgb(0, 0, 0);" style="box-sizing:border-box;font-size:0;text-align:center">
<div style="display:inline-block;font-size:16px;font-family:monospace;color:#000;line-height:1.2;pointer-events:all;white-space:normal;overflow-wrap:normal">
<div>
GET advert.jpg
<br/>
</div>
</div>
</div>
</div>
</foreignObject>
<text x="445" y="343" font-family="Monospace" font-size="16" text-anchor="middle">GET advert.jpg
</text>
</switch>
<rect width="140" height="70" x="550" y="50" fill="#bac8d3" stroke="#23445d" pointer-events="all" rx="2.1" ry="2.1"/>
<switch transform="translate(-.5 -.5)">
<foreignObject width="100%" height="100%" pointer-events="none" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow:visible;text-align:left">
<div xmlns="http://www.w3.org/1999/xhtml" style="display:flex;align-items:unsafe center;justify-content:unsafe center;width:134px;height:1px;padding-top:85px;margin-left:553px">
<div data-drawio-colors="color: rgb(0, 0, 0);" style="box-sizing:border-box;font-size:0;text-align:center">
<div style="display:inline-block;font-size:16px;font-family:monospace;color:#000;line-height:1.2;pointer-events:all;white-space:normal;overflow-wrap:normal">
Web server
</div>
</div>
</div>
</foreignObject>
<text x="620" y="90" font-family="Monospace" font-size="16" text-anchor="middle">Web server</text>
</switch>
<g stroke="#000">
<path fill="none" stroke-miterlimit="10" d="M342.84 50.02 540 50v35h10" pointer-events="stroke"/>
<circle cx="339.84" cy="50.02" r="3" pointer-events="all"/>
</g>
<rect width="140" height="70" x="550" y="262" fill="#d0cee2" stroke="#56517e" pointer-events="all" rx="2.1" ry="2.1"/>
<switch transform="translate(-.5 -.5)">
<foreignObject width="100%" height="100%" pointer-events="none" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow:visible;text-align:left">
<div xmlns="http://www.w3.org/1999/xhtml" style="display:flex;align-items:unsafe center;justify-content:unsafe center;width:134px;height:1px;padding-top:297px;margin-left:553px">
<div data-drawio-colors="color: rgb(0, 0, 0);" style="box-sizing:border-box;font-size:0;text-align:center">
<div style="display:inline-block;font-size:16px;font-family:monospace;color:#000;line-height:1.2;pointer-events:all;white-space:normal;overflow-wrap:normal">
Video server
</div>
</div>
</div>
</foreignObject>
<text x="620" y="302" font-family="Monospace" font-size="16" text-anchor="middle">Video server</text>
</switch>
<rect width="140" height="70" x="550" y="350" fill="#b1ddf0" stroke="#10739e" pointer-events="all" rx="2.1" ry="2.1"/>
<switch transform="translate(-.5 -.5)">
<foreignObject width="100%" height="100%" pointer-events="none" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow:visible;text-align:left">
<div xmlns="http://www.w3.org/1999/xhtml" style="display:flex;align-items:unsafe center;justify-content:unsafe center;width:134px;height:1px;padding-top:385px;margin-left:553px">
<div data-drawio-colors="color: rgb(0, 0, 0);" style="box-sizing:border-box;font-size:0;text-align:center">
<div style="display:inline-block;font-size:16px;font-family:monospace;color:#000;line-height:1.2;pointer-events:all;white-space:normal;overflow-wrap:normal">
Ad server
</div>
</div>
</div>
</foreignObject>
<text x="620" y="390" font-family="Monospace" font-size="16" text-anchor="middle">Ad server</text>
</switch>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 16 KiB

127
static/img/blog/http-request.svg Normal file
View File

@@ -0,0 +1,127 @@
<svg xmlns="http://www.w3.org/2000/svg" style="background-color:#fff" viewBox="-.5 -.5 310 191">
<rect width="100%" height="100%" fill="#FFF"/>
<rect width="297" height="87" x="7" y="58" fill="#e6e6e6" pointer-events="all" rx="6.96" ry="6.96"/>
<g stroke="#000" stroke-miterlimit="10">
<path fill="none" d="M32.62 58.64 30.9 30" pointer-events="stroke"/>
<path d="m32.93 63.88-2.75-6.84 2.44 1.6 2.22-1.88Z" pointer-events="all"/>
</g>
<path fill="none" d="M0 0h60v30H0z" pointer-events="all"/>
<switch transform="translate(-.5 -.5)">
<foreignObject width="100%" height="100%" pointer-events="none" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow:visible;text-align:left">
<div xmlns="http://www.w3.org/1999/xhtml" style="display:flex;align-items:unsafe center;justify-content:unsafe center;width:58px;height:1px;padding-top:15px;margin-left:1px">
<div data-drawio-colors="color: rgb(0, 0, 0);" style="box-sizing:border-box;font-size:0;text-align:center">
<div style="display:inline-block;font-size:16px;font-family:Helvetica;color:#000;line-height:1.2;pointer-events:all;white-space:normal;overflow-wrap:normal">
<div style="font-size:16px">Method</div>
</div>
</div>
</div>
</foreignObject>
<text x="30" y="20" font-family="Helvetica" font-size="16" text-anchor="middle">Method</text>
</switch>
<path fill="none" d="M56 0h60v30H56z" pointer-events="all"/>
<switch transform="translate(-.5 -.5)">
<foreignObject width="100%" height="100%" pointer-events="none" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow:visible;text-align:left">
<div xmlns="http://www.w3.org/1999/xhtml" style="display:flex;align-items:unsafe center;justify-content:unsafe center;width:58px;height:1px;padding-top:15px;margin-left:57px">
<div data-drawio-colors="color: rgb(0, 0, 0);" style="box-sizing:border-box;font-size:0;text-align:center">
<div style="display:inline-block;font-size:16px;font-family:Helvetica;color:#000;line-height:1.2;pointer-events:all;white-space:normal;overflow-wrap:normal">Path</div>
</div>
</div>
</foreignObject>
<text x="86" y="20" font-family="Helvetica" font-size="16" text-anchor="middle">Path</text>
</switch>
<path fill="none" d="M113 0h122v30H113z" pointer-events="all"/>
<switch transform="translate(-.5 -.5)">
<foreignObject width="100%" height="100%" pointer-events="none" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow:visible;text-align:left">
<div xmlns="http://www.w3.org/1999/xhtml" style="display:flex;align-items:unsafe center;justify-content:unsafe center;width:120px;height:1px;padding-top:15px;margin-left:114px">
<div data-drawio-colors="color: rgb(0, 0, 0);" style="box-sizing:border-box;font-size:0;text-align:center">
<div style="display:inline-block;font-size:16px;font-family:Helvetica;color:#000;line-height:1.2;pointer-events:all;white-space:normal;overflow-wrap:normal">Protocol version</div>
</div>
</div>
</foreignObject>
<text x="174" y="20" font-family="Helvetica" font-size="16" text-anchor="middle">Protocol version</text>
</switch>
<path fill="none" d="M127 161h60v30h-60z" pointer-events="all"/>
<switch transform="translate(-.5 -.5)">
<foreignObject width="100%" height="100%" pointer-events="none" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow:visible;text-align:left">
<div xmlns="http://www.w3.org/1999/xhtml" style="display:flex;align-items:unsafe center;justify-content:unsafe center;width:58px;height:1px;padding-top:176px;margin-left:128px">
<div data-drawio-colors="color: rgb(0, 0, 0);" style="box-sizing:border-box;font-size:0;text-align:center">
<div style="display:inline-block;font-size:16px;font-family:Helvetica;color:#000;line-height:1.2;pointer-events:all;white-space:normal;overflow-wrap:normal">
<div style="font-size:16px">Headers</div>
</div>
</div>
</div>
</foreignObject>
<text x="157" y="181" font-family="Helvetica" font-size="16" text-anchor="middle">Headers</text>
</switch>
<g stroke="#000" stroke-miterlimit="10">
<path fill="none" d="M79.45 58.2 83.73 30" pointer-events="stroke"/>
<path d="m78.67 63.39-1.26-7.27 2.04 2.08 2.57-1.38Z" pointer-events="all"/>
</g>
<g stroke="#000" stroke-miterlimit="10">
<path fill="none" d="M153.71 58.24 166.96 30" pointer-events="stroke"/>
<path d="m151.48 62.99.86-7.33 1.37 2.58 2.85-.6Z" pointer-events="all"/>
</g>
<rect width="36" height="21" x="15" y="65" fill="#f2fffc" pointer-events="all" rx="1.68" ry="1.68"/>
<switch transform="translate(-.5 -.5)">
<foreignObject width="100%" height="100%" pointer-events="none" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow:visible;text-align:left">
<div xmlns="http://www.w3.org/1999/xhtml" style="display:flex;align-items:unsafe center;justify-content:unsafe flex-start;width:1px;height:1px;padding-top:76px;margin-left:19px">
<div data-drawio-colors="color: #333333;" style="box-sizing:border-box;font-size:0;text-align:left">
<div style="display:inline-block;font-size:16px;font-family:monospace;color:#333;line-height:1.2;pointer-events:all;white-space:nowrap">
<p style="line-height:100%">
<font color="#509ad4" style="font-size:16px">GET</font>
</p>
</div>
</div>
</div>
</foreignObject>
<text x="19" y="80" fill="#333" font-family="Monospace" font-size="16">GET</text>
</switch>
<rect width="17" height="21" x="70" y="64.5" fill="#f5f5ff" pointer-events="all" rx="1.36" ry="1.36"/>
<switch transform="translate(-.5 -.5)">
<foreignObject width="100%" height="100%" pointer-events="none" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow:visible;text-align:left">
<div xmlns="http://www.w3.org/1999/xhtml" style="display:flex;align-items:unsafe center;justify-content:unsafe flex-start;width:1px;height:1px;padding-top:75px;margin-left:74px">
<div data-drawio-colors="color: #333333;" style="box-sizing:border-box;font-size:0;text-align:left">
<div style="display:inline-block;font-size:16px;font-family:monospace;color:#333;line-height:1.2;pointer-events:all;white-space:nowrap">
<p style="line-height:100%">/</p>
</div>
</div>
</div>
</foreignObject>
<text x="74" y="80" fill="#333" font-family="Monospace" font-size="16">/</text>
</switch>
<rect width="100" height="22" x="101" y="64" fill="#f5ebef" pointer-events="all" rx="1.76" ry="1.76"/>
<switch transform="translate(-.5 -.5)">
<foreignObject width="100%" height="100%" pointer-events="none" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow:visible;text-align:left">
<div xmlns="http://www.w3.org/1999/xhtml" style="display:flex;align-items:unsafe center;justify-content:unsafe flex-start;width:1px;height:1px;padding-top:75px;margin-left:105px">
<div data-drawio-colors="color: #333333;" style="box-sizing:border-box;font-size:0;text-align:left">
<div style="display:inline-block;font-size:16px;font-family:monospace;color:#333;line-height:1.2;pointer-events:all;white-space:nowrap">
<p style="line-height:100%">
<font color="#5d837e" style="font-size:16px">HTTP</font>/<font color="#cd5b92" style="font-size:16px">1.1</font>
</p>
</div>
</div>
</div>
</foreignObject>
<text x="105" y="80" fill="#333" font-family="Monospace" font-size="16">HTTP/1.1</text>
</switch>
<rect width="284" height="48" x="15" y="90" fill="#cfe3f5" pointer-events="all" rx="3.84" ry="3.84"/>
<switch transform="translate(-.5 -.5)">
<foreignObject width="100%" height="100%" pointer-events="none" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow:visible;text-align:left">
<div xmlns="http://www.w3.org/1999/xhtml" style="display:flex;align-items:unsafe center;justify-content:unsafe flex-start;width:278px;height:1px;padding-top:114px;margin-left:19px">
<div data-drawio-colors="color: #333333;" style="box-sizing:border-box;font-size:0;text-align:left">
<div style="display:inline-block;font-size:16px;font-family:monospace;color:#333;line-height:1.2;pointer-events:all;white-space:normal;overflow-wrap:normal">
<div style="font-size:16px">
<font color="#5d837e" style="font-size:16px">Host</font>: developer.mozilla.org</div>
<div style="font-size:16px">
<font color="#5d837e" style="font-size:16px">Accept-Language</font>: fr</div>
</div>
</div>
</div>
</foreignObject>
<text x="19" y="119" fill="#333" font-family="Monospace" font-size="16">Host: developer.mozilla.org...</text>
</switch>
<g stroke="#000" stroke-miterlimit="10">
<path fill="none" d="M157 144.37V161" pointer-events="stroke"/>
<path d="m157 139.12 2.33 7-2.33-1.75-2.33 1.75Z" pointer-events="all"/>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 9.1 KiB

121
static/img/blog/http-response.svg Normal file
View File

@@ -0,0 +1,121 @@
<svg xmlns="http://www.w3.org/2000/svg" style="background-color:#fff" viewBox="-0.5 -0.5 422 205">
<rect width="100%" height="100%" fill="#FFF"/>
<rect width="381" height="105" x="30" y="51" fill="#e6e6e6" pointer-events="all" rx="3.15" ry="3.15"/>
<path fill="none" d="M233 0h137v30H233z" pointer-events="all"/>
<switch transform="translate(-.5 -.5)">
<foreignObject width="100%" height="100%" pointer-events="none" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow:visible;text-align:left">
<div xmlns="http://www.w3.org/1999/xhtml" style="display:flex;align-items:unsafe center;justify-content:unsafe center;width:135px;height:1px;padding-top:15px;margin-left:234px">
<div data-drawio-colors="color: rgb(0, 0, 0);" style="box-sizing:border-box;font-size:0;text-align:center">
<div style="display:inline-block;font-size:16px;font-family:Helvetica;color:#000;line-height:1.2;pointer-events:all;white-space:normal;overflow-wrap:normal">Status message</div>
</div>
</div>
</foreignObject>
<text x="302" y="20" font-family="Helvetica" font-size="16" text-anchor="middle">Status message</text>
</switch>
<path fill="none" d="M137 0h94v30h-94z" pointer-events="all"/>
<switch transform="translate(-.5 -.5)">
<foreignObject width="100%" height="100%" pointer-events="none" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow:visible;text-align:left">
<div xmlns="http://www.w3.org/1999/xhtml" style="display:flex;align-items:unsafe center;justify-content:unsafe center;width:92px;height:1px;padding-top:15px;margin-left:138px">
<div data-drawio-colors="color: rgb(0, 0, 0);" style="box-sizing:border-box;font-size:0;text-align:center">
<div style="display:inline-block;font-size:16px;font-family:Helvetica;color:#000;line-height:1.2;pointer-events:all;white-space:normal;overflow-wrap:normal">Status code</div>
</div>
</div>
</foreignObject>
<text x="184" y="20" font-family="Helvetica" font-size="16" text-anchor="middle">Status code</text>
</switch>
<path fill="none" d="M0 0h118v30H0z" pointer-events="all"/>
<switch transform="translate(-.5 -.5)">
<foreignObject width="100%" height="100%" pointer-events="none" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow:visible;text-align:left">
<div xmlns="http://www.w3.org/1999/xhtml" style="display:flex;align-items:unsafe center;justify-content:unsafe center;width:116px;height:1px;padding-top:15px;margin-left:1px">
<div data-drawio-colors="color: rgb(0, 0, 0);" style="box-sizing:border-box;font-size:0;text-align:center">
<div style="display:inline-block;font-size:16px;font-family:Helvetica;color:#000;line-height:1.2;pointer-events:all;white-space:normal;overflow-wrap:normal">Protocol version</div>
</div>
</div>
</foreignObject>
<text x="59" y="20" font-family="Helvetica" font-size="16" text-anchor="middle">Protocol version</text>
</switch>
<path fill="none" d="M192 175h60v30h-60z" pointer-events="all"/>
<switch transform="translate(-.5 -.5)">
<foreignObject width="100%" height="100%" pointer-events="none" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow:visible;text-align:left">
<div xmlns="http://www.w3.org/1999/xhtml" style="display:flex;align-items:unsafe center;justify-content:unsafe center;width:58px;height:1px;padding-top:190px;margin-left:193px">
<div data-drawio-colors="color: rgb(0, 0, 0);" style="box-sizing:border-box;font-size:0;text-align:center">
<div style="display:inline-block;font-size:16px;font-family:Helvetica;color:#000;line-height:1.2;pointer-events:all;white-space:normal;overflow-wrap:normal">
<div style="font-size:16px">Headers</div>
</div>
</div>
</div>
</foreignObject>
<text x="222" y="195" font-family="Helvetica" font-size="16" text-anchor="middle">Headers</text>
</switch>
<rect width="36" height="21" x="197" y="56" fill="#f2fffc" pointer-events="all" rx="1.68" ry="1.68"/>
<switch transform="translate(-.5 -.5)">
<foreignObject width="100%" height="100%" pointer-events="none" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow:visible;text-align:left">
<div xmlns="http://www.w3.org/1999/xhtml" style="display:flex;align-items:unsafe center;justify-content:unsafe center;width:1px;height:1px;padding-top:66px;margin-left:215px">
<div data-drawio-colors="color: #333333;" style="box-sizing:border-box;font-size:0;text-align:center">
<div style="display:inline-block;font-size:16px;font-family:monospace;color:#333;line-height:1.2;pointer-events:all;white-space:nowrap">OK</div>
</div>
</div>
</foreignObject>
<text x="215" y="71" fill="#333" font-family="Monospace" font-size="16" text-anchor="middle">OK</text>
</switch>
<rect width="42" height="21" x="139" y="56" fill="#f5f5ff" pointer-events="all" rx="1.68" ry="1.68"/>
<switch transform="translate(-.5 -.5)">
<foreignObject width="100%" height="100%" pointer-events="none" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow:visible;text-align:left">
<div xmlns="http://www.w3.org/1999/xhtml" style="display:flex;align-items:unsafe center;justify-content:unsafe center;width:1px;height:1px;padding-top:66px;margin-left:160px">
<div data-drawio-colors="color: #333333;" style="box-sizing:border-box;font-size:0;text-align:center">
<div style="display:inline-block;font-size:16px;font-family:monospace;color:#333;line-height:1.2;pointer-events:all;white-space:nowrap">200</div>
</div>
</div>
</foreignObject>
<text x="160" y="71" fill="#333" font-family="Monospace" font-size="16" text-anchor="middle">200</text>
</switch>
<rect width="92" height="22" x="38" y="55" fill="#f5ebef" pointer-events="all" rx="1.76" ry="1.76"/>
<switch transform="translate(-.5 -.5)">
<foreignObject width="100%" height="100%" pointer-events="none" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow:visible;text-align:left">
<div xmlns="http://www.w3.org/1999/xhtml" style="display:flex;align-items:unsafe center;justify-content:unsafe center;width:1px;height:1px;padding-top:66px;margin-left:84px">
<div data-drawio-colors="color: #333333;" style="box-sizing:border-box;font-size:0;text-align:center">
<div style="display:inline-block;font-size:16px;font-family:monospace;color:#333;line-height:1.2;pointer-events:all;white-space:nowrap">
<p style="line-height:100%">
<font color="#5d837e" style="font-size:16px">HTTP</font>/<font color="#cd5b92" style="font-size:16px">1.1</font>
</p>
</div>
</div>
</div>
</foreignObject>
<text x="84" y="71" fill="#333" font-family="Monospace" font-size="16" text-anchor="middle">HTTP/1.1</text>
</switch>
<rect width="368" height="63" x="38" y="83" fill="#cfe3f5" pointer-events="all" rx="1.89" ry="1.89"/>
<switch transform="translate(-.5 -.5)">
<foreignObject width="100%" height="100%" pointer-events="none" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow:visible;text-align:left">
<div xmlns="http://www.w3.org/1999/xhtml" style="display:flex;align-items:unsafe center;justify-content:unsafe flex-start;width:362px;height:1px;padding-top:115px;margin-left:42px">
<div data-drawio-colors="color: #333333;" style="box-sizing:border-box;font-size:0;text-align:left">
<div style="display:inline-block;font-size:16px;font-family:monospace;color:#333;line-height:1.2;pointer-events:all;white-space:normal;overflow-wrap:normal">
<div style="font-size:16px">
<font color="#5d837e" style="font-size:16px">date</font>: Tue, 18 Jun 2024 10:03:55 GMT</div>
<div style="font-size:16px">
<font color="#5d837e" style="font-size:16px">cache-control</font>: public, max-age=3600</div>
<div style="font-size:16px">
<font color="#5d837e" style="font-size:16px">content-type</font>: text/html</div>
</div>
</div>
</div>
</foreignObject>
<text x="42" y="119" fill="#333" font-family="Monospace" font-size="16">date: Tue, 18 Jun 2024 10:03:55 GMT...</text>
</switch>
<g stroke="#000" stroke-miterlimit="10">
<path fill="none" d="M222 152.37V175" pointer-events="stroke"/>
<path d="m222 147.12 2.33 7-2.33-1.75-2.33 1.75Z" pointer-events="all"/>
</g>
<g stroke="#000" stroke-miterlimit="10">
<path fill="none" d="M229.63 53.02 273.15 30" pointer-events="stroke"/>
<path d="m224.99 55.48 5.09-5.34-.45 2.88 2.64 1.25Z" pointer-events="all"/>
</g>
<g stroke="#000" stroke-miterlimit="10">
<path fill="none" d="m163.22 50.5 12-20.5" pointer-events="stroke"/>
<path d="m160.56 55.04 1.53-7.22 1.13 2.68 2.89-.33Z" pointer-events="all"/>
</g>
<g stroke="#000" stroke-miterlimit="10">
<path fill="none" d="M60.68 48.64 59.75 30" pointer-events="stroke"/>
<path d="m60.94 53.88-2.68-6.87 2.42 1.63 2.25-1.86Z" pointer-events="all"/>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 9.1 KiB

BIN
static/img/blog/iis-changeroot-websoft9.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 15 KiB

BIN
static/img/blog/model-view-controller-light-blue.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 42 KiB

BIN
static/img/blog/web_application_with_html_and_steps.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 18 KiB