287 lines
15 KiB
HTML
287 lines
15 KiB
HTML
{{ template "page/head_start" .}}
|
||
<style>
|
||
/*
|
||
样式优化：强制选项卡铺满主区域并等宽显示
|
||
- display: flex; 使其成为弹性容器
|
||
- flex-grow: 1; 让每个选项卡平均分配可用空间
|
||
*/
|
||
.ant-tabs-bar {
|
||
margin: 0;
|
||
display: flex !important;
|
||
width: 100% !important;
|
||
}
|
||
|
||
/* 新增规则：强制 .ant-tabs-nav-wrap 参与弹性布局，这是解决问题的关键 */
|
||
.ant-tabs-nav-wrap {
|
||
display: flex !important;
|
||
flex: 1 !important;
|
||
}
|
||
|
||
/* 优化选项卡导航的flexbox布局，确保等宽显示 */
|
||
.ant-tabs-nav {
|
||
width: 100%;
|
||
display: flex !important;
|
||
}
|
||
|
||
/* 为选项卡内部添加内边距和文字大小调整 */
|
||
.ant-tabs-tab {
|
||
flex: 1 !important; /* 新增规则：强制选项卡等宽显示 */
|
||
text-align: center;
|
||
padding: 0 16px;
|
||
font-size: 18px; /* 增大选项卡文字大小 */
|
||
}
|
||
|
||
/* 为选项卡图标和文字之间添加间距 */
|
||
.ant-tabs-tab .anticon + span {
|
||
margin-left: 8px;
|
||
}
|
||
|
||
/*
|
||
根据 settings.html 文件的布局，为内容区设置 16px 的左右间距，
|
||
使其与侧边栏保持一致。
|
||
*/
|
||
#content-layout .ant-layout-content {
|
||
max-width: 1200px;
|
||
padding-top: 0 !important; /* 强制移除顶部的间距 */
|
||
padding-left: 16px;
|
||
padding-right: 16px;
|
||
box-sizing: border-box;
|
||
}
|
||
|
||
/*
|
||
为选项卡和内容卡片之间添加一个合适的间隙。
|
||
使用 margin-top 和 padding 调整卡片的位置和内部空间。
|
||
*/
|
||
.tab-content-pane {
|
||
padding-top: 24px;
|
||
}
|
||
|
||
.tab-content-pane .ant-card {
|
||
padding: 24px;
|
||
}
|
||
|
||
/*
|
||
确保文本颜色继承父元素，以兼容不同主题
|
||
（如：暗色主题下文本变为白色）
|
||
*/
|
||
.tab-content-pane h2,
|
||
.tab-content-pane p,
|
||
.tab-content-pane strong,
|
||
.tab-content-pane ol,
|
||
.tab-content-pane ul,
|
||
.tab-content-pane li,
|
||
.tab-content-pane code {
|
||
color: inherit !important; /* 强制继承父元素的颜色 */
|
||
}
|
||
|
||
/* 确保链接文字在任何主题下都显示为蓝色，以保持一致的视觉识别 */
|
||
.tab-content-pane a {
|
||
color: #1890ff !important;
|
||
}
|
||
.tab-content-pane a:hover {
|
||
text-decoration: underline;
|
||
}
|
||
|
||
/* 调整 p 标签字体大小，使其更易于阅读。*/
|
||
#content-layout .tab-content-pane p {
|
||
line-height: 1.8;
|
||
font-size: 18px !important;
|
||
margin-bottom: 1.5em; /* 为段落添加底部外边距 */
|
||
}
|
||
|
||
/* 修复列表文字大小和行高问题 */
|
||
.tab-content-pane ol, .tab-content-pane ul {
|
||
padding-left: 20px;
|
||
margin-bottom: 1em;
|
||
}
|
||
.tab-content-pane ol li, .tab-content-pane ul li {
|
||
margin-bottom: 0.5em;
|
||
line-height: 1.8;
|
||
font-size: 15px; /* 调整列表项字体大小 */
|
||
}
|
||
</style>
|
||
{{ template "page/head_end" .}}
|
||
|
||
{{ template "page/body_start" .}}
|
||
<a-layout id="app" v-cloak :class="themeSwitcher.currentTheme">
|
||
<a-sidebar></a-sidebar>
|
||
<a-layout id="content-layout">
|
||
<a-layout-content>
|
||
<a-spin :spinning="false">
|
||
<a-tabs default-active-key="1">
|
||
<a-tab-pane key="1">
|
||
<template #tab>
|
||
<a-icon type="tool"></a-icon>
|
||
<span>有用技巧</span>
|
||
</template>
|
||
<div class="tab-content-pane">
|
||
<a-card>
|
||
<h2>一、〔X-Panel面板〕交流群与安装教程</h2>
|
||
<br>
|
||
<p><a href="https://t.me/XUI_CN" target="_blank">点击加入〔X-Panel面板〕交流群：https://t.me/XUI_CN</a></p>
|
||
<p><a href="https://xeefei.blogspot.com/2025/09/x-panel.html" target="_blank">详细安装流程步骤：https://xeefei.blogspot.com/2025/09/x-panel.html</a></p>
|
||
<br>
|
||
|
||
<h2>二、判断VPS服务器的IP是否“送中”及解决方法</h2>
|
||
<ol>
|
||
<li><strong>判断方法：</strong></li>
|
||
<li>点击打开 <a href="https://music.youtube.com/" target="_blank">https://music.youtube.com/</a>，能正常访问，代表没“送中”，反之就是“送中”了。</li>
|
||
<li><strong>如果送中了如何解决去【拉回来】？解决方法：</strong></li>
|
||
<li>关闭/取消登录了谷歌账户的APP定位权限/授权；</li>
|
||
<li>将常用的一个谷歌账号的位置记录功能打开；</li>
|
||
<li>打开谷歌浏览器，登录开了位置记录功能的谷歌账号，并安装 <a href="https://chrome.google.com/webstore/detail/location-guard/cfohepagpmnodfdmjliccbbigdkfcgia" target="_blank">Location Guard</a> 扩展插件；</li>
|
||
<li>打开Location Guard插件，选择Fixed Location，并在给出的地图上单击，即可标记上你想要IP所处的国家/地区 Google IP定位错误，使用Location Guard修改；</li>
|
||
<li>转换到Options选项，Default level默认设置为Use fixed location；</li>
|
||
<li>访问 <a href="打开谷歌地图google.com/maps，点击右下角定位授权图标，使google" target="_blank">谷歌地图服务</a> 获取当前GPS位置，确认是否已修改成功；</li>
|
||
<li>谷歌搜索my ip，即可看到谷歌IP定位到了刚才地图上标记的位置；</li>
|
||
<li>最后，通过 <a href="https://support.google.com/websearch/workflow/9308722" target="_blank">此网页向谷歌报告IP问题</a>。</li>
|
||
</ol>
|
||
<br>
|
||
|
||
<h2>三、在VPS服务器部署“订阅转换”功能</h2>
|
||
<ol>
|
||
<li><strong>操作步骤：：</strong> </li>
|
||
<li>进入脚本输入x-ui命令调取面板，选择第【25】选项安装订阅转换模块；</li>
|
||
<li>等待安装【订阅转换】成功之后，访问地址：<code>https://你的域名:15268</code> ；</li>
|
||
<li>因为在转换过程中需要调取后端API，所以请确保端口 8000 和 15268 是打开放行的；</li>
|
||
<li>直接复制脚本中提供的【登录地址】，进入后台，点击【节点列表】----->>>【添加节点】；</li>
|
||
<li>接下来点击左边侧边栏的【订阅列表】去【添加订阅】；</li>
|
||
<li>最后一步，点击【客户端】，即可导入Clash等软件中使用；</li>
|
||
<li>此功能集成到〔X-Panel面板〕中，是为了保证安全，不会造成链接泄露。</li>
|
||
</ol>
|
||
<br>
|
||
|
||
<h2>四、如何保护自己的IP不被封锁被墙掉？</h2>
|
||
<ol>
|
||
<li><strong>使用安全代理协议：：</strong> 加密是必备，推荐使用vless+reality+vision协议组合；</li>
|
||
<li><strong>避免共享节点：：</strong> 尽量不要在不同的地区，多个省份之间不要共同连接同一个IP；</li>
|
||
<li><strong>隔离IP和端口：：</strong> 避免多个用户或设备在不同地理位置漫游时使用同一个IP和端口，要分开；</li>
|
||
<li><strong>控制流量：：</strong> 不要在单台VPS上长时间进行大流量下载，在一天内不要流量过高，适时切换节点；</li>
|
||
<li><strong>使用高位端口：：</strong> 创建入站时，尽量使用 40000 至 65000 之间的高位端口号。</li>
|
||
<li><strong>核心总结：：</strong> 不要多终端、多省份、多朋友共同使用同一个IP和端口。多创建几个入站，各用各的，避免被 GFW 识别为机场特征。
|
||
使用〔X-Panel面板〕多创建几个【入站】， 多做几条备用，各用各的！各行其道才比较安全！
|
||
GFW的思维模式是干掉机场，机场的特征个人用户不要去沾染，自然IP就保护好了。</li>
|
||
</ol>
|
||
<br>
|
||
|
||
<h2>五、检测IP纯净度</h2>
|
||
<p>访问 <a href="https://scamalytics.com/" target="_blank">https://scamalytics.com/</a>，输入IP检测欺诈分数，分数越高代表IP越“脏”。</p>
|
||
<br>
|
||
|
||
<h2>六、查看指定端口的网络连接数</h2>
|
||
<p><strong>Linux 命令：</strong><br>
|
||
<code>netstat -ntu | grep :节点端口 | grep ESTABLISHED | awk '{print $5}'</code></p>
|
||
<br>
|
||
|
||
<h2>七、如何用 X-Panel 实现“自己偷自己”？</h2>
|
||
<ol>
|
||
<li><strong>其实很简单，只要你为面板设置了证书， 开启了HTTPS登录，就可以将〔X-Panel面板〕自身作为web server， 无需Nginx等；</strong></li>
|
||
<li><strong>这里给一个示例： 其中目标网站（Dest）请填写面板监听端口；</strong></li>
|
||
<li><strong>可选域名（SNI）填写面板登录域名， 如果您使用其他web server（如nginx）等， 将目标网站改为对应监听端口也可；</strong></li>
|
||
<li><strong>注意：需要说明的是，如果您处于白名单地区，自己“偷”自己并不适合你；</strong></li>
|
||
<li><strong>可选域名一项实际上可以填写任意SNI，只要客户端保持一致即可，不过并不推荐这样做。</strong></li>
|
||
</ol>
|
||
<br>
|
||
|
||
<h2>八、项目声明与注意</h2>
|
||
<br>
|
||
<ol>
|
||
<li><strong>声明：</strong> 此项目仅供个人学习、交流使用，请遵守当地法律法规，勿用于非法用途；请勿用于生产环境。</li>
|
||
<li><strong>注意：</strong> 在使用此项目和〔教程〕过程中，若因违反以上声明使用规则而产生的一切后果由使用者自负。</li>
|
||
</ol>
|
||
<br>
|
||
</a-card>
|
||
</div>
|
||
</a-tab-pane>
|
||
|
||
<a-tab-pane key="2">
|
||
<template #tab>
|
||
<a-icon type="wallet"></a-icon>
|
||
<span>推广赞助</span>
|
||
</template>
|
||
<div class="tab-content-pane">
|
||
<a-card>
|
||
<h2>一、若此项目对你有帮助，可以考虑通过以下链接购买VPS：</h2>
|
||
<br>
|
||
<ol>
|
||
<li><strong>搬瓦工GIA线路：</strong> <a href="https://bandwagonhost.com/aff.php?aff=75015" target="_blank">https://bandwagonhost.com/aff.php?aff=75015</a></li>
|
||
<li><strong>Dmit高端GIA：：</strong> <a href="https://www.dmit.io/aff.php?aff=9326" target="_blank">https://www.dmit.io/aff.php?aff=9326</a></li>
|
||
<li><strong>白丝云【4837】：：</strong> <a href="https://cloudsilk.io/aff.php?aff=706" target="_blank">https://cloudsilk.io/aff.php?aff=706</a></li>
|
||
</ol>
|
||
<br>
|
||
|
||
<h2>二、项目相关</h2>
|
||
<br>
|
||
<p><a href="https://t.me/is_Chat_Bot" target="_blank">--->合作咨询请联系作者<---</a></p>
|
||
<p><a href="https://github.com/xeefei/x-panel" target="_blank">〔X-Panel面板〕项目地址</a></p>
|
||
<br>
|
||
</a-card>
|
||
</div>
|
||
</a-tab-pane>
|
||
|
||
<a-tab-pane key="3">
|
||
<template #tab>
|
||
<a-icon type="appstore"></a-icon>
|
||
<span>其他资源</span>
|
||
</template>
|
||
<div class="tab-content-pane">
|
||
<a-card>
|
||
<h2>一、常见的代理软件/工具</h2>
|
||
<br>
|
||
<ol>
|
||
<li><strong>Windows系统v2rayN:</strong> <a href="https://github.com/2dust/v2rayN" target="_blank">https://github.com/2dust/v2rayN</a></li>
|
||
<li><strong>安卓手机版【v2rayNG】:</strong> <a href="https://github.com/2dust/v2rayNG" target="_blank">https://github.com/2dust/v2rayNG</a></li>
|
||
<li><strong>苹果手机IOS【小火箭】:</strong> <a href="https://apple02.com/" target="_blank">https://apple02.com/</a></li>
|
||
<li><strong>苹果MacOS电脑【Clash Verge】:</strong> <a href="https://github.com/clash-verge-rev/clash-verge-rev/releases" target="_blank">https://github.com/clash-verge-rev/clash-verge-rev/releases</a></li>
|
||
</ol>
|
||
<br>
|
||
|
||
<h2>二、“接码”网站</h2>
|
||
<p><a href="https://sms-activate.org/cn" target="_blank">https://sms-activate.org/cn</a>直接注册账号购买，可用于注册各种在线服务。</p>
|
||
<br>
|
||
|
||
<h2>三、常用网站和群组</h2>
|
||
<br>
|
||
<ol>
|
||
<li><strong>NodeSeek 论坛：</strong> <a href="https://www.nodeseek.com/" target="_blank">https://www.nodeseek.com/</a></li>
|
||
<li><strong>V2EX 论坛：：</strong> <a href="https://www.v2ex.com/" target="_blank">https://www.v2ex.com/</a></li>
|
||
<li><strong>搬瓦工 TG 群：：</strong> <a href="https://t.me/BWHOfficial" target="_blank">https://t.me/BWHOfficial</a></li>
|
||
<li><strong>Xray 官方群：：</strong> <a href="https://t.me/projectXray" target="_blank">https://t.me/projectXray</a></li>
|
||
<li><strong>Dmit 交流群：：</strong> <a href="https://t.me/DmitChat" target="_blank">https://t.me/DmitChat</a></li>
|
||
<li><strong>白丝云用户群：：</strong> <a href="https://t.me/+VHZLKELTQyzPNgOV" target="_blank">https://t.me/+VHZLKELTQyzPNgOV</a></li>
|
||
<li><strong>NameSilo 域名注册：：</strong> <a href="https://www.namesilo.com/" target="_blank">https://www.namesilo.com/</a></li>
|
||
</ol>
|
||
<br>
|
||
|
||
<br>
|
||
<h2>四、其他内容</h2>
|
||
<br>
|
||
<p><a href="https://www.youtube.com/results?search_query=4k%E6%B5%8B%E9%80%9F" target="_blank">油管4K测速：https://www.youtube.com/results?search_query=4k%E6%B5%8B%E9%90%A6</a></p>
|
||
<p><a href="https://xtls.github.io/" target="_blank">Project X：https://xtls.github.io/</a></p>
|
||
<p><a href="https://whatismyipaddress.com/" target="_blank">我的IP查询：https://whatismyipaddress.com/</a></p>
|
||
<p><a href="https://translate.google.com/?hl=zh-CN" target="_blank">Google翻译：https://translate.google.com/?hl=zh-CN</a></p>
|
||
<br>
|
||
</a-card>
|
||
</div>
|
||
</a-tab-pane>
|
||
</a-tabs>
|
||
</a-spin>
|
||
</a-layout-content>
|
||
</a-layout>
|
||
</a-layout>
|
||
|
||
{{template "page/body_scripts" .}}
|
||
{{template "component/aSidebar" .}}
|
||
{{template "component/aThemeSwitch" .}}
|
||
<script>
|
||
// 初始化 Vue 应用实例
|
||
const app = new Vue({
|
||
delimiters: ['[[', ']]'],
|
||
el: '#app',
|
||
data: {
|
||
themeSwitcher, // 确保主题切换器对象在 Vue 实例中可用
|
||
},
|
||
});
|
||
</script>
|
||
{{ template "page/body_end" .}}
|