id: daa5135f2d564601ae7730f6e3608ed6
parent_id: 
item_type: 1
item_id: 84b611ae8ce148ce8d0a8df82d93e9e3
item_updated_time: 1764345636601
title_diff: "[{\"diffs\":[[1,\"手把手教你使用免费Cloudflare Pages部署静态网站\"]],\"start1\":0,\"start2\":0,\"length1\":0,\"length2\":31}]"
body_diff: "[{\"diffs\":[[1,\"<html>\\\r\\\n<head>\\\r\\\n  <title>手把手教你使用免费Cloudflare Pages部署静态网站</title>\\\r\\\n  <basefont face=\\\"微软雅黑\\\" size=\\\"2\\\" />\\\r\\\n  <meta http-equiv=\\\"Content-Type\\\" content=\\\"text/html;charset=utf-8\\\" />\\\r\\\n  <meta name=\\\"exporter-version\\\" content=\\\"YXBJ Windows/608924 (zh-CN, DDL); Windows/10.0.0 (Win64); EDAMVersion=V2;\\\"/>\\\r\\\n  <meta name=\\\"content-class\\\" content=\\\"yinxiang.peso.superNote\\\"/>\\\r\\\n  <meta name=\\\"application-data:yinxiang.noteLayout\\\" content=\\\"{\\\"lineSpace\\\":\\\"recommend\\\",\\\"paragraphSpace\\\":\\\"recommend\\\"}\\\"/>\\\r\\\n  <style>\\\r\\\n\\tbody, td {\\\r\\\n\\t  font-family: 微软雅黑;\\\r\\\n\\t  font-size: 12pt;\\\r\\\n\\t}\\\r\\\n  </style>\\\r\\\n</head>\\\r\\\n<body>\\\r\\\n<a name=\\\"44048\\\"></a>\\\r\\\n<h1>手把手教你使用免费Cloudflare Pages部署静态网站</h1>\\\r\\\n\\\r\\\n<div><span style=\\\"margin:0px;\\\"><div style=\\\"padding:8px 0px;margin:8px auto;max-width:700px;\\\"> <div><span></span></div>\\\n<p></p>\\\n<div style=\\\"--en-blockquote:true;box-sizing: border-box; padding-left: 19px; padding-top: 6px; padding-bottom: 6px; border-left: 3px solid #b4c0cc; background-position: initial initial; background-repeat: initial initial; margin-top: 6px\\\"><div>原文链接: <a href=\\\"http://mp.weixin.qq.com/s?__biz=MzAwOTU4NzM5Ng==&amp;mid=2455776849&amp;idx=1&amp;sn=8d7fe042d7ef3ed0a89fe069c5c51c02&amp;chksm=8d8f9ae45533bb40e21c60ea6fb854f61f4204a8f411b6486f7435ef76c7f1217647f362ebcb&amp;mpshare=1&amp;scene=1&amp;srcid=0602mVY2Gd6pfmL4W7I8RGON&amp;sharer_shareinfo=4a412f95d5cecdd8e7b7053bca96d8ae&amp;sharer_shareinfo_first=4a412f95d5cecdd8e7b7053bca96d8ae#rd\\\"><span>http://mp.weixin.qq.com/s?__biz=MzAwOTU4NzM5Ng==&amp;mid=2455776...</span></a></div></div>\\\n<p></p>\\\n<div><span></span></div>\\\n<div style=\\\"\\\"><div><div><h1 style=\\\"margin:0\\\"> 手把手教你使用免费Cloudflare Pages部署静态网站 </h1><div><span style=\\\"position:relative\\\">原创</span><span> 虞大胆 </span><span><a style=\\\"position:relative\\\"> 虞大胆的叽叽喳喳 </a></span><span><em></em></span></div><div style=\\\";\\\"><p style=\\\"box-sizing:border-box;border-width:0;border-style:solid;border-color:rgb(229,229,229);margin:0;color:rgb(10,10,10);font-family:ui-sans-serif,system-ui,sans-serif,&quot;Apple Color Emoji&quot;,&quot;Segoe UI Emoji&quot;,&quot;Segoe UI Symbol&quot;,&quot;Noto Color Emoji&quot;;font-style:normal;font-variant-ligatures:normal;font-variant-caps:normal;font-weight:400;letter-spacing:normal;orphans:2;text-align:start;text-indent:0;text-transform:none;widows:2;word-spacing:0;-webkit-text-stroke-width:0;white-space:normal;background-color:rgb(255,255,255);text-decoration-thickness:initial;text-decoration-style:initial;text-decoration-color:initial;font-size:0;line-height:0\\\"><span><br/></span></p><div style=\\\"box-sizing: border-box;border-width: 0px;border-style: solid;border-color: rgb(229, 229, 229);color: rgb(10, 10, 10);font-size: 14px;font-style: normal;font-variant-ligatures: normal;font-variant-caps: normal;font-weight: 400;letter-spacing: normal;orphans: 2;text-indent: 0px;text-transform: none;widows: 2;word-spacing: 0px;-webkit-text-stroke-width: 0px;white-space: normal;background-color: rgb(255, 255, 255);text-decoration-thickness: initial;text-decoration-style: initial;text-decoration-color: initial;text-align: left;line-height: 1.75;font-family: -apple-system-font, BlinkMacSystemFont, &quot;Helvetica Neue&quot;, &quot;PingFang SC&quot;, &quot;Hiragino Sans GB&quot;, &quot;Microsoft YaHei UI&quot;, &quot;Microsoft YaHei&quot;, Arial, sans-serif;\\\"><p style=\\\"box-sizing:border-box;border-width:0;border-style:solid;border-color:rgb(229,229,229);margin:0 8px 1.5em;text-align:left;line-height:1.75;font-family:-apple-system-font,BlinkMacSystemFont,&quot;Helvetica Neue&quot;,&quot;PingFang SC&quot;,&quot;Hiragino Sans GB&quot;,&quot;Microsoft YaHei UI&quot;,&quot;Microsoft YaHei&quot;,Arial,sans-serif;font-size:14px;letter-spacing:0.1em;color:rgb(63,63,63)\\\"><span><span style=\\\"font-size: 17px;\\\">今天介绍下如何使用免费的 Cloudflare Pages 构建一个静态网站，计算资源是免费的、域名解析是免费的、SSL证书也是免费的，什么都免费。</span></span></p><p style=\\\"box-sizing:border-box;border-width:0;border-style:solid;border-color:rgb(229,229,229);margin:1.5em 8px;text-align:left;line-height:1.75;font-family:-apple-system-font,BlinkMacSystemFont,&quot;Helvetica Neue&quot;,&quot;PingFang SC&quot;,&quot;Hiragino Sans GB&quot;,&quot;Microsoft YaHei UI&quot;,&quot;Microsoft YaHei&quot;,Arial,sans-serif;font-size:14px;letter-spacing:0.1em;color:rgb(63,63,63)\\\"><span><span style=\\\"font-size: 17px;\\\">1：将阿里云域名管理权转移到 Cloudflare DNS</span></span></p><p style=\\\"box-sizing:border-box;border-width:0;border-style:solid;border-color:rgb(229,229,229);margin:1.5em 8px;text-align:left;line-height:1.75;font-family:-apple-system-font,BlinkMacSystemFont,&quot;Helvetica Neue&quot;,&quot;PingFang SC&quot;,&quot;Hiragino Sans GB&quot;,&quot;Microsoft YaHei UI&quot;,&quot;Microsoft YaHei&quot;,Arial,sans-serif;font-size:14px;letter-spacing:0.1em;color:rgb(63,63,63)\\\"><span><span style=\\\"font-size: 17px;\\\">我的域名在阿里云，我将 NS 管理器转移给 Cloudflare DNS，如下图：</span></span></p></div><div style=\\\"text-align: center;\\\"><img src=\\\":/bc76e6643a3943c286fa51aedfb3cb8b\\\" type=\\\"image/png\\\" data-filename=\\\"640.png\\\" style=\\\"--en-marks:%7B%22align%22%3A%22center%22%7D;height: auto !important;\\\"/></div><div style=\\\"box-sizing: border-box;border-width: 0px;border-style: solid;border-color: rgb(229, 229, 229);color: rgb(10, 10, 10);font-size: 14px;font-style: normal;font-variant-ligatures: normal;font-variant-caps: normal;font-weight: 400;letter-spacing: normal;orphans: 2;text-indent: 0px;text-transform: none;widows: 2;word-spacing: 0px;-webkit-text-stroke-width: 0px;white-space: normal;background-color: rgb(255, 255, 255);text-decoration-thickness: initial;text-decoration-style: initial;text-decoration-color: initial;text-align: left;line-height: 1.75;font-family: -apple-system-font, BlinkMacSystemFont, &quot;Helvetica Neue&quot;, &quot;PingFang SC&quot;, &quot;Hiragino Sans GB&quot;, &quot;Microsoft YaHei UI&quot;, &quot;Microsoft YaHei&quot;, Arial, sans-serif;\\\"><p style=\\\"box-sizing:border-box;border-width:0;border-style:solid;border-color:rgb(229,229,229);margin:1.5em 8px;text-align:left;line-height:1.75;font-family:-apple-system-font,BlinkMacSystemFont,&quot;Helvetica Neue&quot;,&quot;PingFang SC&quot;,&quot;Hiragino Sans GB&quot;,&quot;Microsoft YaHei UI&quot;,&quot;Microsoft YaHei&quot;,Arial,sans-serif;font-size:14px;letter-spacing:0.1em;color:rgb(63,63,63)\\\"><span><span style=\\\"font-size: 17px;\\\">域名 ywdblog.com。</span></span></p><p style=\\\"box-sizing:border-box;border-width:0;border-style:solid;border-color:rgb(229,229,229);margin:1.5em 8px;text-align:left;line-height:1.75;font-family:-apple-system-font,BlinkMacSystemFont,&quot;Helvetica Neue&quot;,&quot;PingFang SC&quot;,&quot;Hiragino Sans GB&quot;,&quot;Microsoft YaHei UI&quot;,&quot;Microsoft YaHei&quot;,Arial,sans-serif;font-size:14px;letter-spacing:0.1em;color:rgb(63,63,63)\\\"><span><span style=\\\"font-size: 17px;\\\">2：创建key和token</span></span></p><p style=\\\"box-sizing:border-box;border-width:0;border-style:solid;border-color:rgb(229,229,229);margin:1.5em 8px;text-align:left;line-height:1.75;font-family:-apple-system-font,BlinkMacSystemFont,&quot;Helvetica Neue&quot;,&quot;PingFang SC&quot;,&quot;Hiragino Sans GB&quot;,&quot;Microsoft YaHei UI&quot;,&quot;Microsoft YaHei&quot;,Arial,sans-serif;font-size:14px;letter-spacing:0.1em;color:rgb(63,63,63)\\\"><span><span style=\\\"font-size: 17px;\\\">在 Cloudflare 上创建 key 和 token，路径是左边菜单“管理账户=&gt;账户 API 令牌”，创建的 token 应用范围就是</span><span style=\\\"font-size: 17px;color: rgb(0, 209, 0);\\\"> Cloudflare Workers</span><span style=\\\"font-size: 17px;\\\">（等会解释它），应用的域名是我的域名 ywdblog.com。</span></span></p></div><div style=\\\"text-align: center;\\\"><img src=\\\":/5323db6c4d3d438fbb02064124865759\\\" type=\\\"image/png\\\" data-filename=\\\"640.png\\\" style=\\\"--en-marks:%7B%22align%22%3A%22center%22%7D;height: auto !important;\\\"/></div><div style=\\\"box-sizing: border-box;border-width: 0px;border-style: solid;border-color: rgb(229, 229, 229);color: rgb(10, 10, 10);font-size: 14px;font-style: normal;font-variant-ligatures: normal;font-variant-caps: normal;font-weight: 400;letter-spacing: normal;orphans: 2;text-indent: 0px;text-transform: none;widows: 2;word-spacing: 0px;-webkit-text-stroke-width: 0px;white-space: normal;background-color: rgb(255, 255, 255);text-decoration-thickness: initial;text-decoration-style: initial;text-decoration-color: initial;text-align: left;line-height: 1.75;font-family: -apple-system-font, BlinkMacSystemFont, &quot;Helvetica Neue&quot;, &quot;PingFang SC&quot;, &quot;Hiragino Sans GB&quot;, &quot;Microsoft YaHei UI&quot;, &quot;Microsoft YaHei&quot;, Arial, sans-serif;\\\"><p style=\\\"box-sizing:border-box;border-width:0;border-style:solid;border-color:rgb(229,229,229);margin:1.5em 8px;text-align:left;line-height:1.75;font-family:-apple-system-font,BlinkMacSystemFont,&quot;Helvetica Neue&quot;,&quot;PingFang SC&quot;,&quot;Hiragino Sans GB&quot;,&quot;Microsoft YaHei UI&quot;,&quot;Microsoft YaHei&quot;,Arial,sans-serif;font-size:14px;letter-spacing:0.1em;color:rgb(63,63,63)\\\"><span><span style=\\\"font-size: 17px;\\\">然后拷贝出 token，并设置为环境变量：</span></span></p><pre style=\\\"box-sizing: border-box;border-width: 0px;border-style: solid;border-color: rgb(229, 229, 229);font-family: -apple-system-font, BlinkMacSystemFont, &quot;Helvetica Neue&quot;, &quot;PingFang SC&quot;, &quot;Hiragino Sans GB&quot;, &quot;Microsoft YaHei UI&quot;, &quot;Microsoft YaHei&quot;, Arial, sans-serif;font-feature-settings: normal;font-variation-settings: normal;font-size: 12.6px;margin: 10px 8px;color: rgb(201, 209, 217);background: rgb(13, 17, 23);text-align: left;line-height: 1.5;overflow-x: auto;border-radius: 8px;padding: 0px !important;\\\"><span style=\\\"box-sizing: border-box;border-width: 0px;border-style: solid;border-color: rgb(229, 229, 229);display: flex;padding: 10px 14px 0px;\\\"><span><span></span><span></span><span></span></span></span><div style=\\\"--en-codeblock:true;--en-meta:{&quot;title&quot;:&quot;&quot;,&quot;lang&quot;:&quot;Plain Text&quot;,&quot;theme&quot;:&quot;default&quot;,&quot;showLine&quot;:true,&quot;lineWrap&quot;:true};box-sizing: border-box; padding: 8px; font-family: Monaco, Menlo, Consolas, &quot;Courier New&quot;, monospace; font-size: 12px; color: rgb(51, 51, 51); border-top-left-radius: 4px; border-top-right-radius: 4px; border-bottom-right-radius: 4px; border-bottom-left-radius: 4px; background-color: rgb(251, 250, 248); border: 1px solid rgba(0, 0, 0, 0.14902); background-position: initial initial; background-repeat: initial initial; margin-top: 6px;\\\"><span style=\\\"box-sizing: border-box;border-width: 0px;border-style: solid;border-color: rgb(229, 229, 229);color: rgb(255, 166, 87);\\\"><span><span style=\\\"font-size: 17px;\\\">echo</span></span></span><span><span style=\\\"font-size: 17px;\\\"> </span></span><span style=\\\"box-sizing: border-box;border-width: 0px;border-style: solid;border-color: rgb(229, 229, 229);color: rgb(165, 214, 255);\\\"><span><span style=\\\"font-size: 17px;\\\">'export CLOUDFLARE_ACCOUNT_ID=&quot;&quot;'</span></span></span><span><span style=\\\"font-size: 17px;\\\"> &gt;&gt; ~/.bashrc</span></span><span><br/></span><span style=\\\"box-sizing: border-box;border-width: 0px;border-style: solid;border-color: rgb(229, 229, 229);color: rgb(255, 166, 87);\\\"><span><span style=\\\"font-size: 17px;\\\">echo</span></span></span><span><span style=\\\"font-size: 17px;\\\"> </span></span><span style=\\\"box-sizing: border-box;border-width: 0px;border-style: solid;border-color: rgb(229, 229, 229);color: rgb(165, 214, 255);\\\"><span><span style=\\\"font-size: 17px;\\\">'export CLOUDFLARE_API_TOKEN=&quot;&quot;'</span></span></span><span><span style=\\\"font-size: 17px;\\\"> &gt;&gt; ~/.bashrc</span></span><span><br/></span><span><br/></span><span style=\\\"box-sizing: border-box;border-width: 0px;border-style: solid;border-color: rgb(229, 229, 229);color: rgb(255, 166, 87);\\\"><span><span style=\\\"font-size: 17px;\\\">source</span></span></span><span><span style=\\\"font-size: 17px;\\\"> ~/.bashrc</span></span></div></pre><p style=\\\"box-sizing:border-box;border-width:0;border-style:solid;border-color:rgb(229,229,229);margin:1.5em 8px;text-align:left;line-height:1.75;font-family:-apple-system-font,BlinkMacSystemFont,&quot;Helvetica Neue&quot;,&quot;PingFang SC&quot;,&quot;Hiragino Sans GB&quot;,&quot;Microsoft YaHei UI&quot;,&quot;Microsoft YaHei&quot;,Arial,sans-serif;font-size:14px;letter-spacing:0.1em;color:rgb(63,63,63)\\\"><span><span style=\\\"font-size: 17px;\\\">3：Workers 和 Pages</span></span></p><p style=\\\"box-sizing:border-box;border-width:0;border-style:solid;border-color:rgb(229,229,229);margin:1.5em 8px;text-align:left;line-height:1.75;font-family:-apple-system-font,BlinkMacSystemFont,&quot;Helvetica Neue&quot;,&quot;PingFang SC&quot;,&quot;Hiragino Sans GB&quot;,&quot;Microsoft YaHei UI&quot;,&quot;Microsoft YaHei&quot;,Arial,sans-serif;font-size:14px;letter-spacing:0.1em;color:rgb(63,63,63)\\\"><span><span style=\\\"font-size: 17px;\\\">现在介绍下 Cloudflare Workers 和 Pages，Workers 是 Cloudflare 的 </span><span style=\\\"font-size: 17px;color: rgb(0, 209, 0);\\\">serverless 平台</span><span style=\\\"font-size: 17px;\\\">，不需要管理基础设施，就可以在 Workers 上部署、构建、扩展应用。</span></span></p><p style=\\\"box-sizing:border-box;border-width:0;border-style:solid;border-color:rgb(229,229,229);margin:1.5em 8px;text-align:left;line-height:1.75;font-family:-apple-system-font,BlinkMacSystemFont,&quot;Helvetica Neue&quot;,&quot;PingFang SC&quot;,&quot;Hiragino Sans GB&quot;,&quot;Microsoft YaHei UI&quot;,&quot;Microsoft YaHei&quot;,Arial,sans-serif;font-size:14px;letter-spacing:0.1em;color:rgb(63,63,63)\\\"><span><span style=\\\"font-size: 17px;\\\">而 Cloudflare Pages 是 Cloudflare 的一个全栈托管平台，偏前端一些，可以利用 Workers 的能力开发和部署动态应用。</span></span></p><p style=\\\"box-sizing:border-box;border-width:0;border-style:solid;border-color:rgb(229,229,229);margin:1.5em 8px;text-align:left;line-height:1.75;font-family:-apple-system-font,BlinkMacSystemFont,&quot;Helvetica Neue&quot;,&quot;PingFang SC&quot;,&quot;Hiragino Sans GB&quot;,&quot;Microsoft YaHei UI&quot;,&quot;Microsoft YaHei&quot;,Arial,sans-serif;font-size:14px;letter-spacing:0.1em;color:rgb(63,63,63)\\\"><span><span style=\\\"font-size: 17px;\\\">在本文使用 Cloudflare Wrangler 官方工具部署 Cloudflare Pages 应用，先安装和配置：</span></span></p><pre style=\\\"box-sizing: border-box;border-width: 0px;border-style: solid;border-color: rgb(229, 229, 229);font-family: -apple-system-font, BlinkMacSystemFont, &quot;Helvetica Neue&quot;, &quot;PingFang SC&quot;, &quot;Hiragino Sans GB&quot;, &quot;Microsoft YaHei UI&quot;, &quot;Microsoft YaHei&quot;, Arial, sans-serif;font-feature-settings: normal;font-variation-settings: normal;font-size: 12.6px;margin: 10px 8px;color: rgb(201, 209, 217);background: rgb(13, 17, 23);text-align: left;line-height: 1.5;overflow-x: auto;border-radius: 8px;padding: 0px !important;\\\"><span style=\\\"box-sizing: border-box;border-width: 0px;border-style: solid;border-color: rgb(229, 229, 229);display: flex;padding: 10px 14px 0px;\\\"><span><span></span><span></span><span></span></span></span><div style=\\\"--en-codeblock:true;--en-meta:{&quot;title&quot;:&quot;&quot;,&quot;lang&quot;:&quot;Plain Text&quot;,&quot;theme&quot;:&quot;default&quot;,&quot;showLine&quot;:true,&quot;lineWrap&quot;:true};box-sizing: border-box; padding: 8px; font-family: Monaco, Menlo, Consolas, &quot;Courier New&quot;, monospace; font-size: 12px; color: rgb(51, 51, 51); border-top-left-radius: 4px; border-top-right-radius: 4px; border-bottom-right-radius: 4px; border-bottom-left-radius: 4px; background-color: rgb(251, 250, 248); border: 1px solid rgba(0, 0, 0, 0.14902); background-position: initial initial; background-repeat: initial initial; margin-top: 6px;\\\"><span style=\\\"box-sizing: border-box;border-width: 0px;border-style: solid;border-color: rgb(229, 229, 229);color: rgb(139, 148, 158);\\\"><span><span style=\\\"font-size: 17px;\\\"># 升级 node</span></span></span><span><br/></span><span><span style=\\\"font-size: 17px;\\\">nvm install node</span></span><span><br/></span><span><span style=\\\"font-size: 17px;\\\">nvm use node</span></span><span><br/></span><span><br/></span><span style=\\\"box-sizing: border-box;border-width: 0px;border-style: solid;border-color: rgb(229, 229, 229);color: rgb(139, 148, 158);\\\"><span><span style=\\\"font-size: 17px;\\\"># 安装</span></span></span><span><br/></span><span><span style=\\\"font-size: 17px;\\\">npm install wrangler --save-dev</span></span><span><br/></span><span><br/></span><span style=\\\"box-sizing: border-box;border-width: 0px;border-style: solid;border-color: rgb(229, 229, 229);color: rgb(139, 148, 158);\\\"><span><span style=\\\"font-size: 17px;\\\"># 查看版本</span></span></span><span><br/></span><span><span style=\\\"font-size: 17px;\\\">npx wrangler -v</span></span></div></pre><p style=\\\"box-sizing:border-box;border-width:0;border-style:solid;border-color:rgb(229,229,229);margin:1.5em 8px;text-align:left;line-height:1.75;font-family:-apple-system-font,BlinkMacSystemFont,&quot;Helvetica Neue&quot;,&quot;PingFang SC&quot;,&quot;Hiragino Sans GB&quot;,&quot;Microsoft YaHei UI&quot;,&quot;Microsoft YaHei&quot;,Arial,sans-serif;font-size:14px;letter-spacing:0.1em;color:rgb(63,63,63)\\\"><span><span style=\\\"font-size: 17px;\\\">wrangler 工作的时候会读取环境变量中的 Cloudflare token。</span></span></p><p style=\\\"box-sizing:border-box;border-width:0;border-style:solid;border-color:rgb(229,229,229);margin:1.5em 8px;text-align:left;line-height:1.75;font-family:-apple-system-font,BlinkMacSystemFont,&quot;Helvetica Neue&quot;,&quot;PingFang SC&quot;,&quot;Hiragino Sans GB&quot;,&quot;Microsoft YaHei UI&quot;,&quot;Microsoft YaHei&quot;,Arial,sans-serif;font-size:14px;letter-spacing:0.1em;color:rgb(63,63,63)\\\"><span><span style=\\\"font-size: 17px;\\\">4：构建 Cloudflare Pages</span></span></p><p style=\\\"box-sizing:border-box;border-width:0;border-style:solid;border-color:rgb(229,229,229);margin:1.5em 8px;text-align:left;line-height:1.75;font-family:-apple-system-font,BlinkMacSystemFont,&quot;Helvetica Neue&quot;,&quot;PingFang SC&quot;,&quot;Hiragino Sans GB&quot;,&quot;Microsoft YaHei UI&quot;,&quot;Microsoft YaHei&quot;,Arial,sans-serif;font-size:14px;letter-spacing:0.1em;color:rgb(63,63,63)\\\"><span><span style=\\\"font-size: 17px;\\\">使用 wrangler 创建一个站点，使用 main 线上环境：</span></span></p><pre style=\\\"box-sizing: border-box;border-width: 0px;border-style: solid;border-color: rgb(229, 229, 229);font-family: -apple-system-font, BlinkMacSystemFont, &quot;Helvetica Neue&quot;, &quot;PingFang SC&quot;, &quot;Hiragino Sans GB&quot;, &quot;Microsoft YaHei UI&quot;, &quot;Microsoft YaHei&quot;, Arial, sans-serif;font-feature-settings: normal;font-variation-settings: normal;font-size: 12.6px;margin: 10px 8px;color: rgb(201, 209, 217);background: rgb(13, 17, 23);text-align: left;line-height: 1.5;overflow-x: auto;border-radius: 8px;padding: 0px !important;\\\"><span style=\\\"box-sizing: border-box;border-width: 0px;border-style: solid;border-color: rgb(229, 229, 229);display: flex;padding: 10px 14px 0px;\\\"><span><span></span><span></span><span></span></span></span><div style=\\\"--en-codeblock:true;--en-meta:{&quot;title&quot;:&quot;&quot;,&quot;lang&quot;:&quot;Plain Text&quot;,&quot;theme&quot;:&quot;default&quot;,&quot;showLine&quot;:true,&quot;lineWrap&quot;:true};box-sizing: border-box; padding: 8px; font-family: Monaco, Menlo, Consolas, &quot;Courier New&quot;, monospace; font-size: 12px; color: rgb(51, 51, 51); border-top-left-radius: 4px; border-top-right-radius: 4px; border-bottom-right-radius: 4px; border-bottom-left-radius: 4px; background-color: rgb(251, 250, 248); border: 1px solid rgba(0, 0, 0, 0.14902); background-position: initial initial; background-repeat: initial initial; margin-top: 6px;\\\"><span><span style=\\\"font-size: 17px;\\\">npx wrangler pages project create </span></span><span style=\\\"box-sizing: border-box;border-width: 0px;border-style: solid;border-color: rgb(229, 229, 229);color: rgb(165, 214, 255);\\\"><span><span style=\\\"font-size: 17px;\\\">&quot;my-blog&quot;</span></span></span><span><span style=\\\"font-size: 17px;\\\"> --production-branch=main</span></span></div></pre><p style=\\\"box-sizing:border-box;border-width:0;border-style:solid;border-color:rgb(229,229,229);margin:1.5em 8px;text-align:left;line-height:1.75;font-family:-apple-system-font,BlinkMacSystemFont,&quot;Helvetica Neue&quot;,&quot;PingFang SC&quot;,&quot;Hiragino Sans GB&quot;,&quot;Microsoft YaHei UI&quot;,&quot;Microsoft YaHei&quot;,Arial,sans-serif;font-size:14px;letter-spacing:0.1em;color:rgb(63,63,63)\\\"><span><span style=\\\"font-size: 17px;\\\">构建好以后，就会生成一个内部域名 my-blog-djd.pages.dev。</span></span></p><p style=\\\"box-sizing:border-box;border-width:0;border-style:solid;border-color:rgb(229,229,229);margin:1.5em 8px;text-align:left;line-height:1.75;font-family:-apple-system-font,BlinkMacSystemFont,&quot;Helvetica Neue&quot;,&quot;PingFang SC&quot;,&quot;Hiragino Sans GB&quot;,&quot;Microsoft YaHei UI&quot;,&quot;Microsoft YaHei&quot;,Arial,sans-serif;font-size:14px;letter-spacing:0.1em;color:rgb(63,63,63)\\\"><span><span style=\\\"font-size: 17px;\\\">部署静态文件：</span></span></p><pre style=\\\"box-sizing: border-box;border-width: 0px;border-style: solid;border-color: rgb(229, 229, 229);font-family: -apple-system-font, BlinkMacSystemFont, &quot;Helvetica Neue&quot;, &quot;PingFang SC&quot;, &quot;Hiragino Sans GB&quot;, &quot;Microsoft YaHei UI&quot;, &quot;Microsoft YaHei&quot;, Arial, sans-serif;font-feature-settings: normal;font-variation-settings: normal;font-size: 12.6px;margin: 10px 8px;color: rgb(201, 209, 217);background: rgb(13, 17, 23);text-align: left;line-height: 1.5;overflow-x: auto;border-radius: 8px;padding: 0px !important;\\\"><span style=\\\"box-sizing: border-box;border-width: 0px;border-style: solid;border-color: rgb(229, 229, 229);display: flex;padding: 10px 14px 0px;\\\"><span><span></span><span></span><span></span></span></span><div style=\\\"--en-codeblock:true;--en-meta:{&quot;title&quot;:&quot;&quot;,&quot;lang&quot;:&quot;Plain Text&quot;,&quot;theme&quot;:&quot;default&quot;,&quot;showLine&quot;:true,&quot;lineWrap&quot;:true};box-sizing: border-box; padding: 8px; font-family: Monaco, Menlo, Consolas, &quot;Courier New&quot;, monospace; font-size: 12px; color: rgb(51, 51, 51); border-top-left-radius: 4px; border-top-right-radius: 4px; border-bottom-right-radius: 4px; border-bottom-left-radius: 4px; background-color: rgb(251, 250, 248); border: 1px solid rgba(0, 0, 0, 0.14902); background-position: initial initial; background-repeat: initial initial; margin-top: 6px;\\\"><span><span style=\\\"font-size: 17px;\\\">npx wrangler pages deploy ./dist --project-name=</span></span><span style=\\\"box-sizing: border-box;border-width: 0px;border-style: solid;border-color: rgb(229, 229, 229);color: rgb(165, 214, 255);\\\"><span><span style=\\\"font-size: 17px;\\\">&quot;my-blog&quot;</span></span></span></div></pre><p style=\\\"box-sizing:border-box;border-width:0;border-style:solid;border-color:rgb(229,229,229);margin:1.5em 8px;text-align:left;line-height:1.75;font-family:-apple-system-font,BlinkMacSystemFont,&quot;Helvetica Neue&quot;,&quot;PingFang SC&quot;,&quot;Hiragino Sans GB&quot;,&quot;Microsoft YaHei UI&quot;,&quot;Microsoft YaHei&quot;,Arial,sans-serif;font-size:14px;letter-spacing:0.1em;color:rgb(63,63,63)\\\"><span><span style=\\\"font-size: 17px;\\\">在本文中，dist/index.html 就一个文件，而且是我手动编辑的。</span></span></p><p style=\\\"box-sizing:border-box;border-width:0;border-style:solid;border-color:rgb(229,229,229);margin:1.5em 8px;text-align:left;line-height:1.75;font-family:-apple-system-font,BlinkMacSystemFont,&quot;Helvetica Neue&quot;,&quot;PingFang SC&quot;,&quot;Hiragino Sans GB&quot;,&quot;Microsoft YaHei UI&quot;,&quot;Microsoft YaHei&quot;,Arial,sans-serif;font-size:14px;letter-spacing:0.1em;color:rgb(63,63,63)\\\"><span><span style=\\\"font-size: 17px;\\\">然后去 Workers 和 Pages 控制台看一看，如下图：</span></span></p></div><div style=\\\"text-align: center;\\\"><img src=\\\":/13c5e7218ea8452fb091f9958da4d946\\\" type=\\\"image/png\\\" data-filename=\\\"640.png\\\" style=\\\"--en-marks:%7B%22align%22%3A%22center%22%7D;height: auto !important;\\\"/></div><div style=\\\"box-sizing: border-box;border-width: 0px;border-style: solid;border-color: rgb(229, 229, 229);color: rgb(10, 10, 10);font-size: 14px;font-style: normal;font-variant-ligatures: normal;font-variant-caps: normal;font-weight: 400;letter-spacing: normal;orphans: 2;text-indent: 0px;text-transform: none;widows: 2;word-spacing: 0px;-webkit-text-stroke-width: 0px;white-space: normal;background-color: rgb(255, 255, 255);text-decoration-thickness: initial;text-decoration-style: initial;text-decoration-color: initial;text-align: left;line-height: 1.75;font-family: -apple-system-font, BlinkMacSystemFont, &quot;Helvetica Neue&quot;, &quot;PingFang SC&quot;, &quot;Hiragino Sans GB&quot;, &quot;Microsoft YaHei UI&quot;, &quot;Microsoft YaHei&quot;, Arial, sans-serif;\\\"><p style=\\\"box-sizing:border-box;border-width:0;border-style:solid;border-color:rgb(229,229,229);margin:1.5em 8px;text-align:left;line-height:1.75;font-family:-apple-system-font,BlinkMacSystemFont,&quot;Helvetica Neue&quot;,&quot;PingFang SC&quot;,&quot;Hiragino Sans GB&quot;,&quot;Microsoft YaHei UI&quot;,&quot;Microsoft YaHei&quot;,Arial,sans-serif;font-size:14px;letter-spacing:0.1em;color:rgb(63,63,63)\\\"><span><span style=\\\"font-size: 17px;\\\">域名和部署相关细节都有，你现在使用 https://my-blog-djd.pages.dev 也能访问。</span></span></p><p style=\\\"box-sizing:border-box;border-width:0;border-style:solid;border-color:rgb(229,229,229);margin:1.5em 8px;text-align:left;line-height:1.75;font-family:-apple-system-font,BlinkMacSystemFont,&quot;Helvetica Neue&quot;,&quot;PingFang SC&quot;,&quot;Hiragino Sans GB&quot;,&quot;Microsoft YaHei UI&quot;,&quot;Microsoft YaHei&quot;,Arial,sans-serif;font-size:14px;letter-spacing:0.1em;color:rgb(63,63,63)\\\"><span><span style=\\\"font-size: 17px;\\\">5：自定义域</span></span></p><p style=\\\"box-sizing:border-box;border-width:0;border-style:solid;border-color:rgb(229,229,229);margin:1.5em 8px;text-align:left;line-height:1.75;font-family:-apple-system-font,BlinkMacSystemFont,&quot;Helvetica Neue&quot;,&quot;PingFang SC&quot;,&quot;Hiragino Sans GB&quot;,&quot;Microsoft YaHei UI&quot;,&quot;Microsoft YaHei&quot;,Arial,sans-serif;font-size:14px;letter-spacing:0.1em;color:rgb(63,63,63)\\\"><span><span style=\\\"font-size: 17px;\\\">在Workers 和 Pages 控制台下构建一个自定义域，而且给你自动配置了 SSL 证书，如下图：</span></span></p></div><div style=\\\"text-align: center;\\\"><img src=\\\":/b681a7835dee45f0bae617de08aa9289\\\" type=\\\"image/png\\\" data-filename=\\\"640.png\\\" style=\\\"--en-marks:%7B%22align%22%3A%22center%22%7D;height: auto !important;\\\"/></div><div style=\\\"box-sizing: border-box;border-width: 0px;border-style: solid;border-color: rgb(229, 229, 229);color: rgb(10, 10, 10);font-size: 14px;font-style: normal;font-variant-ligatures: normal;font-variant-caps: normal;font-weight: 400;letter-spacing: normal;orphans: 2;text-indent: 0px;text-transform: none;widows: 2;word-spacing: 0px;-webkit-text-stroke-width: 0px;white-space: normal;background-color: rgb(255, 255, 255);text-decoration-thickness: initial;text-decoration-style: initial;text-decoration-color: initial;text-align: left;line-height: 1.75;font-family: -apple-system-font, BlinkMacSystemFont, &quot;Helvetica Neue&quot;, &quot;PingFang SC&quot;, &quot;Hiragino Sans GB&quot;, &quot;Microsoft YaHei UI&quot;, &quot;Microsoft YaHei&quot;, Arial, sans-serif;\\\"><p style=\\\"box-sizing:border-box;border-width:0;border-style:solid;border-color:rgb(229,229,229);margin:1.5em 8px;text-align:left;line-height:1.75;font-family:-apple-system-font,BlinkMacSystemFont,&quot;Helvetica Neue&quot;,&quot;PingFang SC&quot;,&quot;Hiragino Sans GB&quot;,&quot;Microsoft YaHei UI&quot;,&quot;Microsoft YaHei&quot;,Arial,sans-serif;font-size:14px;letter-spacing:0.1em;color:rgb(63,63,63)\\\"><span><span style=\\\"font-size: 17px;\\\">6：配置域名指向</span></span></p><p style=\\\"box-sizing:border-box;border-width:0;border-style:solid;border-color:rgb(229,229,229);margin:1.5em 8px;text-align:left;line-height:1.75;font-family:-apple-system-font,BlinkMacSystemFont,&quot;Helvetica Neue&quot;,&quot;PingFang SC&quot;,&quot;Hiragino Sans GB&quot;,&quot;Microsoft YaHei UI&quot;,&quot;Microsoft YaHei&quot;,Arial,sans-serif;font-size:14px;letter-spacing:0.1em;color:rgb(63,63,63)\\\"><span><span style=\\\"font-size: 17px;\\\">现在去 Cloudflare DNS 配置域名指向就可以了：</span></span></p></div><div style=\\\"text-align: center;\\\"><img src=\\\":/d29f21025af14befbb5c26576fb8dd9b\\\" type=\\\"image/png\\\" data-filename=\\\"640.png\\\" style=\\\"--en-marks:%7B%22align%22%3A%22center%22%7D;height: auto !important;\\\"/></div><div style=\\\"box-sizing: border-box;border-width: 0px;border-style: solid;border-color: rgb(229, 229, 229);color: rgb(10, 10, 10);font-size: 14px;font-style: normal;font-variant-ligatures: normal;font-variant-caps: normal;font-weight: 400;letter-spacing: normal;orphans: 2;text-indent: 0px;text-transform: none;widows: 2;word-spacing: 0px;-webkit-text-stroke-width: 0px;white-space: normal;background-color: rgb(255, 255, 255);text-decoration-thickness: initial;text-decoration-style: initial;text-decoration-color: initial;text-align: left;line-height: 1.75;font-family: -apple-system-font, BlinkMacSystemFont, &quot;Helvetica Neue&quot;, &quot;PingFang SC&quot;, &quot;Hiragino Sans GB&quot;, &quot;Microsoft YaHei UI&quot;, &quot;Microsoft YaHei&quot;, Arial, sans-serif;\\\"><p style=\\\"box-sizing:border-box;border-width:0;border-style:solid;border-color:rgb(229,229,229);margin:1.5em 8px;text-align:left;line-height:1.75;font-family:-apple-system-font,BlinkMacSystemFont,&quot;Helvetica Neue&quot;,&quot;PingFang SC&quot;,&quot;Hiragino Sans GB&quot;,&quot;Microsoft YaHei UI&quot;,&quot;Microsoft YaHei&quot;,Arial,sans-serif;font-size:14px;letter-spacing:0.1em;color:rgb(63,63,63)\\\"><span><span style=\\\"font-size: 17px;\\\">然后访问 https://me.ywdblog.com 了解我，是不是非常简单，实际上不安装 wrangler 照样可以构建服务。</span></span></p></div><p style=\\\"box-sizing:border-box;border-width:0;border-style:solid;border-color:rgb(229,229,229);margin:0;color:rgb(10,10,10);font-family:ui-sans-serif,system-ui,sans-serif,&quot;Apple Color Emoji&quot;,&quot;Segoe UI Emoji&quot;,&quot;Segoe UI Symbol&quot;,&quot;Noto Color Emoji&quot;;font-style:normal;font-variant-ligatures:normal;font-variant-caps:normal;font-weight:400;letter-spacing:normal;orphans:2;text-align:start;text-indent:0;text-transform:none;widows:2;word-spacing:0;-webkit-text-stroke-width:0;white-space:normal;background-color:rgb(255,255,255);text-decoration-thickness:initial;text-decoration-style:initial;text-decoration-color:initial;font-size:0;line-height:0\\\"><span><br/></span></p></div></div><div><div><div><div style=\\\"display:flex;\\\"><a>阅读原文</a></div></div></div></div></div></div></div></span>\\\n</div></body></html>\\u0000\"]],\"start1\":0,\"start2\":0,\"length1\":0,\"length2\":30254}]"
metadata_diff: {"new":{"id":"84b611ae8ce148ce8d0a8df82d93e9e3","parent_id":"f67288c3a0be4374b5d532b5dcc3aabc","latitude":"0.00000000","longitude":"0.00000000","altitude":"0.0000","author":"","source_url":"","is_todo":0,"todo_due":0,"todo_completed":0,"source":"joplin-desktop","source_application":"net.cozic.joplin-desktop","application_data":"","order":1764348855522,"markup_language":2,"is_shared":0,"share_id":"","conflict_original_id":"","master_key_id":"","user_data":"","deleted_time":0},"deleted":[]}
encryption_cipher_text: 
encryption_applied: 0
updated_time: 2025-11-28T21:04:36.247Z
created_time: 2025-11-28T21:04:36.247Z
type_: 13