mirror of
https://github.com/violettoolssite/CFspider.git
synced 2026-04-05 19:39:01 +08:00
add edgetunnel info to pages
This commit is contained in:
test01
596
pages/index.html
Normal file
596
pages/index.html
Normal file
@@ -0,0 +1,596 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="zh-CN">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<title>CFspider - Cloudflare Proxy Network</title>
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Orbitron:wght@400;700;900&family=JetBrains+Mono:wght@400;500&family=Noto+Sans+SC:wght@400;500;700&display=swap" rel="stylesheet">
|
||||||
|
<style>
|
||||||
|
:root {
|
||||||
|
--neon-cyan: #00f5ff;
|
||||||
|
--neon-magenta: #ff2d95;
|
||||||
|
--neon-yellow: #f7f71c;
|
||||||
|
--neon-green: #50fa7b;
|
||||||
|
--neon-purple: #bd93f9;
|
||||||
|
--dark-bg: #0a0a0f;
|
||||||
|
--card-bg: rgba(20, 20, 30, 0.8);
|
||||||
|
--code-bg: #1a1a2e;
|
||||||
|
}
|
||||||
|
* { margin: 0; padding: 0; box-sizing: border-box; }
|
||||||
|
html { scroll-behavior: smooth; }
|
||||||
|
body {
|
||||||
|
font-family: 'Noto Sans SC', 'JetBrains Mono', sans-serif;
|
||||||
|
background: var(--dark-bg);
|
||||||
|
color: #fff;
|
||||||
|
min-height: 100vh;
|
||||||
|
overflow-x: hidden;
|
||||||
|
}
|
||||||
|
.bg-animation {
|
||||||
|
position: fixed;
|
||||||
|
top: 0; left: 0;
|
||||||
|
width: 100%; height: 100%;
|
||||||
|
z-index: -1;
|
||||||
|
background:
|
||||||
|
radial-gradient(ellipse at 20% 80%, rgba(0, 245, 255, 0.1) 0%, transparent 50%),
|
||||||
|
radial-gradient(ellipse at 80% 20%, rgba(255, 45, 149, 0.1) 0%, transparent 50%);
|
||||||
|
}
|
||||||
|
.grid-overlay {
|
||||||
|
position: fixed;
|
||||||
|
top: 0; left: 0;
|
||||||
|
width: 100%; height: 100%;
|
||||||
|
z-index: -1;
|
||||||
|
background-image:
|
||||||
|
linear-gradient(rgba(0, 245, 255, 0.02) 1px, transparent 1px),
|
||||||
|
linear-gradient(90deg, rgba(0, 245, 255, 0.02) 1px, transparent 1px);
|
||||||
|
background-size: 60px 60px;
|
||||||
|
}
|
||||||
|
nav {
|
||||||
|
position: fixed;
|
||||||
|
top: 0; width: 100%;
|
||||||
|
padding: 20px 50px;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
z-index: 1000;
|
||||||
|
backdrop-filter: blur(10px);
|
||||||
|
background: rgba(10, 10, 15, 0.9);
|
||||||
|
border-bottom: 1px solid rgba(0, 245, 255, 0.2);
|
||||||
|
}
|
||||||
|
.nav-logo {
|
||||||
|
font-family: 'Orbitron', sans-serif;
|
||||||
|
font-size: 1.8rem;
|
||||||
|
font-weight: 900;
|
||||||
|
background: linear-gradient(135deg, var(--neon-cyan), var(--neon-magenta));
|
||||||
|
-webkit-background-clip: text;
|
||||||
|
-webkit-text-fill-color: transparent;
|
||||||
|
}
|
||||||
|
.nav-links { display: flex; gap: 40px; list-style: none; }
|
||||||
|
.nav-links a { color: #aaa; text-decoration: none; font-size: 0.95rem; transition: all 0.3s; }
|
||||||
|
.nav-links a:hover { color: var(--neon-cyan); text-shadow: 0 0 20px var(--neon-cyan); }
|
||||||
|
.hero {
|
||||||
|
min-height: 60vh;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
text-align: center;
|
||||||
|
padding: 140px 20px 60px;
|
||||||
|
}
|
||||||
|
.hero-badge {
|
||||||
|
display: inline-block;
|
||||||
|
padding: 8px 20px;
|
||||||
|
background: rgba(0, 245, 255, 0.1);
|
||||||
|
border: 1px solid var(--neon-cyan);
|
||||||
|
border-radius: 50px;
|
||||||
|
font-size: 0.85rem;
|
||||||
|
color: var(--neon-cyan);
|
||||||
|
margin-bottom: 30px;
|
||||||
|
}
|
||||||
|
.hero h1 {
|
||||||
|
font-family: 'Orbitron', sans-serif;
|
||||||
|
font-size: 5rem;
|
||||||
|
font-weight: 900;
|
||||||
|
margin-bottom: 20px;
|
||||||
|
background: linear-gradient(180deg, #fff 0%, var(--neon-cyan) 100%);
|
||||||
|
-webkit-background-clip: text;
|
||||||
|
-webkit-text-fill-color: transparent;
|
||||||
|
}
|
||||||
|
.hero p { font-size: 1.3rem; color: #888; max-width: 700px; line-height: 1.8; }
|
||||||
|
.hero-buttons { display: flex; gap: 20px; margin-top: 40px; flex-wrap: wrap; justify-content: center; }
|
||||||
|
.btn {
|
||||||
|
padding: 14px 32px;
|
||||||
|
font-size: 1rem;
|
||||||
|
text-decoration: none;
|
||||||
|
border-radius: 8px;
|
||||||
|
transition: all 0.3s;
|
||||||
|
}
|
||||||
|
.btn-primary {
|
||||||
|
background: linear-gradient(135deg, var(--neon-cyan), #0099ff);
|
||||||
|
color: #000;
|
||||||
|
box-shadow: 0 0 30px rgba(0, 245, 255, 0.4);
|
||||||
|
}
|
||||||
|
.btn-primary:hover { transform: translateY(-3px); box-shadow: 0 0 50px rgba(0, 245, 255, 0.6); }
|
||||||
|
.btn-secondary { background: transparent; color: #fff; border: 1px solid rgba(255, 255, 255, 0.3); }
|
||||||
|
.btn-secondary:hover { border-color: var(--neon-magenta); color: var(--neon-magenta); }
|
||||||
|
section { padding: 80px 50px; max-width: 1200px; margin: 0 auto; }
|
||||||
|
.section-title { text-align: center; margin-bottom: 50px; }
|
||||||
|
.section-title h2 { font-family: 'Orbitron', sans-serif; font-size: 2.2rem; color: #fff; margin-bottom: 10px; }
|
||||||
|
.section-title p { color: #666; font-size: 1rem; }
|
||||||
|
.features-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 25px; margin-bottom: 60px; }
|
||||||
|
.feature-card {
|
||||||
|
background: var(--card-bg);
|
||||||
|
border: 1px solid rgba(255, 255, 255, 0.05);
|
||||||
|
border-radius: 16px;
|
||||||
|
padding: 35px 30px;
|
||||||
|
transition: all 0.3s;
|
||||||
|
}
|
||||||
|
.feature-card:hover { transform: translateY(-5px); border-color: rgba(0, 245, 255, 0.3); box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3); }
|
||||||
|
.feature-card h3 { font-size: 1.2rem; margin-bottom: 12px; color: var(--neon-cyan); }
|
||||||
|
.feature-card p { color: #888; line-height: 1.7; font-size: 0.95rem; }
|
||||||
|
.api-table-container {
|
||||||
|
background: var(--card-bg);
|
||||||
|
border: 1px solid rgba(0, 245, 255, 0.2);
|
||||||
|
border-radius: 12px;
|
||||||
|
overflow: hidden;
|
||||||
|
margin-bottom: 40px;
|
||||||
|
}
|
||||||
|
.api-table { width: 100%; border-collapse: collapse; }
|
||||||
|
.api-table th {
|
||||||
|
background: rgba(0, 245, 255, 0.1);
|
||||||
|
padding: 18px 20px;
|
||||||
|
text-align: left;
|
||||||
|
font-size: 0.85rem;
|
||||||
|
color: var(--neon-cyan);
|
||||||
|
text-transform: uppercase;
|
||||||
|
}
|
||||||
|
.api-table td { padding: 18px 20px; border-bottom: 1px solid rgba(255, 255, 255, 0.05); font-size: 0.95rem; }
|
||||||
|
.api-table tr:last-child td { border-bottom: none; }
|
||||||
|
.api-table tr:hover { background: rgba(0, 245, 255, 0.03); }
|
||||||
|
.api-method { display: inline-block; padding: 4px 12px; background: var(--neon-cyan); color: #000; font-size: 0.75rem; font-weight: bold; border-radius: 4px; }
|
||||||
|
.api-path { font-family: 'JetBrains Mono', monospace; color: var(--neon-yellow); }
|
||||||
|
.api-desc { color: #888; }
|
||||||
|
.code-container {
|
||||||
|
background: var(--code-bg);
|
||||||
|
border: 2px solid var(--neon-magenta);
|
||||||
|
border-radius: 12px;
|
||||||
|
overflow: hidden;
|
||||||
|
box-shadow: 0 0 30px rgba(255, 45, 149, 0.2);
|
||||||
|
margin-bottom: 40px;
|
||||||
|
}
|
||||||
|
.code-header {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
padding: 15px 20px;
|
||||||
|
background: rgba(255, 45, 149, 0.1);
|
||||||
|
border-bottom: 1px solid rgba(255, 45, 149, 0.3);
|
||||||
|
}
|
||||||
|
.code-header-left { display: flex; align-items: center; gap: 15px; }
|
||||||
|
.code-dots { display: flex; gap: 6px; }
|
||||||
|
.code-dots span { width: 12px; height: 12px; border-radius: 50%; }
|
||||||
|
.code-dots span:nth-child(1) { background: #ff5f56; }
|
||||||
|
.code-dots span:nth-child(2) { background: #ffbd2e; }
|
||||||
|
.code-dots span:nth-child(3) { background: #27ca40; }
|
||||||
|
.code-filename { font-family: 'JetBrains Mono', monospace; color: var(--neon-magenta); font-size: 0.9rem; }
|
||||||
|
.copy-btn {
|
||||||
|
background: rgba(255, 45, 149, 0.2);
|
||||||
|
border: 1px solid var(--neon-magenta);
|
||||||
|
color: var(--neon-magenta);
|
||||||
|
padding: 8px 20px;
|
||||||
|
border-radius: 4px;
|
||||||
|
cursor: pointer;
|
||||||
|
font-family: 'JetBrains Mono', monospace;
|
||||||
|
font-size: 0.85rem;
|
||||||
|
transition: all 0.3s;
|
||||||
|
}
|
||||||
|
.copy-btn:hover { background: var(--neon-magenta); color: #000; }
|
||||||
|
.code-content { padding: 25px; max-height: 600px; overflow: auto; }
|
||||||
|
.code-content::-webkit-scrollbar { width: 8px; height: 8px; }
|
||||||
|
.code-content::-webkit-scrollbar-track { background: #0a0a0f; }
|
||||||
|
.code-content::-webkit-scrollbar-thumb { background: var(--neon-magenta); border-radius: 4px; }
|
||||||
|
.code-content pre {
|
||||||
|
font-family: 'JetBrains Mono', monospace;
|
||||||
|
font-size: 0.8rem;
|
||||||
|
line-height: 1.6;
|
||||||
|
color: #f8f8f2;
|
||||||
|
margin: 0;
|
||||||
|
white-space: pre;
|
||||||
|
}
|
||||||
|
.hl-comment { color: #6272a4; font-style: italic; }
|
||||||
|
.hl-keyword { color: #ff79c6; }
|
||||||
|
.hl-string { color: #f1fa8c; }
|
||||||
|
.hl-function { color: #50fa7b; }
|
||||||
|
.hl-property { color: #8be9fd; }
|
||||||
|
.hl-number { color: #bd93f9; }
|
||||||
|
.code-container.python { border-color: var(--neon-purple); box-shadow: 0 0 30px rgba(189, 147, 249, 0.2); }
|
||||||
|
.code-container.python .code-header { background: rgba(189, 147, 249, 0.1); border-bottom-color: rgba(189, 147, 249, 0.3); }
|
||||||
|
.code-container.python .code-filename { color: var(--neon-purple); }
|
||||||
|
.code-container.python .copy-btn { background: rgba(189, 147, 249, 0.2); border-color: var(--neon-purple); color: var(--neon-purple); }
|
||||||
|
.code-container.python .copy-btn:hover { background: var(--neon-purple); color: #000; }
|
||||||
|
.code-container.python .code-content::-webkit-scrollbar-thumb { background: var(--neon-purple); }
|
||||||
|
.install-box {
|
||||||
|
background: var(--card-bg);
|
||||||
|
border: 1px solid rgba(0, 245, 255, 0.3);
|
||||||
|
border-radius: 12px;
|
||||||
|
padding: 50px;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
.install-cmd {
|
||||||
|
display: inline-flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 15px;
|
||||||
|
background: #000;
|
||||||
|
padding: 20px 40px;
|
||||||
|
border-radius: 8px;
|
||||||
|
font-family: 'JetBrains Mono', monospace;
|
||||||
|
font-size: 1.2rem;
|
||||||
|
margin: 25px 0;
|
||||||
|
border: 1px solid rgba(0, 245, 255, 0.3);
|
||||||
|
}
|
||||||
|
.install-cmd .dollar { color: var(--neon-cyan); }
|
||||||
|
.install-cmd .cmd { color: #fff; }
|
||||||
|
.install-cmd .copy-btn { background: rgba(0, 245, 255, 0.2); border-color: var(--neon-cyan); color: var(--neon-cyan); }
|
||||||
|
.install-cmd .copy-btn:hover { background: var(--neon-cyan); color: #000; }
|
||||||
|
.stats-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 25px; margin-bottom: 60px; }
|
||||||
|
.stat-card { background: var(--card-bg); border: 1px solid rgba(0, 245, 255, 0.2); border-radius: 12px; padding: 30px 20px; text-align: center; }
|
||||||
|
.stat-value { font-family: 'Orbitron', sans-serif; font-size: 2.5rem; font-weight: 700; color: var(--neon-cyan); margin-bottom: 8px; }
|
||||||
|
.stat-label { color: #888; font-size: 0.9rem; }
|
||||||
|
footer { padding: 60px 50px; text-align: center; border-top: 1px solid rgba(255, 255, 255, 0.05); }
|
||||||
|
.footer-links { display: flex; justify-content: center; gap: 40px; margin-bottom: 20px; }
|
||||||
|
.footer-links a { color: #666; text-decoration: none; transition: color 0.3s; }
|
||||||
|
.footer-links a:hover { color: var(--neon-cyan); }
|
||||||
|
.footer-copy { color: #444; font-size: 0.85rem; }
|
||||||
|
.download-box {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 30px;
|
||||||
|
background: var(--card-bg);
|
||||||
|
border: 2px solid var(--neon-magenta);
|
||||||
|
border-radius: 16px;
|
||||||
|
padding: 40px;
|
||||||
|
box-shadow: 0 0 40px rgba(255, 45, 149, 0.2);
|
||||||
|
}
|
||||||
|
.download-icon {
|
||||||
|
width: 80px;
|
||||||
|
height: 80px;
|
||||||
|
background: linear-gradient(135deg, var(--neon-magenta), var(--neon-purple));
|
||||||
|
border-radius: 16px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
font-family: 'JetBrains Mono', monospace;
|
||||||
|
font-size: 1.5rem;
|
||||||
|
font-weight: bold;
|
||||||
|
color: #fff;
|
||||||
|
flex-shrink: 0;
|
||||||
|
}
|
||||||
|
.download-info { flex: 1; }
|
||||||
|
.download-info h3 { font-family: 'JetBrains Mono', monospace; font-size: 1.4rem; color: #fff; margin-bottom: 8px; }
|
||||||
|
.download-info p { color: #888; font-size: 1rem; }
|
||||||
|
.download-btn { padding: 16px 40px; font-size: 1.1rem; font-weight: bold; }
|
||||||
|
.test-results {
|
||||||
|
background: var(--card-bg);
|
||||||
|
border: 1px solid rgba(80, 250, 123, 0.3);
|
||||||
|
border-radius: 12px;
|
||||||
|
padding: 30px;
|
||||||
|
margin-top: 40px;
|
||||||
|
}
|
||||||
|
.test-results h3 { color: var(--neon-green); margin-bottom: 20px; font-size: 1.2rem; }
|
||||||
|
.test-item { display: flex; align-items: center; padding: 12px 0; border-bottom: 1px solid rgba(255, 255, 255, 0.05); }
|
||||||
|
.test-item:last-child { border-bottom: none; }
|
||||||
|
.test-status { width: 60px; font-weight: bold; }
|
||||||
|
.test-status.ok { color: var(--neon-green); }
|
||||||
|
.test-name { flex: 1; color: #ccc; }
|
||||||
|
.test-desc { color: #666; font-size: 0.9rem; }
|
||||||
|
.browser-section { margin-top: 60px; }
|
||||||
|
.proxy-types { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 20px; margin-top: 30px; }
|
||||||
|
.proxy-type-card {
|
||||||
|
background: rgba(20, 20, 30, 0.6);
|
||||||
|
border: 1px solid rgba(0, 245, 255, 0.15);
|
||||||
|
border-radius: 12px;
|
||||||
|
padding: 25px;
|
||||||
|
}
|
||||||
|
.proxy-type-card h4 { color: var(--neon-cyan); margin-bottom: 10px; font-size: 1rem; }
|
||||||
|
.proxy-type-card code { background: #000; padding: 8px 12px; border-radius: 4px; display: block; margin-top: 10px; color: var(--neon-yellow); font-size: 0.85rem; }
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
nav { padding: 15px 20px; }
|
||||||
|
.nav-links { display: none; }
|
||||||
|
.hero h1 { font-size: 3rem; }
|
||||||
|
section { padding: 60px 20px; }
|
||||||
|
.stats-grid { grid-template-columns: repeat(2, 1fr); }
|
||||||
|
.install-cmd { font-size: 1rem; padding: 15px 20px; flex-wrap: wrap; justify-content: center; }
|
||||||
|
.download-box { flex-direction: column; text-align: center; }
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<div class="bg-animation"></div>
|
||||||
|
<div class="grid-overlay"></div>
|
||||||
|
|
||||||
|
<nav>
|
||||||
|
<div class="nav-logo">CFSPIDER</div>
|
||||||
|
<ul class="nav-links">
|
||||||
|
<li><a href="#features">Features</a></li>
|
||||||
|
<li><a href="#workers">Workers</a></li>
|
||||||
|
<li><a href="#install">Install</a></li>
|
||||||
|
<li><a href="#usage">Usage</a></li>
|
||||||
|
<li><a href="#browser">Browser</a></li>
|
||||||
|
<li><a href="https://github.com/violettoolssite/CFspider" target="_blank">GitHub</a></li>
|
||||||
|
</ul>
|
||||||
|
</nav>
|
||||||
|
|
||||||
|
<section class="hero">
|
||||||
|
<span class="hero-badge">OPEN SOURCE / MIT LICENSE</span>
|
||||||
|
<h1>CFSPIDER</h1>
|
||||||
|
<p>基于 Cloudflare Workers 的代理 IP 池，利用 Cloudflare 全球 300+ 边缘节点，为你的爬虫和网络请求提供高质量的代理 IP 出口。支持 HTTP 请求代理和浏览器模式。</p>
|
||||||
|
<div class="hero-buttons">
|
||||||
|
<a href="#workers" class="btn btn-primary">获取代码</a>
|
||||||
|
<a href="https://github.com/violettoolssite/CFspider" class="btn btn-secondary" target="_blank">GitHub</a>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section>
|
||||||
|
<div class="stats-grid">
|
||||||
|
<div class="stat-card"><div class="stat-value">300+</div><div class="stat-label">全球边缘节点</div></div>
|
||||||
|
<div class="stat-card"><div class="stat-value">100K</div><div class="stat-label">每日免费请求</div></div>
|
||||||
|
<div class="stat-card"><div class="stat-value">0ms</div><div class="stat-label">冷启动时间</div></div>
|
||||||
|
<div class="stat-card"><div class="stat-value">100%</div><div class="stat-label">开源免费</div></div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="test-results">
|
||||||
|
<h3>Tested Functions</h3>
|
||||||
|
<div class="test-item"><span class="test-status ok">OK</span><span class="test-name">HTTP GET 请求</span><span class="test-desc">返回 Cloudflare IP</span></div>
|
||||||
|
<div class="test-item"><span class="test-status ok">OK</span><span class="test-name">HTTP POST 请求</span><span class="test-desc">发送数据成功</span></div>
|
||||||
|
<div class="test-item"><span class="test-status ok">OK</span><span class="test-name">自定义 Headers</span><span class="test-desc">Header 正确传递</span></div>
|
||||||
|
<div class="test-item"><span class="test-status ok">OK</span><span class="test-name">Session 会话</span><span class="test-desc">多次请求正常</span></div>
|
||||||
|
<div class="test-item"><span class="test-status ok">OK</span><span class="test-name">浏览器 HTTP 代理</span><span class="test-desc">支持本地/远程代理</span></div>
|
||||||
|
<div class="test-item"><span class="test-status ok">OK</span><span class="test-name">浏览器 VLESS 代理</span><span class="test-desc">Cloudflare IP 出口</span></div>
|
||||||
|
<div class="test-item"><span class="test-status ok">OK</span><span class="test-name">截图/PDF/JS执行</span><span class="test-desc">浏览器功能正常</span></div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section id="features">
|
||||||
|
<div class="section-title"><h2>Features</h2><p>为什么选择 CFspider</p></div>
|
||||||
|
<div class="features-grid">
|
||||||
|
<div class="feature-card"><h3>全球边缘节点</h3><p>利用 Cloudflare 遍布全球 100+ 个国家的 300+ 个边缘节点，自动选择最近的节点作为代理出口，IP 地址来自世界各地。</p></div>
|
||||||
|
<div class="feature-card"><h3>Serverless 架构</h3><p>基于 Cloudflare Workers 的 Serverless 架构，无需管理服务器，自动扩缩容，冷启动时间接近零毫秒。</p></div>
|
||||||
|
<div class="feature-card"><h3>完全免费</h3><p>Cloudflare Workers 免费版每日 100,000 请求，对于大多数个人项目完全足够。无需付费，无需信用卡。</p></div>
|
||||||
|
<div class="feature-card"><h3>语法兼容 requests</h3><p>Python 客户端与流行的 requests 库语法一致，只需添加 cf_proxies 参数，零学习成本即可上手。</p></div>
|
||||||
|
<div class="feature-card"><h3>浏览器模式</h3><p>支持 Playwright 浏览器自动化，可渲染 JavaScript 动态页面、截图、生成 PDF、自动化操作等。</p></div>
|
||||||
|
<div class="feature-card"><h3>多种代理支持</h3><p>浏览器模式支持 HTTP 代理、SOCKS5 代理、edgetunnel VLESS 代理，灵活适配各种场景。</p></div>
|
||||||
|
<div class="feature-card"><h3>企业级安全</h3><p>所有请求通过 Cloudflare 网络，自动享受 DDoS 防护、WAF 防火墙、SSL/TLS 加密等企业级安全服务。</p></div>
|
||||||
|
<div class="feature-card"><h3>开源可控</h3><p>代码完全开源，部署在你自己的 Cloudflare 账户，你拥有完全的控制权，可根据需求自由定制。</p></div>
|
||||||
|
<div class="feature-card"><h3>中英双语界面</h3><p>Workers 自带的 Web 界面支持中英文切换，方便国内外用户使用，界面采用赛博朋克风格设计。</p></div>
|
||||||
|
</div>
|
||||||
|
<div class="section-title" style="margin-top: 60px;"><h2>API Endpoints</h2><p>Workers 提供的 API 接口列表</p></div>
|
||||||
|
<div class="api-table-container">
|
||||||
|
<table class="api-table">
|
||||||
|
<thead><tr><th>Method</th><th>Endpoint</th><th>Description</th></tr></thead>
|
||||||
|
<tbody>
|
||||||
|
<tr><td><span class="api-method">GET</span></td><td class="api-path">/api/fetch?url=...</td><td class="api-desc">代理请求目标 URL，返回原始内容</td></tr>
|
||||||
|
<tr><td><span class="api-method">GET</span></td><td class="api-path">/api/json?url=...</td><td class="api-desc">代理请求目标 URL，返回 JSON 格式（含节点信息）</td></tr>
|
||||||
|
<tr><td><span class="api-method">GET</span></td><td class="api-path">/api/pool</td><td class="api-desc">获取当前节点的 IP 池状态信息</td></tr>
|
||||||
|
<tr><td><span class="api-method">GET</span></td><td class="api-path">/api/proxyip</td><td class="api-desc">获取当前使用的 Proxy IP 和节点代码</td></tr>
|
||||||
|
<tr><td><span class="api-method">POST</span></td><td class="api-path">/proxy?url=...&method=...</td><td class="api-desc">Python 客户端使用的代理接口，支持自定义请求头</td></tr>
|
||||||
|
<tr><td><span class="api-method">GET</span></td><td class="api-path">/debug</td><td class="api-desc">调试接口，返回当前请求的详细信息</td></tr>
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section id="workers">
|
||||||
|
<div class="section-title"><h2>Workers Code</h2><p>下载 workers.js 文件，复制到 Cloudflare Workers 即可部署</p></div>
|
||||||
|
<div class="download-box" style="margin-bottom: 30px;">
|
||||||
|
<div class="download-icon">JS</div>
|
||||||
|
<div class="download-info">
|
||||||
|
<h3>workers.js</h3>
|
||||||
|
<p>CFspider 代理服务完整代码，包含 API 接口和赛博朋克风格 Web 界面</p>
|
||||||
|
</div>
|
||||||
|
<a href="/workers.js" download="workers.js" class="btn btn-primary download-btn">Download</a>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="section-title" style="margin-top: 60px;"><h2>edgetunnel</h2><p>浏览器模式 VLESS 代理需要部署 edgetunnel Workers</p></div>
|
||||||
|
<div class="download-box" style="border-color: var(--neon-purple); box-shadow: 0 0 40px rgba(189, 147, 249, 0.2);">
|
||||||
|
<div class="download-icon" style="background: linear-gradient(135deg, var(--neon-purple), var(--neon-cyan));">VL</div>
|
||||||
|
<div class="download-info">
|
||||||
|
<h3>edgetunnel</h3>
|
||||||
|
<p>VLESS 代理 Workers，用于浏览器模式的 Cloudflare IP 出口</p>
|
||||||
|
<p style="color: #666; font-size: 0.85rem; margin-top: 8px;">部署后获取 Workers 地址和 UUID，配合 cfspider.Browser 使用</p>
|
||||||
|
</div>
|
||||||
|
<a href="https://github.com/cmliu/edgetunnel" target="_blank" class="btn btn-secondary download-btn" style="border-color: var(--neon-purple); color: var(--neon-purple);">GitHub</a>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="feature-card" style="margin-top: 30px; border-color: rgba(189, 147, 249, 0.3);">
|
||||||
|
<h3 style="color: var(--neon-purple);">edgetunnel 部署步骤</h3>
|
||||||
|
<p style="margin-bottom: 15px;">1. 访问 <a href="https://github.com/cmliu/edgetunnel" target="_blank" style="color: var(--neon-cyan);">github.com/cmliu/edgetunnel</a></p>
|
||||||
|
<p style="margin-bottom: 15px;">2. 复制 _worker.js 代码到 Cloudflare Workers</p>
|
||||||
|
<p style="margin-bottom: 15px;">3. 设置环境变量 UUID（自定义或使用默认）</p>
|
||||||
|
<p style="margin-bottom: 15px;">4. 部署后获取 Workers 地址，如 v2.example.com</p>
|
||||||
|
<p>5. 在 cfspider.Browser 中使用：<code style="background: #000; padding: 4px 8px; border-radius: 4px; color: var(--neon-yellow);">cf_proxies="v2.example.com", vless_uuid="your-uuid"</code></p>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section id="install">
|
||||||
|
<div class="section-title"><h2>Install</h2><p>安装 Python 客户端库</p></div>
|
||||||
|
<div class="install-box">
|
||||||
|
<p style="color: #888; margin-bottom: 15px;">通过 pip 安装 cfspider 库，即可在 Python 中使用代理</p>
|
||||||
|
<div class="install-cmd">
|
||||||
|
<span class="dollar">$</span>
|
||||||
|
<span class="cmd">pip install cfspider</span>
|
||||||
|
<button class="copy-btn" onclick="copyInstall()">Copy</button>
|
||||||
|
</div>
|
||||||
|
<p style="color: #666; font-size: 0.9rem; margin-bottom: 10px;">支持 Python 3.7+，依赖 requests 库</p>
|
||||||
|
<p style="color: #888; font-size: 0.8rem; margin-bottom: 30px;">Python 3.11+ 如遇 externally-managed-environment 错误，请使用 venv 或添加 --break-system-packages</p>
|
||||||
|
|
||||||
|
<div style="border-top: 1px solid rgba(0, 245, 255, 0.2); padding-top: 25px; margin-top: 10px;">
|
||||||
|
<p style="color: var(--neon-cyan); font-size: 1rem; margin-bottom: 15px;">国内用户安装</p>
|
||||||
|
<div class="install-cmd" style="margin-bottom: 15px;">
|
||||||
|
<span class="dollar">$</span>
|
||||||
|
<span class="cmd">pip install cfspider -i https://pypi.tuna.tsinghua.edu.cn/simple</span>
|
||||||
|
<button class="copy-btn" onclick="copyMirror()">Copy</button>
|
||||||
|
</div>
|
||||||
|
<p style="color: #666; font-size: 0.85rem; margin-bottom: 20px;">使用清华镜像源加速下载</p>
|
||||||
|
|
||||||
|
<div style="display: flex; gap: 15px; justify-content: center; flex-wrap: wrap;">
|
||||||
|
<a href="/cfspider.zip" download class="btn btn-secondary" style="font-size: 0.9rem;">下载源码包</a>
|
||||||
|
<a href="https://github.com/violettoolssite/CFspider" target="_blank" class="btn btn-secondary" style="font-size: 0.9rem;">GitHub</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section id="usage">
|
||||||
|
<div class="section-title"><h2>Usage</h2><p>Python 使用示例</p></div>
|
||||||
|
<div class="code-container python">
|
||||||
|
<div class="code-header">
|
||||||
|
<div class="code-header-left">
|
||||||
|
<div class="code-dots"><span></span><span></span><span></span></div>
|
||||||
|
<span class="code-filename">example.py</span>
|
||||||
|
</div>
|
||||||
|
<button class="copy-btn" onclick="copyPython()">Copy Code</button>
|
||||||
|
</div>
|
||||||
|
<div class="code-content"><pre><span class="hl-keyword">import</span> cfspider
|
||||||
|
|
||||||
|
cf_proxies = <span class="hl-string">"https://your-workers.dev"</span>
|
||||||
|
|
||||||
|
response = cfspider.<span class="hl-function">get</span>(
|
||||||
|
<span class="hl-string">"https://httpbin.org/ip"</span>,
|
||||||
|
cf_proxies=cf_proxies
|
||||||
|
)
|
||||||
|
|
||||||
|
<span class="hl-function">print</span>(response.text)</pre></div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section id="browser" class="browser-section">
|
||||||
|
<div class="section-title"><h2>Browser Mode</h2><p>浏览器自动化模式，渲染 JavaScript 动态页面</p></div>
|
||||||
|
|
||||||
|
<div class="install-box" style="margin-bottom: 40px;">
|
||||||
|
<p style="color: #888; margin-bottom: 15px;">安装浏览器功能依赖</p>
|
||||||
|
<div class="install-cmd">
|
||||||
|
<span class="dollar">$</span>
|
||||||
|
<span class="cmd">pip install cfspider[browser]</span>
|
||||||
|
<button class="copy-btn" onclick="copyBrowser()">Copy</button>
|
||||||
|
</div>
|
||||||
|
<div class="install-cmd">
|
||||||
|
<span class="dollar">$</span>
|
||||||
|
<span class="cmd">cfspider install</span>
|
||||||
|
<button class="copy-btn" onclick="copyBrowserInstall()">Copy</button>
|
||||||
|
</div>
|
||||||
|
<p style="color: #666; font-size: 0.85rem;">安装 Chromium 浏览器</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="section-title"><p>支持的代理类型</p></div>
|
||||||
|
<div class="proxy-types">
|
||||||
|
<div class="proxy-type-card">
|
||||||
|
<h4>HTTP 代理</h4>
|
||||||
|
<p style="color: #888; font-size: 0.9rem;">使用本地或远程 HTTP 代理服务器</p>
|
||||||
|
<code>cf_proxies="127.0.0.1:9674"</code>
|
||||||
|
</div>
|
||||||
|
<div class="proxy-type-card">
|
||||||
|
<h4>SOCKS5 代理</h4>
|
||||||
|
<p style="color: #888; font-size: 0.9rem;">支持 SOCKS5 协议代理</p>
|
||||||
|
<code>cf_proxies="socks5://127.0.0.1:1080"</code>
|
||||||
|
</div>
|
||||||
|
<div class="proxy-type-card">
|
||||||
|
<h4>edgetunnel VLESS</h4>
|
||||||
|
<p style="color: #888; font-size: 0.9rem;">通过 edgetunnel 使用 Cloudflare IP</p>
|
||||||
|
<code>cf_proxies="v2.example.com", vless_uuid="..."</code>
|
||||||
|
</div>
|
||||||
|
<div class="proxy-type-card">
|
||||||
|
<h4>无代理</h4>
|
||||||
|
<p style="color: #888; font-size: 0.9rem;">直接使用本地网络</p>
|
||||||
|
<code>cfspider.Browser()</code>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="code-container python" style="margin-top: 40px;">
|
||||||
|
<div class="code-header">
|
||||||
|
<div class="code-header-left">
|
||||||
|
<div class="code-dots"><span></span><span></span><span></span></div>
|
||||||
|
<span class="code-filename">browser_example.py</span>
|
||||||
|
</div>
|
||||||
|
<button class="copy-btn" onclick="copyBrowserCode()">Copy Code</button>
|
||||||
|
</div>
|
||||||
|
<div class="code-content"><pre><span class="hl-keyword">import</span> cfspider
|
||||||
|
|
||||||
|
browser = cfspider.<span class="hl-function">Browser</span>(cf_proxies=<span class="hl-string">"127.0.0.1:9674"</span>)
|
||||||
|
|
||||||
|
html = browser.<span class="hl-function">html</span>(<span class="hl-string">"https://example.com"</span>)
|
||||||
|
<span class="hl-function">print</span>(html)
|
||||||
|
|
||||||
|
browser.<span class="hl-function">screenshot</span>(<span class="hl-string">"https://example.com"</span>, <span class="hl-string">"screenshot.png"</span>)
|
||||||
|
|
||||||
|
browser.<span class="hl-function">close</span>()</pre></div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<footer>
|
||||||
|
<div class="footer-links">
|
||||||
|
<a href="https://github.com/violettoolssite/CFspider" target="_blank">GitHub</a>
|
||||||
|
<a href="https://pypi.org/project/cfspider/" target="_blank">PyPI</a>
|
||||||
|
</div>
|
||||||
|
<p class="footer-copy">CFspider | MIT License | Powered by Cloudflare Workers</p>
|
||||||
|
</footer>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
const pythonCode = `import cfspider
|
||||||
|
|
||||||
|
cf_proxies = "https://your-workers.dev"
|
||||||
|
|
||||||
|
response = cfspider.get(
|
||||||
|
"https://httpbin.org/ip",
|
||||||
|
cf_proxies=cf_proxies
|
||||||
|
)
|
||||||
|
|
||||||
|
print(response.text)`;
|
||||||
|
|
||||||
|
const browserCode = `import cfspider
|
||||||
|
|
||||||
|
browser = cfspider.Browser(cf_proxies="127.0.0.1:9674")
|
||||||
|
|
||||||
|
html = browser.html("https://example.com")
|
||||||
|
print(html)
|
||||||
|
|
||||||
|
browser.screenshot("https://example.com", "screenshot.png")
|
||||||
|
|
||||||
|
browser.close()`;
|
||||||
|
|
||||||
|
function copyInstall() {
|
||||||
|
navigator.clipboard.writeText('pip install cfspider');
|
||||||
|
event.target.textContent = 'Copied!';
|
||||||
|
setTimeout(() => event.target.textContent = 'Copy', 2000);
|
||||||
|
}
|
||||||
|
|
||||||
|
function copyMirror() {
|
||||||
|
navigator.clipboard.writeText('pip install cfspider -i https://pypi.tuna.tsinghua.edu.cn/simple');
|
||||||
|
event.target.textContent = 'Copied!';
|
||||||
|
setTimeout(() => event.target.textContent = 'Copy', 2000);
|
||||||
|
}
|
||||||
|
|
||||||
|
function copyPython() {
|
||||||
|
navigator.clipboard.writeText(pythonCode);
|
||||||
|
event.target.textContent = 'Copied!';
|
||||||
|
setTimeout(() => event.target.textContent = 'Copy Code', 2000);
|
||||||
|
}
|
||||||
|
|
||||||
|
function copyBrowser() {
|
||||||
|
navigator.clipboard.writeText('pip install cfspider[browser]');
|
||||||
|
event.target.textContent = 'Copied!';
|
||||||
|
setTimeout(() => event.target.textContent = 'Copy', 2000);
|
||||||
|
}
|
||||||
|
|
||||||
|
function copyBrowserInstall() {
|
||||||
|
navigator.clipboard.writeText('cfspider install');
|
||||||
|
event.target.textContent = 'Copied!';
|
||||||
|
setTimeout(() => event.target.textContent = 'Copy', 2000);
|
||||||
|
}
|
||||||
|
|
||||||
|
function copyBrowserCode() {
|
||||||
|
navigator.clipboard.writeText(browserCode);
|
||||||
|
event.target.textContent = 'Copied!';
|
||||||
|
setTimeout(() => event.target.textContent = 'Copy Code', 2000);
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
Reference in New Issue
Block a user