可以實現什么:
- 用自己的域名來訪問特定的notion頁
- 將notion打造成個人博客, 便可實現目前最簡單的博客網站搭建
- 還可以將notion作為自己的圖床, 隨便存文件照片!
為Notion公共頁面提供自定義域名可能是最受要求的功能之一，而且目前看起來還不支持這樣做（可以理解）但是，這里有一個使用Cloudflare Workers的解決方案。
第一步: 將你的域名服務器代理至Cloudflare
Cloudflare需要控制您的DNS桌粉，因此請按照本指南將名稱服務器切換到它們睁本。不用擔心锣杂，您的DNS設置將保持不變渐溶。
Changing your domain nameservers to Cloudflare
這一步很重要,大致可以理解為以下步驟:
-
將你原來的nameservers更改為Cloudflare提供給你的nameserver
image -
比如我的域名是在阿里云的, 進行如下操作即可(修改后需要過一段時間等Cloudflare發(fā)郵箱給你)
imageimage -
在域名解析里添加一條A的記錄,IP隨便填
image -
當收到郵件后,你的Cloudflare的Overview頁會變成這樣,就說明更改nameservers成功了
image -
在Cloudflare的DNS頁里也添加一條A的記錄,IP隨便填但是要保證Proxy Status是通的
image
第二步: 添加工程腳本
Big thanks to Mayne for writing this worker script. You can find the original in this gist.
以下是為你代理域的代碼，因此請執(zhí)行以下操作：
Click on the ”Workers” tab
Click “Launch Editor”
On the left, click ”Add Script”
-
Name it
notion-workerimageOnce you have followed those steps, copy this script into that new file.
const MY_DOMAIN = "example.com"
const START_PAGE = "https://www.notion.so/link/to/your/public/page"
addEventListener('fetch', event => {
event.respondWith(fetchAndApply(event.request))
})
const corsHeaders = {
"Access-Control-Allow-Origin": "*",
"Access-Control-Allow-Methods": "GET, HEAD, POST,PUT, OPTIONS",
"Access-Control-Allow-Headers": "Content-Type",
}
function handleOptions(request) {
if (request.headers.get("Origin") !== null &&
request.headers.get("Access-Control-Request-Method") !== null &&
request.headers.get("Access-Control-Request-Headers") !== null) {
// Handle CORS pre-flight request.
return new Response(null, {
headers: corsHeaders
})
} else {
// Handle standard OPTIONS request.
return new Response(null, {
headers: {
"Allow": "GET, HEAD, POST, PUT, OPTIONS",
}
})
}
}
async function fetchAndApply(request) {
if (request.method === "OPTIONS") {
return handleOptions(request)
}
let url = new URL(request.url)
let response
if (url.pathname.startsWith("/app") && url.pathname.endsWith("js")) {
response = await fetch(`https://www.notion.so${url.pathname}`)
let body = await response.text()
try {
response = new Response(body.replace(/www.notion.so/g, MY_DOMAIN).replace(/notion.so/g, MY_DOMAIN), response)
// response = new Response(response.body, response)
response.headers.set('Content-Type', "application/x-javascript")
console.log("get rewrite app.js")
} catch (err) {
console.log(err)
}
} else if ((url.pathname.startsWith("/api"))) {
response = await fetch(`https://www.notion.so${url.pathname}`, {
body: request.body, // must match 'Content-Type' header
headers: {
'content-type': 'application/json;charset=UTF-8',
'user-agent': 'Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/73.0.3683.103 Safari/537.36'
},
method: "POST", // *GET, POST, PUT, DELETE, etc.
})
response = new Response(response.body, response)
response.headers.set('Access-Control-Allow-Origin', "*")
} else if (url.pathname === `/`) {
let pageUrlList = START_PAGE.split("/")
let redrictUrl = `https://${MY_DOMAIN}/${pageUrlList[pageUrlList.length-1]}`
return Response.redirect(redrictUrl, 301)
} else {
response = await fetch(`https://www.notion.so${url.pathname}`, {
body: request.body, // must match 'Content-Type' header
headers: request.headers,
method: request.method, // *GET, POST, PUT, DELETE, etc.
})
}
return response
}
現在饭寺，你已經添加了腳本，您需要更改頂部的兩個const：
MY_DOMAIN表示你需要代理的域名-你自己的域名 ( E.G. example.com)START_PAGE表示你代理的目標域名地址-notion的地址(E.G.https://www.notion.so/link/to/your/public/page)
保存你的腳本,然后返回上一層
第三步: 添加一個通配符路徑才處理你的所有流量
在這里添加你的域名和通配符,然后在你Worker這一欄選擇你剛剛配置的腳本名就可以了
??最后這里有我的示例tomatoro.space
到這里為止就大功告成了! 這時候你訪問你自己的域名就可以看到notion的頁面啦, 以后用notion寫博客也可以使用自己的域名了, 可謂是相當酷炫了!
