<!doctype html><html lang="zh"><head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>CaraChat – 2000年代的Caramail聊天室，用PHP重新打造（免费，在线）</title> <meta name="description" content="CaraChat用PHP重新打造了2002年的Caramail聊天客户端：聊天室、私聊、彩色昵称、彩虹和波浪文字，以及原汁原味手绘的表情符号。免费，在浏览器中使用。"> <link rel="canonical" href="https://{{DOMAIN}}/zh/"> <link rel="alternate" hreflang="fr" href="https://{{DOMAIN}}/"> <link rel="alternate" hreflang="en" href="https://{{DOMAIN}}/en/"> <link rel="alternate" hreflang="es" href="https://{{DOMAIN}}/es/"> <link rel="alternate" hreflang="de" href="https://{{DOMAIN}}/de/"> <link rel="alternate" hreflang="it" href="https://{{DOMAIN}}/it/"> <link rel="alternate" hreflang="pt" href="https://{{DOMAIN}}/pt/"> <link rel="alternate" hreflang="nl" href="https://{{DOMAIN}}/nl/"> <link rel="alternate" hreflang="pl" href="https://{{DOMAIN}}/pl/"> <link rel="alternate" hreflang="ru" href="https://{{DOMAIN}}/ru/"> <link rel="alternate" hreflang="uk" href="https://{{DOMAIN}}/uk/"> <link rel="alternate" hreflang="tr" href="https://{{DOMAIN}}/tr/"> <link rel="alternate" hreflang="ja" href="https://{{DOMAIN}}/ja/"> <link rel="alternate" hreflang="zh" href="https://{{DOMAIN}}/zh/"> <link rel="alternate" hreflang="ko" href="https://{{DOMAIN}}/ko/"> <link rel="alternate" hreflang="x-default" href="https://{{DOMAIN}}/"> <link rel="icon" href="../images/favicon.png"> <meta property="og:type" content="website"> <meta property="og:title" content="CaraChat – 2000年代的Caramail聊天室"> <meta property="og:description" content="聊天室、私聊、色彩、彩虹和原版表情符号：用PHP重现的2002年聊天室。"> <meta property="og:url" content="https://{{DOMAIN}}/zh/"> <meta property="og:image" content="https://{{DOMAIN}}/images/og.png"> <meta property="og:locale" content="zh_CN"> <meta name="twitter:card" content="summary_large_image"> <meta name="twitter:title" content="CaraChat – 2000年代的Caramail聊天室"> <meta name="twitter:description" content="聊天室、私聊、色彩、彩虹和原版表情符号：用PHP重现的2002年聊天室。"> <meta name="twitter:image" content="https://{{DOMAIN}}/images/og.png"> <script type="application/ld+json">{ "@context": "https://schema.org", "@type": "WebApplication", "name": "CaraChat", "description": "用JumPHP以PHP重新打造的2002年Caramail聊天客户端：聊天室、私聊、色彩、彩虹和波浪文字、原版手绘表情符号。", "url": "https://{{DOMAIN}}/zh/", "applicationCategory": "CommunicationApplication", "operatingSystem": "Web browser, Linux, Windows, macOS", "image": "https://{{DOMAIN}}/images/og.png", "screenshot": ["https://{{DOMAIN}}/images/chat.png", "https://{{DOMAIN}}/images/rooms.png", "https://{{DOMAIN}}/images/search.png", "https://{{DOMAIN}}/images/private.png", "https://{{DOMAIN}}/images/phone.png", "https://{{DOMAIN}}/images/login.png"], "isAccessibleForFree": true, "offers": {"@type": "Offer", "price": "0", "priceCurrency": "EUR"}, "potentialAction": {"@type": "UseAction", "target": "https://{{DOMAIN}}/play/"}} </script> <script type="application/ld+json">{ "@context": "https://schema.org", "@type": "FAQPage", "mainEntity": [ {"@type": "Question", "name": "怎么做一个表情符号？", "acceptedAnswer": {"@type": "Answer", "text": "和2002年一样：眼睛、鼻子和嘴巴，例如 :-) ;-) 8-) :o) ，圣诞老人则是 :#) 。鼻子是必须的。表情后面加一个数字可以改变颜色（:-)2），#c 或 #d 会加上一只手。#00 到 #14 是图画：#13 是一颗心。"}}, {"@type": "Question", "name": "需要服务器吗？", "acceptedAnswer": {"@type": "Answer", "text": "需要：聊天服务器 CaraChat Serveur（PHP，无需数据库）可在任何机器上用Docker启动，然后在连接窗口中填写它的地址和端口（4500）。"}} ]} </script> <style> :root { --gris: #c0c0c0; --bleu: #0000ff; --nuit: #1a1a8c; --rose: #ff00c8; } * { box-sizing: border-box; } body { margin: 0; font-family: Helvetica, Arial, sans-serif; background: var(--gris); color: #000; line-height: 1.5; } header { background: #404040; color: #fff; padding: 12px 16px; } header .wrap { display: flex; align-items: center; gap: 12px; } header img { width: 40px; height: 40px; image-rendering: pixelated; } header strong { font-size: 1.4rem; color: #fff; } .wrap { max-width: 1040px; margin: 0 auto; } main { padding: 0 16px 40px; } .langs { display: flex; flex-wrap: wrap; gap: 4px 12px; font-size: 13px; margin: 10px 0 0; padding: 0; } .langs a { color: var(--nuit); } h1 { color: var(--bleu); font-size: 2.2rem; margin: 28px 0 8px; } h2 { color: var(--nuit); border-bottom: 2px solid #808080; padding-bottom: 4px; margin-top: 40px; } .lead { font-size: 1.15rem; max-width: 760px; } .play { display: inline-block; background: var(--bleu); color: #fff; font-weight: bold; font-size: 1.25rem; padding: 14px 28px; border-radius: 6px; text-decoration: none; margin: 12px 0 24px; } .play:hover { background: var(--nuit); } figure { margin: 0; background: #fff; border: 1px solid #808080; padding: 6px; } figure img { display: block; width: 100%; height: auto; } figcaption { font-size: .9rem; color: #646464; padding: 6px 2px 0; } .grid { display: grid; grid-template-columns: 2fr 1fr; gap: 16px; align-items: start; } .card { background: #fff; border: 1px solid #808080; padding: 12px 16px; } code { background: #eeeeff; padding: 1px 4px; border-radius: 3px; } .help h3 { color: #990000; font-size: 1.05rem; margin: 18px 0 6px; } .help .note { color: #646464; font-size: .9rem; } .rainbow span:nth-child(9n+1) { color: #ff00c8 } .rainbow span:nth-child(9n+2) { color: #6e265f } .rainbow span:nth-child(9n+3) { color: #7d0000 } .rainbow span:nth-child(9n+4) { color: #1a1a8c } .rainbow span:nth-child(9n+5) { color: #0000ff } .rainbow span:nth-child(9n+6) { color: #147300 } .rainbow span:nth-child(9n+7) { color: #9b9b14 } .rainbow span:nth-child(9n+8) { color: #ff9d00 } .rainbow span:nth-child(9n) { color: #ff0000 } .shots { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; } .shots .phone img { max-width: 260px; margin: 0 auto; } @media (max-width: 720px) { .shots { grid-template-columns: 1fr; } } footer { font-size: .85rem; color: #404040; padding: 24px 16px; border-top: 1px solid #808080; } @media (max-width: 720px) { .grid { grid-template-columns: 1fr; } h1 { font-size: 1.7rem; } } </style></head><body><header><div class="wrap"><img src="../images/favicon.png" alt="小程序里眨眼的表情符号" width="40" height="40"><strong>CaraChat</strong></div></header><main class="wrap"> <nav class="langs" aria-label="语言"> <a href="../" lang="fr" hreflang="fr">Français</a> <a href="../en/" lang="en" hreflang="en">English</a> <a href="../es/" lang="es" hreflang="es">Español</a> <a href="../de/" lang="de" hreflang="de">Deutsch</a> <a href="../it/" lang="it" hreflang="it">Italiano</a> <a href="../pt/" lang="pt" hreflang="pt">Português</a> <a href="../nl/" lang="nl" hreflang="nl">Nederlands</a> <a href="../pl/" lang="pl" hreflang="pl">Polski</a> <a href="../ru/" lang="ru" hreflang="ru">Русский</a> <a href="../uk/" lang="uk" hreflang="uk">Українська</a> <a href="../tr/" lang="tr" hreflang="tr">Türkçe</a> <a href="../ja/" lang="ja" hreflang="ja">日本語</a> <strong lang="zh" aria-current="page">中文</strong> <a href="../ko/" lang="ko" hreflang="ko">한국어</a> </nav> <h1>2000年代的聊天室回来了</h1> <p class="lead">CaraChat用PHP重现了2002年的Caramail聊天小程序：聊天室、私聊、粉色和蓝色的昵称、<span class="rainbow"><span>彩</span><span>虹</span></span>和波浪文字，还有与当年一模一样绘制的表情符号。</p> <a class="play" href="../play/?lang=zh">进入聊天室</a> <figure> <img src="../images/chat.png" alt="CaraChat的 Accueil（首页）聊天室：彩色语句、表情符号、在线名单和标签页" width="1024" height="700"> <figcaption>一个聊天室：彩色语句、彩虹、表情符号、右侧的在场成员，以及一个闪烁橙色的私聊。</figcaption> </figure> <h2>小程序的标签页</h2> <div class="shots"> <figure><img src="../images/rooms.png" alt="Salons 标签页：常驻聊天室，创建公开或私密聊天室" width="1024" height="700" loading="lazy"><figcaption>Salons（聊天室）：常驻聊天室和会员的聊天室，创建聊天室。</figcaption></figure> <figure><img src="../images/search.png" alt="Connecté(e)s 标签页：在线名单，以及按昵称、年龄、性别搜索" width="1024" height="700" loading="lazy"><figcaption>Connecté(e)s（在线）：按昵称，或按城市、年龄和性别搜索。</figcaption></figure> <figure><img src="../images/private.png" alt="带有选项和特殊表情调色板的私聊对话" width="1024" height="700" loading="lazy"><figcaption>一个私聊对话、它的选项和特殊表情符号。</figcaption></figure> <figure class="phone"><img src="../images/phone.png" alt="手机上的CaraChat" width="390" height="760" loading="lazy"><figcaption>在手机上。</figcaption></figure> </div> <h2>回来的内容</h2> <div class="grid"> <div class="card"> <ul> <li><strong>小程序的界面</strong>，原样重绘：Salons（聊天室）、Connecté(e)s（在线）、Options 和 Ami(e)s（好友）标签页，聊天室，以及每个私聊一个标签页（最多20个，有新消息时变橙色），« Dialogue » 和 « Membres du salon »（聊天室成员）面板，« Message privé »（私信），« Pas de nouveaux PVs »（不接受新私聊），« Problème de comportement »（行为问题举报）。</li> <li><strong>手机上</strong>也能用，支持14种语言（默认为浏览器语言，可在 Options 标签页更改）。</li> <li><strong>聊天室</strong>：常驻的和会员创建的，公开或私密；满员（40人）的聊天室会溢出到 « Salon* »。</li> <li><strong>私聊</strong>：双击昵称，或在聊天室输入 <code>/昵称 消息</code>。</li> <li><strong>搜索</strong>：按昵称或城市，可选年龄段和性别。</li> <li><strong>颜色</strong>（12种，包括彩虹）和字号（包括波浪），昵称按资料着色，有人对你说话时你的昵称会加粗。</li> <li><strong>管理</strong>：踢出、呼叫管理员、忽略某人、« 不接受新私聊 »、忙碌。</li> </ul> </div> <figure> <img src="../images/login.png" alt="连接窗口：昵称、年龄、城市、性别和服务器" width="520" height="447"> <figcaption>连接：你的个人资料和服务器。</figcaption> </figure> </div> <h2>原版表情符号</h2> <p>它们不是图片，而是绘图代码：这些代码从小程序中读出，并逐像素重现。眼睛 <code>:;8B%</code>，决定头像的鼻子 <code>-o#!*$</code>（小丑、圣诞老人、啤酒杯、面具……），嘴巴 <code>)(DPO|</code>：<code>:-)</code>, <code>;-)</code>, <code>8-)</code>, <code>:o)</code>, <code>:#)</code>。一个数字可以给脸上色（<code>:-)2</code>），<code>#c</code> / <code>#d</code> 会加上一只手，<code>#00</code> 到 <code>#14</code> 是图画：炸弹、泰迪熊、冷杉、海豚、心 <code>#13</code>……另外，« Smileys » 调色板中的60张图片（汉堡 <code>@00</code>、心 <code>@11</code>、蛋糕 <code>@09</code>……）来自原版的 <code>smiley.gif</code>。</p> <figure> <img src="../images/smileys.png" alt="聊天室里带有手绘表情符号的语句：笑脸、心、冷杉、音符" width="900" height="319"> </figure> <h2>原版使用说明</h2> <p>Caramail实时聊天的在线帮助（1999年），原样保留（法语）：<a href="../aide.html">什么是实时聊天、创建公开或私密聊天室、发送私信（法语帮助）</a>。</p> <h2>服务器</h2> <p>服务器 <strong>CaraChat Serveur</strong> 依据2012年的源码用PHP 8重写，不使用数据库，在 jumphp.net 上的Docker中运行。它完全使用小程序的协议（每帧一行，字段以制表符分隔），可以像当年一样走TCP，也可以走443端口的WebSocket（<code>wss://caramail.jumphp.net/ws</code>）：连接无处不通，即使在防火墙后面。</p> <a class="play" href="../play/?lang=zh">打开CaraChat</a></main><footer class="wrap">CaraChat是用JumPHP制作的非官方重现作品。原版小程序（net.spray.chat，2002年）和PHP服务器 « NewCaraChat »（2012年）归其作者所有。</footer></body></html>