diff --git a/README.md b/README.md index b2b7c887..98040dd4 100644 --- a/README.md +++ b/README.md @@ -79,24 +79,22 @@ Configuration takes place in the environment variables that are defined in ecosy #### Optional Configuration -| Variable | Description | Example | -|-------------------|:--------------------------------------|--------------------| -| ASSET_SERVER | URL for assets | "http://localhost" | -| USE_PROXYCHECK | Check users for Proxies | 0 | -| APISOCKET_KEY | Key for API Socket for SpecialAccess™ | "SDfasife3" | -| ADMIN_IDS | Ids of users with Admin rights | "1,12,3" | -| CAPTCHA_METHOD | 0: none, 1: reCaptcha, 2: hCaptcha | 2 | -| CAPTCHA_SECRET | re/hCaptcha secret key | "asdieewff" | -| CAPTCHA_SITEKEY | re/hCaptcha site key | "23ksdfssd" | -| CAPTCHA_TIME | time in minutes between captchas | 30 | -| SESSION_SECRET | random sting for express sessions | "ayylmao" | -| LOG_MYSQL | if sql queries should get logged | 0 | -| USE_XREALIP | see ngins / CDN section | 1 | -| BACKUP_URL | url of backup server (see Backup) | "http://localhost" | -| BACKUP_DIR | mounted directory of backup server | "/mnt/backup/" | -| GMAIL_USER | gmail username if used for mails | "ppfun@gmail.com" | -| GMAIL_PW | gmail password if used for mails | "lolrofls" | -| HOURLY_EVENT | run hourly void event on main canvas | 1 | +| Variable | Description | Example | +|-------------------|:--------------------------------------|-------------------------| +| ASSET_SERVER | URL for assets | "http://localhost" | +| USE_PROXYCHECK | Check users for Proxies | 0 | +| APISOCKET_KEY | Key for API Socket for SpecialAccess™ | "SDfasife3" | +| ADMIN_IDS | Ids of users with Admin rights | "1,12,3" | +| CAPTCHA_URL | URL where captcha is served | "http://localhost:8080" | +| CAPTCHA_TIME | time in minutes between captchas | 30 | +| SESSION_SECRET | random sting for express sessions | "ayylmao" | +| LOG_MYSQL | if sql queries should get logged | 0 | +| USE_XREALIP | see ngins / CDN section | 1 | +| BACKUP_URL | url of backup server (see Backup) | "http://localhost" | +| BACKUP_DIR | mounted directory of backup server | "/mnt/backup/" | +| GMAIL_USER | gmail username if used for mails | "ppfun@gmail.com" | +| GMAIL_PW | gmail password if used for mails | "lolrofls" | +| HOURLY_EVENT | run hourly void event on main canvas | 1 | Notes: diff --git a/deployment/example-ecosystem-captchas.yml b/deployment/example-ecosystem-captchas.yml index 107fd8b3..f98120f5 100644 --- a/deployment/example-ecosystem-captchas.yml +++ b/deployment/example-ecosystem-captchas.yml @@ -3,6 +3,6 @@ apps: name : 'captchas' node_args: --nouse-idle-notification --expose-gc env: - PORT: 80 + PORT: 8080 HOST: "localhost" REDIS_URL: 'redis://localhost:6379' diff --git a/src/captchaserver.js b/src/captchaserver.js index 5ba5a451..1ea20a15 100644 --- a/src/captchaserver.js +++ b/src/captchaserver.js @@ -8,7 +8,7 @@ import process from 'process'; import http from 'http'; import ppfunCaptcha from 'ppfun-captcha'; -const PORT = process.env.PORT || 80; +const PORT = process.env.PORT || 8080; const HOST = process.env.HOST || 'localhost'; const server = http.createServer((req, res) => { @@ -25,7 +25,7 @@ const server = http.createServer((req, res) => { const ip = req.headers['x-real-ip'] || req.connection.remoteAddress; console.log(`Serving ${captcha.text} to ${ip}`); res.writeHead(200, { - 'Content-Type': 'text/html', + 'Content-Type': 'image/svg+xml', 'Cache-Control': 'no-cache', }); res.write(captcha.data); diff --git a/src/components/Alert.jsx b/src/components/Alert.jsx index c18ee30f..242db59a 100644 --- a/src/components/Alert.jsx +++ b/src/components/Alert.jsx @@ -3,9 +3,10 @@ * @flow */ -import React, { useState, useEffect } from 'react'; +import React, { useState, useEffect, useCallback } from 'react'; import { useSelector, useDispatch } from 'react-redux'; +import Captcha from './Captcha'; import { closeAlert } from '../actions'; const Alert = () => { @@ -20,9 +21,9 @@ const Alert = () => { } = useSelector((state) => state.alert); const dispatch = useDispatch(); - const close = () => { + const close = useCallback(() => { dispatch(closeAlert()); - }; + }, [dispatch]); const onTransitionEnd = () => { if (!alertOpen) setRender(false); @@ -54,12 +55,16 @@ const Alert = () => { {alertMessage}

- + {(alertType === 'captcha') + ? + : ( + + )}

