<?xml version="1.0" encoding="utf-8" standalone="yes"?><rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:content="http://purl.org/rss/1.0/modules/content/"><channel><title>WebonDocs</title><link>https://hiraethecho.github.io/docs/tags/web/</link><description>Recent contentinWebonDocs</description><generator>Hugo --0.152.2</generator><language>en</language><managingEditor>wyz2016zxc@outlook.com(Hiraeth)</managingEditor><webMaster>wyz2016zxc@outlook.com(Hiraeth)</webMaster><lastBuildDate>Mon, 16 Mar 2026 15:39:39 +0800</lastBuildDate><atom:link href="https://hiraethecho.github.io/docs/tags/web/index.xml" rel="self" type="application/rss+xml"/><item><title>薅羊毛cloudflare</title><link>https://hiraethecho.github.io/docs/dev/cloudflare/</link><pubDate>Sun, 20 Jul 2025 00:00:00 +0000</pubDate><author>wyz2016zxc@outlook.com(Hiraeth)</author><guid>https://hiraethecho.github.io/docs/dev/cloudflare/</guid><description>&lt;h1 id="cloudflare的功能"&gt;
&lt;a class="anchor inpage" href="#cloudflare%e7%9a%84%e5%8a%9f%e8%83%bd"&gt;#&lt;/a&gt;cloudflare的功能&lt;/h1&gt;
&lt;h2 id="安全防护"&gt;
&lt;a class="anchor inpage" href="#%e5%ae%89%e5%85%a8%e9%98%b2%e6%8a%a4"&gt;##&lt;/a&gt;安全防护&lt;/h2&gt;
&lt;p&gt;Cloudflare 提供全球领先的安全解决方案，保护网站和用户免受攻击：&lt;/p&gt;
&lt;ol&gt;
&lt;li&gt;&lt;strong&gt;Web 应用防火墙 (WAF)&lt;/strong&gt;：实时阻止恶意流量，防止常见攻击如 SQL 注入和跨站脚本攻击。&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;DDoS 防护&lt;/strong&gt;：自动检测并缓解大规模分布式拒绝服务攻击。&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;Bot 管理&lt;/strong&gt;：区分合法用户和恶意机器人，防止数据抓取或资源滥用。&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;SSL/TLS 加密&lt;/strong&gt;：通过一键启用 HTTPS 提供网站加密，确保数据传输安全。&lt;/li&gt;
&lt;/ol&gt;
&lt;h2 id="流量管理"&gt;
&lt;a class="anchor inpage" href="#%e6%b5%81%e9%87%8f%e7%ae%a1%e7%90%86"&gt;##&lt;/a&gt;流量管理&lt;/h2&gt;
&lt;p&gt;Cloudflare 的流量管理服务帮助用户优化请求路径，提高访问速度：&lt;/p&gt;</description><content:encoded><![CDATA[<h1 id="cloudflare的功能">
  <a class="anchor inpage" href="#cloudflare%e7%9a%84%e5%8a%9f%e8%83%bd">#</a>cloudflare的功能</h1>
<h2 id="安全防护">
  <a class="anchor inpage" href="#%e5%ae%89%e5%85%a8%e9%98%b2%e6%8a%a4">##</a>安全防护</h2>
<p>Cloudflare 提供全球领先的安全解决方案，保护网站和用户免受攻击：</p>
<ol>
<li><strong>Web 应用防火墙 (WAF)</strong>：实时阻止恶意流量，防止常见攻击如 SQL 注入和跨站脚本攻击。</li>
<li><strong>DDoS 防护</strong>：自动检测并缓解大规模分布式拒绝服务攻击。</li>
<li><strong>Bot 管理</strong>：区分合法用户和恶意机器人，防止数据抓取或资源滥用。</li>
<li><strong>SSL/TLS 加密</strong>：通过一键启用 HTTPS 提供网站加密，确保数据传输安全。</li>
</ol>
<h2 id="流量管理">
  <a class="anchor inpage" href="#%e6%b5%81%e9%87%8f%e7%ae%a1%e7%90%86">##</a>流量管理</h2>
<p>Cloudflare 的流量管理服务帮助用户优化请求路径，提高访问速度：</p>
<ol>
<li><strong>负载均衡</strong>：分配流量到不同的服务器或数据中心，确保高可用性和可靠性。</li>
<li><strong>Argo 智能路由</strong>：利用 Cloudflare 网络的实时数据，为请求选择最快的路径。</li>
<li><strong>内容分发网络 (CDN)</strong>：缓存静态资源，提高全球访问速度并减少服务器负载。</li>
</ol>
<h2 id="分析与监控">
  <a class="anchor inpage" href="#%e5%88%86%e6%9e%90%e4%b8%8e%e7%9b%91%e6%8e%a7">##</a>分析与监控</h2>
<p>Cloudflare 提供详细的分析工具，帮助用户了解网站流量和性能：</p>
<ol>
<li><strong>实时分析</strong>：显示实时流量、威胁拦截和性能数据。</li>
<li><strong>日志访问</strong>：通过 API 提供详细的请求日志，支持高级分析和故障排查。</li>
<li><strong>用户洞察</strong>：了解访客的地理位置、设备类型和行为数据。</li>
</ol>
<h2 id="dns">
  <a class="anchor inpage" href="#dns">##</a>DNS</h2>
<p>添加 DNS 记录是 Cloudflare 的核心功能之一，可以使其他人访问某个 URL 时解析到特定位置。</p>
<h3 id="如何添加-dns-记录">
  <a class="anchor inpage" href="#%e5%a6%82%e4%bd%95%e6%b7%bb%e5%8a%a0-dns-%e8%ae%b0%e5%bd%95">###</a>如何添加 DNS 记录</h3>
<ol>
<li>登录到 
。</li>
<li>选择需要管理的域名。</li>
<li>导航到 <strong>DNS</strong> 页面。</li>
<li>点击 <strong>添加记录 (Add Record)</strong> 按钮。</li>
<li>填写以下信息：
<ul>
<li><strong>记录类型 (Type)</strong>：如 A、CNAME、MX 等。</li>
<li><strong>名称 (Name)</strong>：子域名或主域名。</li>
<li><strong>内容 (Content)</strong>：目标地址，例如 IP 或 URL。</li>
<li><strong>TTL (生存时间)</strong>：可选，通常默认即可。</li>
</ul>
</li>
<li>保存更改后，记录会立即生效。</li>
</ol>
<h3 id="支持的服务">
  <a class="anchor inpage" href="#%e6%94%af%e6%8c%81%e7%9a%84%e6%9c%8d%e5%8a%a1">###</a>支持的服务</h3>
<ul>
<li><strong>Cloudflare 内服务</strong>：如桶存储、Zero Trust Tunnel、Workers and Pages、Email 服务等，通常自动添加记录。</li>
<li><strong>Cloudflare 外服务</strong>：如服务器、Netlify、Vercel 等服务，用户可以手动配置。</li>
</ul>
<p>通过精准和高效的 DNS 管理，Cloudflare 提升了域名解析的速度和可靠性。</p>
<h2 id="zero-trust">
  <a class="anchor inpage" href="#zero-trust">##</a>zero trust</h2>
<p>Cloudflare Zero Trust 提供了一种现代化的网络安全解决方案，可以保护用户、设备和应用程序的安全访问。其主要特性包括：</p>
<ol>
<li><strong>身份验证</strong>：通过集成身份提供商（如 Okta、Google Workspace），可以确保只有授权用户才能访问资源。</li>
<li><strong>应用程序访问</strong>：无需 VPN，用户可以通过 Cloudflare Access 安全地访问内部应用程序。</li>
<li><strong>威胁防护</strong>：利用 DNS 过滤和浏览器隔离技术，阻止恶意软件、钓鱼攻击等威胁。</li>
<li><strong>设备管理</strong>：通过 Cloudflare Gateway 支持设备的安全策略和流量监控。</li>
</ol>
<h3 id="使用场景">
  <a class="anchor inpage" href="#%e4%bd%bf%e7%94%a8%e5%9c%ba%e6%99%af">###</a>使用场景</h3>
<ul>
<li><strong>远程办公</strong>：为分布式团队提供安全的资源访问。</li>
<li><strong>零信任架构迁移</strong>：逐步替代传统的网络边界安全模型。</li>
<li><strong>第三方访问控制</strong>：为合作伙伴或供应商提供安全的访问权限。</li>
</ul>
<h3 id="配置方法">
  <a class="anchor inpage" href="#%e9%85%8d%e7%bd%ae%e6%96%b9%e6%b3%95">###</a>配置方法</h3>
<ol>
<li>登录到 
。</li>
<li>设置身份验证规则，选择身份提供商。</li>
<li>配置应用程序访问策略，指定允许访问的用户和条件。</li>
<li>启用威胁防护功能，根据需要调整策略。</li>
</ol>
<p>通过 Zero Trust，企业可以显著提升安全性，同时简化资源访问的流程。</p>
<h2 id="存储">
  <a class="anchor inpage" href="#%e5%ad%98%e5%82%a8">##</a>存储</h2>
<h3 id="bucket">
  <a class="anchor inpage" href="#bucket">###</a>Bucket</h3>
<p>Cloudflare 提供了对象存储服务，用户可以通过 <strong>R2 Bucket</strong> 以低成本存储大量非结构化数据，兼容 S3 API，便于与其他工具整合。</p>
<p><strong>使用案例：</strong></p>
<ul>
<li>为 Web 应用提供静态文件存储。</li>
<li>存储日志文件或大数据集。</li>
<li>备份和归档重要数据。</li>
</ul>
<h3 id="kv">
  <a class="anchor inpage" href="#kv">###</a>KV</h3>
<p>Cloudflare Key-Value（KV）存储是一种分布式的键值数据库，适用于缓存和快速读取小型数据。</p>
<p><strong>使用案例：</strong></p>
<ul>
<li>缓存 API 响应数据以减少服务器负载。</li>
<li>存储用户偏好设置、会话信息等轻量级数据。</li>
</ul>
<h3 id="d1">
  <a class="anchor inpage" href="#d1">###</a>D1</h3>
<p>Cloudflare D1 是新推出的分布式 SQL 数据库，提供强大的查询功能和一致性，适合需要结构化数据存储的应用。</p>
<p><strong>使用案例：</strong></p>
<ul>
<li>构建基于数据库的动态 Web 应用。</li>
<li>存储用户表单输入、订单信息等结构化数据。</li>
<li>实现实时分析和报告。</li>
</ul>
<h2 id="计算">
  <a class="anchor inpage" href="#%e8%ae%a1%e7%ae%97">##</a>计算</h2>
<h3 id="网页-pages">
  <a class="anchor inpage" href="#%e7%bd%91%e9%a1%b5-pages">###</a>网页 pages</h3>
<p>Cloudflare Pages 是一种无服务器的平台，支持快速部署静态和动态网站。通过与 GitHub 集成，可以自动构建和部署网站。</p>
<p>部署步骤</p>
<ol>
<li>登录到 
。</li>
<li>转到 <strong>Pages</strong> 部分，点击 <strong>创建项目 (Create a Project)</strong>。</li>
<li>选择绑定的 GitHub 仓库，授权 Pages 访问代码。</li>
<li>设置构建配置，包括：
<ul>
<li><strong>构建命令 (Build Command)</strong>：如 <code>npm run build</code>。</li>
<li><strong>输出目录 (Output Directory)</strong>：如 <code>dist</code> 文件夹。</li>
</ul>
</li>
<li>点击 <strong>保存并部署 (Save and Deploy)</strong>，系统将开始自动构建和部署。</li>
</ol>
<p>使用场景</p>
<ul>
<li><strong>个人博客和作品集</strong>：快速搭建和部署个人网站。</li>
<li><strong>文档站点</strong>：为开源项目或企业创建文档页面。</li>
<li><strong>电商网站</strong>：托管小型在线商店的前端页面。</li>
</ul>
<p>通过 Pages，开发者可以专注于代码，而无需担心服务器配置和运维。</p>
<h3 id="workers">
  <a class="anchor inpage" href="#workers">###</a>workers</h3>
<p>Cloudflare Workers 是一种无服务器的计算平台，可以让开发者在边缘运行代码，从而减少延迟并提升性能。</p>
<ol>
<li><strong>性能优越</strong>：运行代码的延迟极低，因为它直接在用户最近的边缘节点执行。</li>
<li><strong>语言灵活</strong>：支持 JavaScript、TypeScript 和 WebAssembly。</li>
<li><strong>集成生态</strong>：可以与 Cloudflare 的其他服务（如 KV 和 R2）无缝集成。</li>
</ol>
<p>使用场景</p>
<ul>
<li><strong>API 网关</strong>：快速处理 API 请求，并将其转发到后端服务。</li>
<li><strong>动态内容生成</strong>：根据用户请求生成个性化的网页。</li>
<li><strong>安全增强</strong>：在边缘执行请求过滤或内容安全策略。</li>
</ul>
<p>以下是一个简单的示例，展示如何使用 Workers 来响应 HTTP 请求：</p>
<details open>
    <summary>javascript</summary><pre
        class="chroma codeblock"
      ><code class="language-javascript" data-lang="javascript"
          ><span style="display:flex;"><span><span style="color:#a6e22e">addEventListener</span>(<span style="color:#e6db74">&#34;fetch&#34;</span>, (<span style="color:#a6e22e">event</span>) =&gt; {
</span></span><span style="display:flex;"><span>  <span style="color:#a6e22e">event</span>.<span style="color:#a6e22e">respondWith</span>(<span style="color:#a6e22e">handleRequest</span>(<span style="color:#a6e22e">event</span>.<span style="color:#a6e22e">request</span>));
</span></span><span style="display:flex;"><span>});
</span></span><span style="display:flex;"><span>
</span></span><span style="display:flex;"><span><span style="color:#66d9ef">async</span> <span style="color:#66d9ef">function</span> <span style="color:#a6e22e">handleRequest</span>(<span style="color:#a6e22e">request</span>) {
</span></span><span style="display:flex;"><span>  <span style="color:#66d9ef">return</span> <span style="color:#66d9ef">new</span> <span style="color:#a6e22e">Response</span>(<span style="color:#e6db74">&#34;Hello, World!&#34;</span>, {
</span></span><span style="display:flex;"><span>    <span style="color:#a6e22e">headers</span><span style="color:#f92672">:</span> { <span style="color:#e6db74">&#34;content-type&#34;</span><span style="color:#f92672">:</span> <span style="color:#e6db74">&#34;text/plain&#34;</span> },
</span></span><span style="display:flex;"><span>  });
</span></span><span style="display:flex;"><span>}</span></span></code
        ><button onclick="copyCode(this)" class="copybtn">copy</button></pre></details>

  <script>
    function copyCode(btn) {
      const code = btn.previousElementSibling.textContent.trim();
      navigator.clipboard.writeText(code).then(() => {
        btn.innerText = "copied";
        setTimeout(() => (btn.innerText = "copy"), 2000);
      });
    }
  </script><p>通过这个示例代码，开发者可以快速开始使用 Cloudflare Workers 构建和部署无服务器应用。</p>
<h2 id="ai">
  <a class="anchor inpage" href="#ai">##</a>AI</h2>
]]></content:encoded></item><item><title>网页端下载网易云音乐的音乐</title><link>https://hiraethecho.github.io/docs/dev/netease/</link><pubDate>Tue, 29 Apr 2025 00:00:00 +0000</pubDate><author>wyz2016zxc@outlook.com(Hiraeth)</author><guid>https://hiraethecho.github.io/docs/dev/netease/</guid><description>通过浏览器的审查元素功能下载网易云音乐的音乐</description><content:encoded><![CDATA[<h1 id="从网页端下载音乐">
  <a class="anchor inpage" href="#%e4%bb%8e%e7%bd%91%e9%a1%b5%e7%ab%af%e4%b8%8b%e8%bd%bd%e9%9f%b3%e4%b9%90">#</a>从网页端下载音乐</h1>
<p>打开网易云音乐，然后打开<code>页面审查元素</code></p>
<ul>
<li>firefox系一般在<code>setting</code>-<code>more tools</code>-<code>webdeveloper tools</code>， 快捷键是<kbd>ctrl</kbd>+<kbd>shift</kbd>+<kbd>I</kbd></li>
<li>chrome系忘记了， 快捷键似乎是<kbd>F11</kbd>或<kbd>F12</kbd></li>
</ul>
<p>在新页面里选择<code>Network</code>，可以在<code>Filter</code>里写m4a。然后点击播放，会有新的请求。右键网址后用<code>open in new tab</code>，就可以在新页面打开音频。再右键保存音频即可。</p>
<blockquote class="alert alert-note">
      <p class="alert-heading">NOTE</p><p><del>或者直接<code>Save reponse as</code>来下载。</del> 这样只下载<code>1024k</code>的文件，不是整个。</p></blockquote><p>理论上是网页能播放就能下载。</p>
]]></content:encoded></item></channel></rss>