代码 · 思考 · 生活https://blog-astro.pages.dev/Firefly6.8.7https://github.com/CuteLeaf/Firefly2026年5月30日 13:30:49https://blog-astro.pages.dev/posts/hello-world/https://blog-astro.pages.dev/posts/hello-world/欢迎来到我的技术博客！这里将记录我在编程、架构和日常开发中的思考与实践。Sat, 30 May 2026 00:00:00 GMT<section><h2>👋 欢迎<a href="#-欢迎"><span>#</span></a></h2><p>你好！欢迎来到我的博客。这里是我记录技术成长、分享开发经验的地方。</p></section> <section><h2>📝 关于这个博客<a href="#-关于这个博客"><span>#</span></a></h2><p>这个博客基于以下技术栈构建：</p><ul> <li><strong><a href="https://astro.build" target="_blank">Astro</a></strong> — 现代化的静态站点生成器，提供极致的加载速度</li> <li><strong><a href="https://tailwindcss.com" target="_blank">Tailwind CSS</a></strong> — 实用优先的 CSS 框架</li> <li><strong><a href="https://github.com/CuteLeaf/Firefly" target="_blank">Firefly</a></strong> — 清新美观的博客主题模板</li> </ul></section> <section><h2>🎯 我会写什么<a href="#-我会写什么"><span>#</span></a></h2><ul> <li><strong>Web 开发</strong>：前端框架、CSS 技巧、性能优化</li> <li><strong>后端架构</strong>：API 设计、数据库优化、微服务</li> <li><strong>AI 应用</strong>：LLM 应用开发、Prompt Engineering</li> <li><strong>开发工具</strong>：Git、Docker、CI/CD 实践</li> <li><strong>读书笔记</strong>：技术书籍的阅读与思考</li> </ul></section> <section><h2>📬 联系我<a href="#-联系我"><span>#</span></a></h2><p>如果你有任何问题或建议，欢迎通过 GitHub 或邮件联系我。</p><p>感谢你的访问！</p></section>https://blog-astro.pages.dev/posts/astro-static-blog-guide/https://blog-astro.pages.dev/posts/astro-static-blog-guide/详细介绍如何使用 Astro 框架从零搭建一个高性能的静态博客，包括项目初始化、配置、内容管理和部署。Thu, 28 May 2026 00:00:00 GMT<section><h2>为什么选择 Astro？<a href="#为什么选择-astro"><span>#</span></a></h2><p><a href="https://astro.build" target="_blank">Astro</a> 是近年来最受欢迎的静态站点生成器之一。它的核心理念是”零 JavaScript 优先”——默认情况下，Astro 在服务端渲染所有内容，只在需要交互的地方加载 JavaScript。</p><section><h3>Astro 的优势<a href="#astro-的优势"><span>#</span></a></h3><ol> <li><strong>极致性能</strong>：默认零 JS，页面加载速度极快</li> <li><strong>多框架支持</strong>：可以在同一个项目中使用 React、Vue、Svelte 等</li> <li><strong>Markdown 原生支持</strong>：内容创作体验极佳</li> <li><strong>强大的 Islands 架构</strong>：按需加载交互组件</li> </ol></section></section> <section><h2>项目初始化<a href="#项目初始化"><span>#</span></a></h2><div><figure><figcaption><span></span><span>Terminal window</span></figcaption><pre><code><div><div><div>1</div></div><div><span># 创建 Astro 项目</span></div></div><div><div><div>2</div></div><div><span>npm</span><span> </span><span>create</span><span> </span><span>astro@latest</span><span> </span><span>my-blog</span></div></div><div><div><div>3</div></div><div> </div></div><div><div><div>4</div></div><div><span># 选择模板和配置</span></div></div><div><div><div>5</div></div><div><span>cd</span><span> </span><span>my-blog</span></div></div><div><div><div>6</div></div><div><span>npm</span><span> </span><span>install</span></div></div><div><div><div>7</div></div><div><span>npm</span><span> </span><span>run</span><span> </span><span>dev</span></div></div></code></pre><div><div></div><div></div></div></figure></div></section> <section><h2>内容管理<a href="#内容管理"><span>#</span></a></h2><p>Astro 使用基于文件的路由系统。所有的博客文章可以放在 <code>src/content/posts/</code> 目录下：</p><div><figure><figcaption></figcaption><pre><code><div><div><div>1</div></div><div><span>---</span></div></div><div><div><div>2</div></div><div><span>title</span><span>: </span><span>文章标题</span></div></div><div><div><div>3</div></div><div><span>published</span><span>: </span><span>2026-01-01</span></div></div><div><div><div>4</div></div><div><span>tags</span><span>: [</span><span>标签1</span><span>, </span><span>标签2</span><span>]</span></div></div><div><div><div>5</div></div><div><span>---</span></div></div><div><div><div>6</div></div><div> </div></div><div><div><div>7</div></div><div><span>文章内容...</span></div></div></code></pre><div><div></div><div></div></div></figure></div></section> <section><h2>部署建议<a href="#部署建议"><span>#</span></a></h2><p>推荐使用以下平台进行部署：</p><ul> <li><strong>Cloudflare Pages</strong>：全球 CDN + 免费 DDoS 防护</li> <li><strong>Vercel</strong>：自动化部署 + 边缘函数</li> <li><strong>Netlify</strong>：简单易用的静态托管</li> </ul></section> <section><h2>总结<a href="#总结"><span>#</span></a></h2><p>Astro 是构建内容驱动型网站的理想选择。它兼顾了开发体验和最终用户的性能体验，非常适合技术博客这类场景。</p></section>https://blog-astro.pages.dev/posts/web-security-best-practices/https://blog-astro.pages.dev/posts/web-security-best-practices/系统地介绍 Web 应用常见的安全威胁和防护策略，包括 XSS、CSRF、DDoS 攻击防范、安全头配置等。Mon, 25 May 2026 00:00:00 GMT<section><h2>常见 Web 安全威胁<a href="#常见-web-安全威胁"><span>#</span></a></h2><p>在部署一个面向公网的 Web 应用时，必须考虑以下安全威胁：</p><section><h3>1. XSS（跨站脚本攻击）<a href="#1-xss跨站脚本攻击"><span>#</span></a></h3><p>攻击者通过注入恶意脚本，在用户浏览器中执行非法操作。</p><p><strong>防护措施</strong>：</p><ul> <li>对用户输入进行严格的验证和转义</li> <li>使用 Content-Security-Policy (CSP) 头</li> <li>设置 Cookie 的 <code>HttpOnly</code> 和 <code>Secure</code> 属性</li> </ul></section><section><h3>2. CSRF（跨站请求伪造）<a href="#2-csrf跨站请求伪造"><span>#</span></a></h3><p>攻击者诱导用户在已认证的网站上执行非预期的操作。</p><p><strong>防护措施</strong>：</p><ul> <li>使用 CSRF Token</li> <li>验证 <code>Origin</code> / <code>Referer</code> 头</li> <li>使用 <code>SameSite</code> Cookie 属性</li> </ul></section><section><h3>3. DDoS 攻击<a href="#3-ddos-攻击"><span>#</span></a></h3><p>分布式拒绝服务攻击，通过大量请求耗尽服务器资源。</p><p><strong>防护措施</strong>：</p><ul> <li>使用 CDN 服务（Cloudflare、AWS CloudFront）</li> <li>配置速率限制（Rate Limiting）</li> <li>启用 WAF（Web Application Firewall）</li> <li>使用反向代理（Nginx）进行连接限制</li> </ul></section></section> <section><h2>安全 HTTP 头配置<a href="#安全-http-头配置"><span>#</span></a></h2><p>以下是在 Nginx 中配置安全头的示例：</p><div><figure><figcaption></figcaption><pre><code><div><div><div>1</div></div><div><span># Content Security Policy</span></div></div><div><div><div>2</div></div><div><span>add_header </span><span>Content-Security-Policy </span><span>"default-src 'self'; script-src 'self' 'unsafe-inline'; style-src 'self' 'unsafe-inline';"</span><span>;</span></div></div><div><div><div>3</div></div><div> </div></div><div><div><div>4</div></div><div><span># 防止点击劫持</span></div></div><div><div><div>5</div></div><div><span>add_header </span><span>X-Frame-Options </span><span>"DENY"</span><span>;</span></div></div><div><div><div>6</div></div><div> </div></div><div><div><div>7</div></div><div><span># 防止 MIME 类型嗅探</span></div></div><div><div><div>8</div></div><div><span>add_header </span><span>X-Content-Type-Options </span><span>"nosniff"</span><span>;</span></div></div><div><div><div>9</div></div><div> </div></div><div><div><div>10</div></div><div><span># 启用浏览器 XSS 过滤器</span></div></div><div><div><div>11</div></div><div><span>add_header </span><span>X-XSS-Protection </span><span>"1; mode=block"</span><span>;</span></div></div><div><div><div>12</div></div><div> </div></div><div><div><div>13</div></div><div><span># HTTP 严格传输安全</span></div></div><div><div><div>14</div></div><div><span>add_header </span><span>Strict-Transport-Security </span><span>"max-age=31536000; includeSubDomains; preload"</span><span>;</span></div></div></code></pre><div><div></div><div></div></div></figure></div></section> <section><h2>Cloudflare DDoS 防护<a href="#cloudflare-ddos-防护"><span>#</span></a></h2><p>Cloudflare 提供免费的企业级 DDoS 防护：</p><ol> <li><strong>Anycast 网络</strong>：全球 300+ 数据中心分散攻击流量</li> <li><strong>Layer 3/4 防护</strong>：自动缓解 TCP/UDP/ICMP 洪水攻击</li> <li><strong>Layer 7 防护</strong>：智能识别和拦截 HTTP 洪水攻击</li> <li><strong>Rate Limiting</strong>：限制单个 IP 的请求频率</li> </ol></section> <section><h2>总结<a href="#总结"><span>#</span></a></h2><p>Web 安全是一个持续的过程。除了技术层面的防护，定期安全审计、保持依赖更新、遵循最小权限原则同样重要。</p></section>