代码如下：
/* CONFIGURATION STARTS HERE */
/* Step 1: enter your domain name*/
const MY_DOMAIN = '**zoepi.com**';
/*
* Step 2: enter your URL slug to page ID mapping
* The key on the left is the slug (without the slash)
* The value on the right is the Notion page ID
*/
const SLUG_TO_PAGE = {
'': '**6cfda682659b42a0aa6021f7a2d67b04**',
};
/* Step 3: enter your page title and description for SEO purposes */
const PAGE_TITLE = '**ZoePi.com**';
const PAGE_DESCRIPTION = '**一个在寻找宇宙本源的人类**';
/* Step 4: enter a Google Font name, you can choose from <https://fonts.google.com> */
const GOOGLE_FONT = '**Rubik**'; /*This is part of the theme - change it if you want.*/
/* Step 5: Custom Favicaon - Removes the Notion Logo in the tab and replaces it with the Notion page icon or a link of your choice*/
/*Works only on chrome. Not all links work*/
const PAGE_LOGO = '**<https://img.icons8.com/glyph-neue/64/000000/yin-yang.png**>';
/* Step 6: enter any custom scripts you'd like - E.g. Google Analytics, Tag Manager, Buy me a cofee etc*/
const CUSTOM_SCRIPT = `
`;
/* CONFIGURATION ENDS HERE */
const PAGE_TO_SLUG = {};
const slugs = [];
const pages = [];
Object.keys(SLUG_TO_PAGE).forEach(slug => {
const page = SLUG_TO_PAGE[slug];
slugs.push(slug);
pages.push(page);
PAGE_TO_SLUG[page] = slug;
});
addEventListener('fetch', event => {
event.respondWith(fetchAndApply(event.request));
});
function generateSitemap() {
let sitemap = '<urlset xmlns="<http://www.sitemaps.org/schemas/sitemap/0.9>">';
slugs.forEach(
(slug) =>
(sitemap +=
'<url><loc>https://' + MY_DOMAIN + '/' + slug + '</loc></url>')
);
sitemap += '</urlset>';
return sitemap;
}
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);
url.hostname = 'www.notion.so';
if (url.pathname === '/robots.txt') {
return new Response('Sitemap: https://' + MY_DOMAIN + '/sitemap.xml');
}
if (url.pathname === '/sitemap.xml') {
let response = new Response(generateSitemap());
response.headers.set('content-type', 'application/xml');
return response;
}
let response;
if (url.pathname.startsWith('/app') && url.pathname.endsWith('js')) {
response = await fetch(url.toString());
let body = await response.text();
response = new Response(body.replace(/www.notion.so/g, MY_DOMAIN).replace(/notion.so/g, MY_DOMAIN), response);
response.headers.set('Content-Type', 'application/x-javascript');
return response;
} else if ((url.pathname.startsWith('/api'))) {
// Forward API
response = await fetch(url.toString(), {
body: url.pathname.startsWith('/api/v3/getPublicPageData') ? null : request.body,
headers: {
'content-type': 'application/json;charset=UTF-8',
'user-agent': 'Mozilla/5.0 (Macintosh; Intel Mac OS X 10_12_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/80.0.3987.163 Safari/537.36'
},
method: 'POST',
});
response = new Response(response.body, response);
response.headers.set('Access-Control-Allow-Origin', '*');
return response;
} else if (slugs.indexOf(url.pathname.slice(1)) > -1) {
const pageId = SLUG_TO_PAGE[url.pathname.slice(1)];
return Response.redirect('https://' + MY_DOMAIN + '/' + pageId, 301);
} else {
response = await fetch(url.toString(), {
body: request.body,
headers: request.headers,
method: request.method,
});
response = new Response(response.body, response);
response.headers.delete('Content-Security-Policy');
response.headers.delete('X-Content-Security-Policy');
}
return appendJavascript(response, SLUG_TO_PAGE);
}
class MetaRewriter {
element(element) {
if (PAGE_TITLE !== '') {
if (element.getAttribute('property') === 'og:title'
|| element.getAttribute('name') === 'twitter:title') {
element.setAttribute('content', PAGE_TITLE);
}
if (element.tagName === 'title') {
element.setInnerContent(PAGE_TITLE);
}
}
if (element.getAttribute('property') === 'og:image'
|| element.getAttribute('name') === 'twitter:image') {
element.setAttribute('content', PAGE_LOGO);}
if (PAGE_DESCRIPTION !== '') {
if (element.getAttribute('name') === 'description'
|| element.getAttribute('property') === 'og:description'
|| element.getAttribute('name') === 'twitter:description') {
element.setAttribute('content', PAGE_DESCRIPTION);
}
}
if (element.getAttribute('property') === 'og:url'
|| element.getAttribute('name') === 'twitter:url') {
element.setAttribute('content', MY_DOMAIN);
}
if (element.getAttribute('name') === 'apple-itunes-app') {
element.remove();
}
}
}
class HeadRewriter {
element(element) {
if (GOOGLE_FONT !== '') {
element.append(`<link href="<https://fonts.googleapis.com/css?family=$>{GOOGLE_FONT.replace(' ', '+')}:Regular,Bold,Italic&display=swap" rel="stylesheet">
<style>* { font-family: "${GOOGLE_FONT}" !important; }</style>`, {
html: true
});
}
element.append(`<style>
/*Top Bar*/
div.notion-topbar > div > div:nth-child(5) { display: none !important; }
div.notion-topbar-mobile > div:nth-child(5) { display: none !important; }
div.notion-topbar > div > div:nth-child(6) { display: none !important; }
div.notion-topbar-mobile > div > div:nth-child(6) { display: none !important; }
div.notion-topbar > div > div:nth-child(4) { display: none !important; }
div.notion-topbar-mobile > div:nth-child(4) { display: none !important; }
/*Adjusted Colors*/
root {
--color-text-default: rgba(10, 36, 64, 1)!important !important;
--color-bg-gray-light: rgba(10, 36, 64, 1)!important !important;
--color-bg-brown-light: rgba(233,229,227,0.75)!important !important;
--color-bg-orange-light: rgba(250,235,221,0.75)!important !important;
--color-bg-yellow-light: rgba(251,243,219,0.75)!important !important;
--color-bg-green-light: rgba(221,237,234,0.75)!important !important;
--color-bg-blue-light: rgba(221,235,241,0.75)!important !important;
--color-bg-purple-light: rgba(234,228,242,0.75)!important !important;
--color-bg-pink-light: rgba(244,223,235,0.75)!important !important;
--color-bg-red-light: rgba(251,228,228,0.75)!important !important;
--color-pill-default: rgba(206,205,202,0.75)!important !important;
}
/*Inline & Linked Databases*/
div.notion-selectable.notion-collection_view-block > div > div.notion-selectable.notion-collection_view-block > div > div {
display: none !important; }
div.notion-selectable.notion-collection_view-block > div > div.notion-selectable.notion-collection_view-block > div > div > div:nth-child(1) {
display: none !important; }
div.notion-selectable.notion-collection_view-block > div > a > div {
display: none !important; }
div.notion-selectable.notion-collection_view-block > div > div.notion-selectable.notion-collection_view-block > div > div:nth-child(1) {
display: none !important; }
div.notion-selectable.notion-collection_view-block > div > div.notion-selectable.notion-collection_view-block > div > div > a {
display: none !important; }
div.notion-selectable.notion-collection_view-block > div > div.notion-selectable.notion-collection_view-block > div > div > div > a {
display: none !important; }
div.notion-selectable.notion-collection_view-block > div > div.notion-selectable.notion-collection_view-block > div > div > div:nth-child(3) {
display: none !important; }
div.notion-selectable.notion-collection_view-block > div > div > div > div > svg.dots {
display: none !important; }
div.notion-selectable.notion-collection_view-block > div > div {
border-top: none !important; }
/* Beautify Inline & Linked Database*/
div.notion-selectable.notion-collection_view-block > div {
min-height: 30px !important; }
div.notion-selectable.notion-collection_view-block > div > div.notion-selectable.notion-collection_view-block > div {
min-height: 30px !important; }
div.notion-selectable.notion-collection_view-block > div > div > div.notion-selectable.notion-page-block.notion-collection-item > a {
box-shadow: 0 10px 40px -10px rgb(0 0 0 / 12%) !important; /*Shadow */
border-radius: 10px !important; /*Round Corners Callouts*/
margin-bottom: 12px !important;
height: 95% !important;
}
div.notion-selectable.notion-collection_view-block > div > div > div.notion-selectable.notion-page-block.notion-collection-item {
margin: 10px 10px 10px 10px !important;
}
div.notion-selectable.notion-collection_view-block > div > div > div.notion-selectable.notion-page-block.notion-collection-item > a:hover {
transform: scale(0.99,0.99);
box-shadow: 0 10px 40px -10px rgb(0 0 0 / 12%) !important; /*Shadow */
-webkit-transition: .2s ease-in-out!important;
}
/*Inline Database Table*/
div.notion-selectable.notion-collection_view-block > div {
border-top: none !important;
}
/* Full Page Databases*/
div.notion-selectable.notion-collection_view_page-block > div > div > div.notion-focusable {
box-shadow: 0 10px 40px -10px rgb(0 0 0 / 12%) !important; /*Shadow */
border-radius: 8px !important; /*Round Corners Callouts*/
padding-bottom: 20px !important;
padding-top: 20px !important;
padding-left: 20px !important;
padding-right: 20px !important;
margin-right: 10px !important;
height: 0px !important;
color: black !important;
font-weight: 600 !important;
}
div.notion-selectable.notion-collection_view_page-block > div > div > div.notion-focusable > svg.collectionSearch {
fill: black !important;
}
div.notion-selectable.notion-collection_view_page-block > div > div > div.notion-focusable:hover {
transform: translateY(-3px);
box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
}
div.notion-selectable.notion-collection_view_page-block > div > div.notion-collection-view-select.notion-focusable {
box-shadow: 0 10px 40px -10px rgb(0 0 0 / 12%) !important;
border-radius: 16px !important;
padding-bottom: 20px !important;
padding-top: 20px !important;
margin-top: 10px !important;
margin-left: 10px !important;
height: 0px !important;
}
div.notion-overlay-container.notion-default-overlay-container > div > div > div > div > div > div > div {
box-shadow: 0 10px 40px -10px rgb(0 0 0 / 12%) !important;
margin-top: 15px !important;
}
div.notion-selectable.notion-collection_view_page-block > div > div.notion-collection-view-select.notion-focusable:hover {
transform: translateY(-3px);
box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
}
/* Gallary - Full Page Database*/
div.notion-selectable.notion-collection_view_page-block > div > div {
border-top: none !important;
}
div.notion-scroller.vertical.horizontal > div > div.notion-selectable.notion-collection_view_page-block {
margin-top: 20px !important;
margin-bottom: 30px !important;
}
div.notion-selectable.notion-collection_view_page-block > div > div > div.notion-selectable.notion-page-block.notion-collection-item > a {
box-shadow: 0 10px 40px -10px rgb(0 0 0 / 12%) !important; /*Shadow */
border-radius: 10px !important;
margin-bottom: 12px !important;
height: 95% !important;
}
div.notion-selectable.notion-collection_view_page-block > div > div > div.notion-selectable.notion-page-block.notion-collection-item {
margin: 10px 10px 10px 10px !important;
}
div.notion-selectable.notion-collection_view_page-block > div > div > div.notion-selectable.notion-page-block.notion-collection-item > a:hover {
transform: scale(0.99,0.99);
box-shadow: 0 10px 40px -10px rgb(0 0 0 / 12%) !important; /*Shadow */
-webkit-transition: .2s ease-in-out!important;
}
div.notion-table-view > div.notion-selectable.notion-collection_view_page-block > div.pseudoSelection {
box-shadow: none !important;
clip-path: none !important;
margin-top: 15px !important;
}
div.notion-selectable.notion-collection_view_page-block > div {
border-top: none !important;
}
div.notion-table-view > div.notion-selectable.notion-collection_view_page-block {
margin-top: 40px !important;
margin-bottom: 20px !important;
}
div.notion-selectable.notion-collection_view_page-block > div > div > div > div > div.notion-selectable.notion-page-block.notion-collection-item > a{
box-shadow: 0 10px 40px -10px rgb(0 0 0 / 12%) !important; /*Shadow */
border-radius: 10px !important; /*Round Corners */
margin: 12px 12px 12px 12px !important;
}
div.notion-selectable.notion-collection_view_page-block > div > div > div > div > div.notion-selectable.notion-page-block.notion-collection-item > a:hover {
transform: scale(0.99,0.99);
box-shadow: 0 10px 40px -10px rgb(0 0 0 / 12%) !important; /*Shadow */
-webkit-transition: .2s ease-in-out!important;
}
div.notion-selectable.notion-collection_view-block > div > div > div > div > div.notion-selectable.notion-page-block.notion-collection-item > a{
box-shadow: 0 10px 40px -10px rgb(0 0 0 / 12%) !important; /*Shadow */
border-radius: 10px !important; /*Round Corners */
margin: 12px 12px 12px 12px !important;
}
div.notion-selectable.notion-collection_view-block > div > div > div > div > div.notion-selectable.notion-page-block.notion-collection-item > a:hover {
transform: scale(0.99,0.99);
box-shadow: 0 10px 40px -10px rgb(0 0 0 / 12%) !important; /*Shadow */
-webkit-transition: .2s ease-in-out!important;
}
/* Callout Blocks*/
/*Align Callout Icon & Headline with content*/
div.notion-selectable.notion-callout-block > div > div > div:nth-child(2) > div:nth-child(1) {
padding-left: 35px !important;
}
div.notion-selectable.notion-callout-block > div > div > div > div.notion-record-icon.notranslate.notion-focusable > div > div > img {
margin-left: 30px !important;
}
div.notion-selectable.notion-callout-block > div > div > div > div.notion-record-icon.notranslate > div > div > img {
margin-left: 30px !important;
}
div.notion-selectable.notion-callout-block > div > div > div > div.notion-record-icon.notranslate.notion-focusable > div > div > span {
margin-left: 15px !important;
}
div.notion-selectable.notion-callout-block > div > div > div > div.notion-record-icon.notranslate > div > div > span {
margin-left: 15px !important;
}
/* Callout Content*/
div.notion-selectable.notion-callout-block > div > div > div {
margin-left: -10px !important;
}
div.notion-selectable.notion-callout-block > div > div {
padding: 15px 20px 15px 20px !important;
}
div.notion-selectable.notion-callout-block > div > div > div > div.notion-selectable.notion-text-block {
margin-bottom: 5px !important;
}
div.notion-selectable.notion-callout-block > div > div > div > div.notion-selectable.notion-callout-block{
margin-top: 12px !important;
margin-bottom: 12px !important;
}
div.notion-selectable.notion-callout-block > div > div > div > div.notion-selectable.notion-header-block {
margin-top: 0px!important;
margin-bottom: 0px !important;
}
/*Callout Styling*/
div.notion-selectable.notion-callout-block {
box-shadow: 0 10px 40px -10px rgb(0 0 0 / 12%) !important; /*Shadow */
border-radius: 8px !important; /*Round Corners Callouts (both needed)*/
margin: 15px 0px 15px 0px !important; /*Margin Main Callouts*/
}
div.notion-selectable.notion-callout-block > div > div {
border-radius: 8px !important; /*Round Corners Callouts (both needed)*/
}
.notion-callout-block > div > div {
position: relative !important;
-webkit-transition: .3s ease-in-out!important;
padding: 30px 40px 30px 15px !important;
}
div.notion-selectable.notion-callout-block:hover {
transform: translateY(-3px);
box-shadow: 0 10px 20px inherit;
}
/*Custom Toggle Styles*/
div.notion-selectable.notion-toggle-block {
box-shadow: 0 10px 40px -10px rgb(0 0 0 / 12%) !important; /*Shadow */
border-radius: 5px !important; /*Round Corners */
margin: 0 auto 20px!important;
position: relative!important;
width: 100%!important;
-webkit-user-select: none!important;
margin-top: 25px!important;
margin-bottom: -0.5px!important;
padding-left: 15px; /*Arrow Padding*/
padding-right: 10px !important; /*Content right*/
}
div.notion-selectable.notion-toggle-block > div {
padding: 13px 13px 13px 13px; /*Content Padding*/
border-radius: 5px !important; /*Round Corners */
list-style: none;
display: -webkit-flex;
display: flex;
-webkit-align-items: flex-start;
align-items: flex-start;
}
div.notion-selectable.notion-toggle-block:hover {
transform: translateY(-3px);
box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
}
</style>`, {
html: true
})
}
}
class BodyRewriter {
constructor(SLUG_TO_PAGE) {
this.SLUG_TO_PAGE = SLUG_TO_PAGE;
}
element(element) {
element.append(`<div style="display:none">Powered by <a href="<http://fruitionsite.com>">Fruition</a></div>
<script>
window.CONFIG.domainBaseUrl = '<https://$>{MY_DOMAIN}';
const SLUG_TO_PAGE = ${JSON.stringify(this.SLUG_TO_PAGE)};
const PAGE_TO_SLUG = {};
const slugs = [];
const pages = [];
const el = document.createElement('div');
let redirected = false;
Object.keys(SLUG_TO_PAGE).forEach(slug => {
const page = SLUG_TO_PAGE[slug];
slugs.push(slug);
pages.push(page);
PAGE_TO_SLUG[page] = slug;
});
function getPage() {
return location.pathname.slice(-32);
}
function getSlug() {
return location.pathname.slice(1);
}
function updateSlug() {
const slug = PAGE_TO_SLUG[getPage()];
if (slug != null) {
history.replaceState(history.state, '', '/' + slug);
}
}
function onDark() {
el.innerHTML = '<div title="Change to Light Mode" style="margin-left: auto; margin-right: 14px; min-width: 0px;"><div role="button" tabindex="0" style="user-select: none; transition: background 120ms ease-in 0s; cursor: pointer; border-radius: 44px;"><div style="display: flex; flex-shrink: 0; height: 14px; width: 26px; border-radius: 44px; padding: 2px; box-sizing: content-box; background: rgb(46, 170, 220); transition: background 200ms ease 0s, box-shadow 200ms ease 0s;"><div style="width: 14px; height: 14px; border-radius: 44px; background: white; transition: transform 200ms ease-out 0s, background 200ms ease-out 0s; transform: translateX(12px) translateY(0px);"></div></div></div></div>';
document.body.classList.add('dark');
__console.environment.ThemeStore.setState({ mode: 'dark' });
};
function onLight() {
el.innerHTML = '<div title="Change to Dark Mode" style="margin-left: auto; margin-right: 14px; min-width: 0px;"><div role="button" tabindex="0" style="user-select: none; transition: background 120ms ease-in 0s; cursor: pointer; border-radius: 44px;"><div style="display: flex; flex-shrink: 0; height: 14px; width: 26px; border-radius: 44px; padding: 2px; box-sizing: content-box; background: rgba(135, 131, 120, 0.3); transition: background 200ms ease 0s, box-shadow 200ms ease 0s;"><div style="width: 14px; height: 14px; border-radius: 44px; background: white; transition: transform 200ms ease-out 0s, background 200ms ease-out 0s; transform: translateX(0px) translateY(0px);"></div></div></div></div>';
document.body.classList.remove('dark');
__console.environment.ThemeStore.setState({ mode: 'light' });
}
function toggle() {
if (document.body.classList.contains('dark')) {
onLight();
} else {
onDark();
}
}
function addDarkModeButton(device) {
const nav = device === 'web' ? document.querySelector('.notion-topbar').firstChild : document.querySelector('.notion-topbar-mobile');
el.className = 'toggle-mode';
el.addEventListener('click', toggle);
nav.appendChild(el);
onLight();
}
const observer = new MutationObserver(function() {
if (redirected) return;
const nav = document.querySelector('.notion-topbar');
const mobileNav = document.querySelector('.notion-topbar-mobile');
if (nav && nav.firstChild && nav.firstChild.firstChild
|| mobileNav && mobileNav.firstChild) {
redirected = true;
updateSlug();
addDarkModeButton(nav ? 'web' : 'mobile');
const onpopstate = window.onpopstate;
window.onpopstate = function() {
if (slugs.includes(getSlug())) {
const page = SLUG_TO_PAGE[getSlug()];
if (page) {
history.replaceState(history.state, 'bypass', '/' + page);
}
}
onpopstate.apply(this, [].slice.call(arguments));
updateSlug();
};
}
});
observer.observe(document.querySelector('#notion-app'), {
childList: true,
subtree: true,
});
const replaceState = window.history.replaceState;
window.history.replaceState = function(state) {
if (arguments[1] !== 'bypass' && slugs.includes(getSlug())) return;
return replaceState.apply(window.history, arguments);
};
const pushState = window.history.pushState;
window.history.pushState = function(state) {
const dest = new URL(location.protocol + location.host + arguments[2]);
const id = dest.pathname.slice(-32);
if (pages.includes(id)) {
arguments[2] = '/' + PAGE_TO_SLUG[id];
}
return pushState.apply(window.history, arguments);
};
const open = window.XMLHttpRequest.prototype.open;
window.XMLHttpRequest.prototype.open = function() {
arguments[1] = arguments[1].replace('${MY_DOMAIN}', 'www.notion.so');
return open.apply(this, [].slice.call(arguments));
};
</script>${CUSTOM_SCRIPT}`, {
html: true
});
}
}
async function appendJavascript(res, SLUG_TO_PAGE) {
return new HTMLRewriter()
.on('title', new MetaRewriter())
.on('meta', new MetaRewriter())
.on('head', new HeadRewriter())
.on('body', new BodyRewriter(SLUG_TO_PAGE))
.transform(res);
}