diff --git a/src/components/Captcha.jsx b/src/components/Captcha.jsx index 78f97f8d..73c2a5c8 100644 --- a/src/components/Captcha.jsx +++ b/src/components/Captcha.jsx @@ -2,10 +2,74 @@ * @flow */ -import React from 'react'; +import React, { useState } from 'react'; import { t } from 'ttag'; -const Captcha = ({ -}) => ( - div /> -); +import { IoReloadCircleSharp } from 'react-icons/io5'; + +function getUrl() { + return `${window.ssv.captchaurl}/captcha.svg?${new Date().getTime()}`; +} + +const Captcha = ({ callback, cancel }) => { + const [captchaUrl, setCaptchaUrl] = useState(getUrl()); + const [text, setText] = useState(''); + const [error, setError] = useState(false); + + return ( +
+

+ {t`Type the characters from the following image:`} + + ({t`Tip: Not case-sensitive; I and l are the same`}) + +

+ setError(true)} + /> +

+ {t`Can't read? Reload:`}  + setCaptchaUrl(getUrl())} + > + + +

+ { + const txt = evt.target.value; + setText(txt); + if (callback) callback(txt); + }} + /> + {(!callback) && ( +
+ + +
+ )} +
+ ); +}; + +export default React.memo(Captcha); diff --git a/src/components/ChatBox.jsx b/src/components/ChatBox.jsx index 0fa3c12c..df0b9eef 100644 --- a/src/components/ChatBox.jsx +++ b/src/components/ChatBox.jsx @@ -25,7 +25,7 @@ const ChatBox = () => { }, 10); }, [chatOpen]); - const onTransitionEnd =() => { + const onTransitionEnd = () => { if (!chatOpen) setRender(false); }; @@ -44,6 +44,6 @@ const ChatBox = () => { ) ); -} +}; export default React.memo(ChatBox); diff --git a/src/components/HelpModal.jsx b/src/components/HelpModal.jsx index 2729be31..4af09dac 100644 --- a/src/components/HelpModal.jsx +++ b/src/components/HelpModal.jsx @@ -90,20 +90,6 @@ can be downloaded from mega.nz here: `}crazygames.com

- { (typeof window.hcaptcha === 'undefined') - ? ( -

- - {jt`This site is protected by reCAPTCHA and the Google ${reCaptchaPP} and ${reCaptchaTOS} apply.`} - -

- ) : ( -

- - {jt`This site is protected by hCAPTCHA and its ${hCaptchaPP} and ${hCaptchaTOS} apply.`} - -

- )}

); }; diff --git a/src/components/SignUpForm.jsx b/src/components/SignUpForm.jsx index 153ebdfa..74a16509 100644 --- a/src/components/SignUpForm.jsx +++ b/src/components/SignUpForm.jsx @@ -121,6 +121,7 @@ class SignUpForm extends React.Component { this.setState({ name: evt.target.value })} type="text" placeholder={t`Name`} @@ -128,6 +129,7 @@ class SignUpForm extends React.Component { this.setState({ email: evt.target.value })} type="text" placeholder={t`Email`} @@ -135,6 +137,7 @@ class SignUpForm extends React.Component { this.setState({ password: evt.target.value })} type="password" placeholder={t`Password`} @@ -142,6 +145,7 @@ class SignUpForm extends React.Component { this.setState({ confirmPassword: evt.target.value, })} diff --git a/src/core/config.js b/src/core/config.js index b807ac66..521ab2db 100644 --- a/src/core/config.js +++ b/src/core/config.js @@ -20,6 +20,8 @@ export const TILE_FOLDER = path.join(__dirname, `./${TILE_FOLDER_REL}`); export const ASSET_SERVER = process.env.ASSET_SERVER || '.'; +export const CAPTCHA_URL = process.env.CAPTCHA_URL || 'http://localhost:8080'; + export const USE_XREALIP = process.env.USE_XREALIP || false; export const BACKUP_URL = process.env.BACKUP_URL || null; @@ -86,12 +88,6 @@ export const auth = { }, }; -// o: none -// 1: reCaptcha -// 2: hCaptcha -export const CAPTCHA_METHOD = Number(process.env.CAPTCHA_METHOD || 0); -export const CAPTCHA_SECRET = process.env.CAPTCHA_SECRET || false; -export const CAPTCHA_SITEKEY = process.env.CAPTCHA_SITEKEY || false; // time on which to display captcha in minutes export const CAPTCHA_TIME = parseInt(process.env.CAPTCHA_TIME, 10) || 30; diff --git a/src/ssr-components/Html.jsx b/src/ssr-components/Html.jsx index 8d7dbe28..02e3b7e7 100644 --- a/src/ssr-components/Html.jsx +++ b/src/ssr-components/Html.jsx @@ -11,7 +11,6 @@ /* eslint-disable max-len */ import React from 'react'; -import { CAPTCHA_METHOD, CAPTCHA_SITEKEY } from '../core/config'; const Html = ({ title, @@ -48,10 +47,6 @@ const Html = ({ dangerouslySetInnerHTML={{ __html: style.cssText }} /> ))} - {(CAPTCHA_METHOD === 1) && CAPTCHA_SITEKEY && useCaptcha - &&