本文最后更新于 2024-01-29，文章内容可能已经过时。

在CodeSandBox上使用Docker并利用Cloudflare Tunnel连接自定义域名——以青龙面板为例

前言

长期以来，白嫖Replit已经成为我的习惯，但突然间Replit的政策改变让我感到措手不及。

虽然之前我已经了解到了CodeSandBox这个平台，但由于其公开性质以及不可更换的容器域名分配，一直以来我都离不开Replit。在CodeSandBox部署服务后，我通常会在Replit上部署NGINX服务，以反代CodeSandBox提供的域名，从而在一定程度上避免了CodeSandBox容器的直接暴露。

面对Replit即将无法白嫖的现实，我考虑如何在CodeSandBox上愉快地使用。我首先想到的是Cloudflare的Workers。然而，对于免费用户来说，Workers的配额太有限，使用它可能会浪费资源。那么，有没有解决方案呢？

虽然我一直在家中使用Cloudflared打通Tunnel进行穿透，但是通过fscarman2的各种PaaS平台搭建代理的仓库给了我灵感。我想在PaaS平台上使用Cloudflared，就像我在家里的软路由上进行内网穿透一样，使用自己的域名。

经过多次尝试，我终于找到了在CodeSandBox上相对稳定搭建各种服务的方法。如果你熟悉操作，也可以自己构建各种镜像进行部署，只需在 docker-compose.yaml文件的末尾添加Cloudflared部分即可。

在这里，以青龙面板为例，我将讲述在CodeSandBox上的白嫖方法。

部署过程

注册CodeSandBox

CodeSandBox支持Google、Github等多种登录方式，选择任意方式进行注册登录即可，这里不再赘述。

编写docker-compose文件

以青龙面板为例，在这里可以找到其docker-compose文件。

稍作修改：

version: '2'
services:
    qinglong:
      image: whyour/qinglong:latest
      volumes:
        - /project/sandbox/ql/data:/ql/data
      ports:
       - "0.0.0.0:5700:5700"
      environment:
        QlBaseUrl: '/'
      restart: always

    cloudflared:
      restart: always
      network_mode: host
      environment:
          - TZ=Asia/Shanghai
      command: tunnel --edge-ip-version auto --protocol quic --heartbeat-interval 10s run --token [ARGO_TOKEN]
      container_name: cloudflared
      image: cloudflare/cloudflared:latest

其中的 [ARGO_TOKEN]需要替换为自己的token，后文将附上详细教程。

整个 docker-compose.yaml的内容如下：

version: '2'
services:
    qinglong:
      image: whyour/qinglong:latest
      volumes:
        - /project/sandbox/ql/data:/ql/data
      ports:
       - "0.0.0.0:5700:5700"
      environment:
        QlBaseUrl: '/'
      restart: always

    cloudflared:
      restart: always
      network_mode: host
      environment:
          - TZ=Asia/Shanghai
      command: tunnel --edge-ip-version auto --protocol quic --heartbeat-interval 10s run --token [ARGO_TOKEN]
      container_name: cloudflared
      image: cloudflare/cloudflared:latest

获取[ARGO_TOKEN]

详见群晖套件：Cloudflare Tunnel 内网穿透中文教程 支持DSM6、7。

此处需要的[ARGO_TOKEN]是以ey开头的那一串。

然后在Cloudflare中设置好相应的域名和本地端口对应，一般协议使用http即可。按照我的 docker-compose.yaml来看，我应该映射5700端口，所以我填的是 0.0.0.0:5700。

创建Devbox

在CodeSandBox中进入dashboard，然后点击"Create a Devbox"。

445CAB72-106D-467B-80F3-F8EE61D3955A.png

选择docker。

4F902065-C02D-4CA0-8A88-F4271B5FB0F8.png

进入Devbox之后，在左侧的文件管理EXPLORER中可以看到有 .codesandbox和 .devcontainer两个文件夹。

6D20196F-B940-40EB-ABF1-06B30B47DD23.png

先修改 .codesandbox中的 tasks.json文件，在 setupTasks中添加部署命令：

"setupTasks": [
    {
      "name": "Deploy",
      "command": "cd /project/sandbox/.devcontainer/ && docker compose up -d"
    }
  ],

然后在 .devcontainer文件夹下新建 docker-compose.yaml文件，将上述的 docker-compose.yaml内容全部复制进去。

最后点击左上角的方框打开菜单，选择"Restart Devbox"，等待容器重启后，你就可以看到青龙运行好了。再试一下刚刚在Cloudflare中映射的域名，也可以用了。

一些问题

不知道为什么，当我使用http2模式运行Cloudflared时，隧道断连后并不会重新连接，auto模式在quic模式断连后自动切换http2模式，再断连又会出现http2模式一样的问题。所以我只能指定其使用quic模式进行运行。原因未知，希望有人能找到原因。

然后，必须保持容器活跃，Cloudflared掉线后才会重连，为保证其活跃，得使用网站监控器监控CodeSandBox自带的映射域名，形同 https://t6a4m-8080.csb.app/的那个。至于网站监控器，Uptime-Kuma、cron-job、UptimeRobot之类的都行。

注意，有些PaaS平台（比如Glitch）已经禁止了自身服务器ip、公用网站监控器ip进行访问，所以上述的cron-job和UptimeRobot是否能行请自行测试，更加建议自己搭建Uptime-Kuma。

后话

在CodeSandBox上我已经尝试使用此方法部署了Alist、qinglong、Halo（本站就是）、Pandora_Next以及自己构筑的个别镜像等多个应用，尽数成功。可玩性还是很高的。

但是不得不提醒，这种方法只是避免了从域名上找到自己的容器而已，并不能确保自己的数据不会泄露，毕竟使用的是公共容器，请注意信息安全，不要存储私密信息，否则后果自负。

原帖地址：