HTML5 गेम अपनी वेबसाइट पर कैसे होस्ट करें: अपलोड, एम्बेड, ठीक करें

एक वाक्य में HTML5 गेम कैसे होस्ट करें: उसके game/ फ़ोल्डर की सामग्री किसी भी ऐसी वेब होस्ट पर अपलोड करें जो स्टैटिक फ़ाइलें देती हो, सबफ़ोल्डर जैसे हैं वैसे ही रखें, और फ़ोल्डर का पता ब्राउज़र में खोलें। हमारे मार्केटप्लेस के हर संस्करण का होस्टिंग के लिए तैयार game/ फ़ोल्डर बिना बदलाव के चलता है: न PHP, न डेटाबेस, न बिल्ड स्टेप और न कोई खाता, इसलिए होस्ट को बस फ़ाइलें खिलाड़ी के ब्राउज़र तक पहुंचानी होती हैं।

जब सब कुछ ठीक चले, तो पूरा काम बस इतना ही है। यह गाइड उन दूसरे दिनों के बारे में है: खाली स्क्रीन, 404 त्रुटियां, MIME टाइप का संदेश, या एक iframe जो कुछ नहीं दिखाता। हम ये टेम्पलेट बेचते हैं, इसलिए इसे हमारे अपने पैकेजों के लिए एक फ़ील्ड मैनुअल की तरह पढ़ें। हमने Gridspark और Velvet Pool की प्रतियां एक अस्थायी लोकल सर्वर से चलाईं, Gridspark को कई तरीकों से जानबूझकर तोड़ा, और दूसरे संस्करणों के सार्वजनिक मैनुअल पढ़े। जब कोई बात हमारे अपने परीक्षण से नहीं, बल्कि किसी मैनुअल से आई हो, तो हम यह साफ़ बताते हैं।

HTML5 गेम होस्ट करने में असल में क्या लगता है

स्टैटिक होस्ट फ़ाइलें रखता है और अनुरोध आने पर उन्हें ब्राउज़र को देता है। वह गेम नहीं चलाता; गेम खिलाड़ी का ब्राउज़र चलाता है। इसी वजह से हमारे संस्करणों की ज़रूरतें इतनी सीधी हैं: एक आधुनिक ब्राउज़र, एक ऐसी होस्ट जो HTTP या HTTPS पर स्टैटिक फ़ाइलें दे, और खेलने के लिए न PHP, न डेटाबेस, न कोई खाता। game/ फ़ोल्डर पहले से बना हुआ है, इसलिए उसे प्रकाशित करने में न npm लगता है और न बिल्ड स्टेप।

शुरू करने से पहले दो सीमाएं जाननी ज़रूरी हैं। कुछ संस्करणों में ऐसे वैकल्पिक हिस्से हैं जो स्टैटिक नहीं हैं: Zabum और Ricopop में एक वैकल्पिक लीडरबोर्ड है, जिसे PHP 7.4 या नए संस्करण और लिखने योग्य फ़ोल्डर की ज़रूरत है। TypeScript संस्करणों (Beep Out, Pinloop, Trimora, Twirldrop, Riffvolt, Sunset Rally, Tenguin, Mochi Monsters, Deepforge, Barricade Z और Zabum) को सोर्स बदलकर फिर से बनाने के लिए ही Node.js चाहिए; हर मैनुअल में संस्करण लिखा है। Velvet Pool, Puttide, Ricopop और Gridspark सादा JavaScript भेजते हैं, जिसमें आपके बदलावों और अपलोड की गई फ़ाइलों के बीच कोई कम्पाइल स्टेप नहीं है। गेम को जैसा दिया गया है वैसा प्रकाशित करने के लिए इनमें से कुछ भी नहीं चाहिए। होस्टिंग खुद खरीद का हिस्सा नहीं है। स्टोर की शर्तों में आपके सर्वर पर होस्टिंग और इंस्टॉलेशन उन अलग सेवाओं में गिने गए हैं जिनका हम कोई भी काम शुरू करने से पहले अनुमान देते हैं; सपोर्ट में दी गई फ़ाइलों को इंस्टॉल करने और इस्तेमाल करने के सवाल आते हैं।

क्या अपलोड होता है, और क्या आपके कंप्यूटर पर रहता है:

• game/ के अंदर की हर चीज़ अपलोड करें: index.html, स्क्रिप्ट, स्टाइल, इमेज, साउंड और फ़ॉन्ट।
• source/ (संपादन योग्य डेवलपर कॉपी), documentation/ (मैनुअल) और ZIP फ़ाइल खुद छोड़ दें। Zabum मैनुअल बताता है कि गलती से source/ अपलोड करना main.tsx जैसी 404 त्रुटियों का कारण बनता है।
• पैकेज के साथ आने वाली थर्ड-पार्टी लाइसेंस सूचनाएं अपने उत्पाद के साथ रखें, जैसा शर्तें मांगती हैं।

Gridspark देखें, वह संस्करण जिसे हम उदाहरण के तौर पर लेते हैं

HTML5 गेम कैसे होस्ट करें: ZIP से चलने वाले पेज तक का छोटा रास्ता

ये चरण Velvet Pool, Puttide, Gridspark और Sunset Rally मैनुअल के इंस्टॉलेशन अध्यायों पर आधारित हैं, साथ में हमारे जोड़े गए परीक्षण भी। Gridspark उदाहरण है, क्योंकि यह वह संस्करण है जिसे हमने सबसे ज़्यादा चलाया और सबसे ज़्यादा तोड़ा।

1. पैकेज को अपने कंप्यूटर पर अनज़िप करें। वहां game/ (जिसे आप प्रकाशित करते हैं), source/ (संपादन योग्य कॉपी) और documentation/ (मैनुअल) मिलेंगे।
2. ज़रूरी नहीं, पर सस्ता उपाय: स्थानीय रूप से जांचें। game/ के अंदर टर्मिनल खोलें, python -m http.server 8765 चलाएं और http://localhost:8765/ खोलें। अगर वहां गेम चलता है, तो फ़ाइलें सही हैं और बाद की कोई भी समस्या होस्ट की होगी।
3. अभी अंतिम पता चुनें, उदाहरण के लिए https://your-site.example/games/gridspark/। सबफ़ोल्डर चलता है, क्योंकि गेम के अंदर के रास्ते सापेक्ष (relative) हैं; Gridspark मैनुअल public_html/games/gridspark/ सुझाता है।
4. game/ की सामग्री उस फ़ोल्डर में अपलोड करें, अपनी होस्ट की फ़ाइल मैनेजर या FTP क्लाइंट से, हर सबफ़ोल्डर को वैसा ही रखते हुए। index.html सीधे फ़ोल्डर के अंदर होना चाहिए, एक स्तर नीचे नहीं।
5. फ़ोल्डर का पता https पर अंत के स्लैश के साथ खोलें। Gridspark में स्टार्ट स्क्रीन पर टैप करें (ब्राउज़र ऑडियो चलाने से पहले एक टच या क्लिक का इंतज़ार करते हैं) और Play दबाएं।
6. एक चाल चलें, पेज रीलोड करें और जांचें कि मेन्यू में Continue दिखता है। इससे साबित होता है कि ब्राउज़र आपके पते के लिए प्रगति सहेज रहा है।
7. अपनी साइट से फ़ोल्डर का लिंक दें, या उसे किसी पेज में एम्बेड करें (नीचे iframe वाला भाग देखें)।

पूरा हो चुका Gridspark फ़ोल्डर index.html, style.css, gridspark.config.js, src/ और assets/ को साथ-साथ रखता है, और मैनुअल कहता है कि उन्हें साथ रखें। बाकी संस्करणों का ढांचा अलग है (Velvet Pool में एक स्टाइल शीट की जगह css/ और assets/ हैं), पर नियम वही है: फ़ोल्डर को जैसा है वैसा अपलोड करें।

डबल-क्लिक करने पर index.html खाली पेज क्यों दिखाता है

हमने जिन संस्करणों को खोला, उनका कोड ES modules के रूप में लोड होता है, और ब्राउज़र file:// पतों से मॉड्यूल लोड करने से मना करते हैं। हमने Chromium में Gridspark को सीधे डिस्क से खोला और एक काली, खाली स्क्रीन मिली। कंसोल ने बताया कि स्क्रिप्ट CORS पॉलिसी से ब्लॉक हुई, कारण था "Cross origin requests are only supported for protocol schemes", जैसे http और https। वही फ़ोल्डर जब लोकल वेब सर्वर से चला, तो स्टार्ट स्क्रीन तुरंत दिखी। Velvet Pool, Puttide, Sunset Rally और Gridspark, चारों मैनुअल भी यही कहते हैं: गेम को file:// से न खोलें।

• काम नहीं करेगा: file:///C:/Users/you/games/gridspark/index.html
• काम करेगा: स्थानीय टेस्ट सर्वर से http://localhost:8765/, या आपकी होस्ट पर https://your-site.example/games/gridspark/।

हमने केवल Chromium पर परीक्षण किया। मैनुअल इस रुकावट को ऐसी चीज़ बताते हैं जो आम ब्राउज़र करते हैं, इसलिए हर जगह इसकी योजना बनाकर रखें।

iframe से गेम को पेज में एम्बेड करें

जो पेज आपके पास पहले से है, उसके अंदर गेम दिखाने के लिए iframe को अपलोड किए गए फ़ोल्डर की ओर इंगित करें। यह वह टैग है जिसका हमने परीक्षण किया:

<iframe src="https://your-site.example/games/gridspark/" title="Gridspark" allow="fullscreen; autoplay" width="960" height="540" style="border:0"></iframe>

• src: फ़ोल्डर का पूरा पता, https के साथ और अंत के स्लैश के साथ।
• title: एक छोटा नाम। स्क्रीन रीडर इसी से फ़्रेम का वर्णन करते हैं।
• allow="fullscreen; autoplay": मैनुअल कहते हैं कि ज़रूरत हो तो iframe में fullscreen और autoplay की अनुमति दें। हमारे परीक्षण में, दूसरे पते के फ़्रेम में यह न होने पर fullscreen बंद था, और Gridspark ने अपना fullscreen बटन बस छिपा दिया। पुराने allowfullscreen एट्रिब्यूट का नतीजा allow जैसा ही निकला। जो फ़्रेम पेज वाले ही पते पर है, उसे दोनों तरीकों से fullscreen मिलता है।
• कोई sandbox एट्रिब्यूट नहीं। अकेले sandbox="allow-scripts" के साथ Gridspark कभी शुरू नहीं हुआ: फ़्रेम को null origin मिला, ब्राउज़र ने गेम की अपनी स्क्रिप्ट ब्लॉक की और लोकल स्टोरेज ने सुरक्षा त्रुटि फेंकी। allow-same-origin जोड़ने से यह चला, पर MDN चेतावनी देता है कि same-origin फ़्रेम पर यह जोड़ी सुरक्षा हटा देती है, इसलिए जिस गेम को आप खुद होस्ट करते हैं, उसमें sandbox न रखें।

फ़ोन के लिए आकार तय करें

एक तय 16:9 बॉक्स डेस्कटॉप पर सही दिखता है और फ़ोन पर गलत। 390 px चौड़े फ़ोन पर aspect-ratio 16/9 वाला iframe सिर्फ़ 219 px ऊंचा होता है, और Gridspark का मेन्यू Daily challenge बटन के नीचे कट गया। फ़्रेम की ऊंचाई 75svh (स्क्रीन की ऊंचाई का तीन-चौथाई) करने पर पूरा मेन्यू दिखा। आपके अपने पेज को भी viewport meta टैग चाहिए; हमने जिन छह पैकेजों को खोला, उनमें से हर एक अपने index.html में यह टैग रखता है, इसी से गेम सीधे खोलने पर स्केल होता है।

गेम अपने पते पर बिना किसी पेज के चलता है, इसलिए वह सादा लिंक जो उसी पते को खोलता है, हमेशा एक वैध विकल्प है।

Velvet Pool देखें, एक 3D संस्करण जो उसी तरह एम्बेड होता है

WordPress और दूसरे साइट बिल्डर

फ़ोल्डर को होस्ट करना और उसे किसी पेज पर दिखाना दो अलग काम हैं, और WordPress में इनके लिए दो अलग औज़ार हैं। नीचे सब कुछ WordPress दस्तावेज़ीकरण और डेवलपर रेफ़रेंस से है; हमने खुद WordPress चलाकर इसे नहीं जांचा।

1. फ़ोल्डर को अपनी होस्ट की फ़ाइल मैनेजर या FTP से साइट के फ़ोल्डर ट्री में अपलोड करें (जैसे WordPress फ़ोल्डरों के पास एक games/ फ़ोल्डर)। मीडिया लाइब्रेरी से नहीं: WordPress का कोड .html और .js को अनुमत अपलोड प्रकारों से हटा देता है, जब तक उपयोगकर्ता के पास unfiltered_html क्षमता न हो।
2. किसी पेज को छूने से पहले फ़ोल्डर का पता अकेले खोलें। WordPress के दस्तावेज़ में दिए डिफ़ॉल्ट Apache नियम index.php को अनुरोध तभी भेजते हैं जब कोई मेल खाती फ़ाइल या फ़ोल्डर न हो (यही !-f और !-d शर्तें जांचती हैं), इसलिए अपलोड किया गया फ़ोल्डर जैसा है वैसा ही परोसा जाता है।
3. iframe को Custom HTML ब्लॉक में जोड़ें। WordPress दस्तावेज़ बताता है कि जिन उपयोगकर्ताओं के पास unfiltered_html क्षमता नहीं है, जैसे Contributor, उनके सेव किए पोस्ट से iframe टैग हटा दिए जाते हैं। अगर सेव करने के बाद फ़्रेम गायब हो जाए, तो जांचें कि पेज किसने संपादित किया।

दूसरे साइट बिल्डर और CMS: हमने उनका परीक्षण नहीं किया और उनके बारे में कोई दावा नहीं करते। गेम को हर जगह एक ही दो चीज़ें चाहिए: अपलोड किए गए फ़ोल्डर के लिए जगह, और एक एम्बेड एलिमेंट जो iframe स्वीकार करे। अगर कोई बिल्डर इन दोनों में से कुछ नहीं देता, तो फ़ोल्डर को कहीं भी होस्ट करें जो स्टैटिक फ़ाइलें देता हो, और उसके पते का लिंक दें।

शुरू न होने पर: समस्या-निवारण सूची

कुछ भी बदलने से पहले ब्राउज़र के डेवलपर टूल्स खोलें (ज़्यादातर डेस्कटॉप ब्राउज़रों में F12) और Console व Network टैब देखें। नीचे की हर विफलता वहां एक लाल लाइन छोड़ती है, और उसमें फ़ाइल का नाम आम तौर पर कारण की ओर इशारा करता है।

खाली स्क्रीन

इस क्रम में जांचें: पता http:// या https:// से शुरू होता है; कंसोल में कोई लाल लाइन नहीं है; फ़ाइल नाम अपने सटीक बड़े और छोटे अक्षरों में हैं; और 3D संस्करणों के लिए WebGL2 उपलब्ध है (Velvet Pool मैनुअल हार्डवेयर एक्सेलरेशन चालू करने को कहता है)। Linux होस्ट Game.js और game.js को दो अलग फ़ाइलें मानते हैं और Windows नहीं, इसलिए जो फ़ोल्डर आपके PC पर चला, वह अपलोड के बाद टूट सकता है। Velvet Pool और Zabum, दोनों मैनुअल अक्षरों के आकार को लेकर चेतावनी देते हैं।

src/main.js, फ़ॉन्ट या इमेज के लिए 404

फ़ोल्डर का कुछ हिस्सा नहीं पहुंचा, या वह एक स्तर ज़्यादा गहराई में चला गया। हमने इसे दोहराया: सिर्फ़ index.html, style.css और कॉन्फ़िग फ़ाइल अपलोड करने पर स्क्रीन खाली रही, और Network टैब ने src/main.js और हर फ़ॉन्ट के लिए 404 दिखाए। गायब फ़ोल्डर अपलोड करें, या सामग्री को ऊपर ले जाएं ताकि index.html उसी पते पर हो जिसे आप खोलते हैं। अगर इमेज या साउंड गायब या खराब हैं, तो Zabum मैनुअल FTP को binary या auto मोड में चलाने, या ZIP अपलोड करके होस्ट की फ़ाइल मैनेजर में अनज़िप करने का सुझाव देता है। 404 का मतलब गायब फ़ाइल है। यह MIME समस्या नहीं है।

बिना स्टाइल वाला पेज, बड़े आइकन

अगर कोई rewrite या क्लीन-URL सेटिंग फ़ोल्डर को अंत के स्लैश के बिना परोसती है, तो सापेक्ष रास्ते एक स्तर ऊपर हल होते हैं। हमने इसे एक परीक्षण सर्वर से दोहराया जो बिना रीडायरेक्ट के फ़ोल्डर पेज लौटाता है। ब्राउज़र ने /games/style.css और /games/src/main.js मांगे, न कि /games/gridspark/ के अंदर की फ़ाइलें; उसे 404 मिले, और मेन्यू सादे बटनों और बड़े आइकनों के रूप में दिखा। फ़ोल्डर का लिंक अंत के स्लैश के साथ दें, या सीधे index.html की ओर इशारा करें।

मॉड्यूल स्क्रिप्ट पर MIME टाइप त्रुटि

हमारे परीक्षण में कंसोल ने लिखा: Failed to load module script: Expected a JavaScript-or-Wasm module script but the server responded with a MIME type of "text/plain"। ब्राउज़र मॉड्यूल स्क्रिप्ट के मामले में सख्त होते हैं। मैनुअल कहते हैं कि सर्वर .js फ़ाइलें JavaScript MIME टाइप के साथ और .wasm को application/wasm के रूप में भेजे; Sunset Rally मैनुअल .mjs भी जोड़ता है। Network टैब हर फ़ाइल का Content-Type दिखाता है। हमने जिन बिल्ड्स को खोला, उनमें मॉड्यूल .js फ़ाइलें हैं। अगर आप अपनी .mjs फ़ाइलें जोड़ते हैं और कोई पुराना Apache कॉन्फ़िगरेशन उन्हें मैप नहीं करता, तो .htaccess की एक पंक्ति इसे ठीक करती है, वही जो हमारी अपनी साइट इस्तेमाल करती है:

AddType text/javascript .mjs

हमारे परीक्षण मशीन के Apache 2.4.62 टाइप टेबल में js और mjs पहले से text/javascript पर, और wasm application/wasm पर मैप हैं, इसलिए स्टॉक इंस्टॉल को यह पंक्ति नहीं चाहिए। दूसरे सर्वर अपनी अलग टेबल रखते हैं; अपने सर्वर के मालिक से पूछें।

CORS पॉलिसी से ब्लॉक

दूसरे पते से लोड होने वाली मॉड्यूल स्क्रिप्ट और फ़ॉन्ट को उस पते से Access-Control-Allow-Origin हेडर चाहिए। हमारे परीक्षण में, एक पोर्ट पर चलता पेज दूसरे पोर्ट से मॉड्यूल स्क्रिप्ट तब तक लोड नहीं कर सका, जब तक दूसरे सर्वर ने हेडर नहीं भेजा। व्यवहार में हल सीधा है: गेम की फ़ाइलें एक ही पते पर एक फ़ोल्डर में रखें, जैसे पैकेज बने हैं। किसी दूसरी साइट पर iframe में गेम एम्बेड करने के लिए CORS की ज़रूरत नहीं, क्योंकि iframe बस गेम का पता लोड करता है। एम्बेड के अंदर CORS त्रुटि आम तौर पर ऊपर बताए sandbox एट्रिब्यूट से आती है।

https पेज पर मिक्स्ड कंटेंट

https पर परोसा गया पेज http पर स्क्रिप्ट या iframe लोड नहीं कर सकता: ब्राउज़र दोनों को ब्लॉक करते हैं, और MDN फ़ॉन्ट और fetch अनुरोधों को भी ब्लॉक होने वाले प्रकारों में गिनता है। iframe के src में और जो भी पूरा पता आप लिखें, उसमें https:// इस्तेमाल करें। गेम की अपनी फ़ाइलें सापेक्ष रास्ते इस्तेमाल करती हैं, इसलिए वे आपके खोले गए पते का स्कीम मानती हैं। अगर https पता बिल्कुल नहीं खुलता, तो पहले अपनी होस्ट के पैनल में सर्टिफ़िकेट चालू करें।

iframe कहता है "refused to connect"

हमारे परीक्षण में Chromium ने यह लाइन लिखी, जिसमें ब्लॉक हुए फ़्रेम का पता पहले उद्धरण चिह्नों में था: Refused to display 'https://game-host.example/' in a frame because it set 'X-Frame-Options' to 'sameorigin'। गेम होस्ट करने वाला सर्वर वह हेडर भेज रहा था। SAMEORIGIN केवल उसी पते से एम्बेड की अनुमति देता है, और DENY कभी अनुमति नहीं देता; Content-Security-Policy हेडर में frame-ancestors नियम भी लगभग यही काम करता है। गेम के फ़ोल्डर के लिए हेडर बदलें, या पेज और गेम को एक ही पते से परोसें।

शुरुआत में कोई ऑडियो नहीं

ब्राउज़र पहले टैप या क्लिक तक ऑडियो ब्लॉक रखते हैं, इसीलिए Gridspark टैप-टू-स्टार्ट स्क्रीन के साथ खुलता है। एक बार टैप करें, फिर वॉल्यूम और ब्राउज़र की अनुमतियां जांचें।

Puttide देखें, गोल्फ़ संस्करण जिसका होस्टिंग-तैयार बिल्ड है

पूरी तरह पुराने हुए बिना गेम अपडेट करना

ब्राउज़र स्क्रिप्ट कैश करते हैं, इसलिए अपलोड के बाद आप या कोई खिलाड़ी अब भी पुराना गेम देख सकता है। Gridspark मैनुअल का नियम: अपने बदलावों का बैकअप लें, चलने योग्य फ़ाइलें एक साथ एक सेट में बदलें, परीक्षण करें, और अगर होस्ट पुराने मॉड्यूल कैश करता है तो हार्ड-रीफ़्रेश करें। पुराने और नए मॉड्यूल मिलाएं नहीं। कई छोटी फ़ाइलों से बना गेम, जो एक-दूसरे को इम्पोर्ट करती हैं, उसे आधा अपडेट करना गलत है।

जिन संस्करणों में service worker है, उनका अपना कैश होता है। Zabum एक PWA है: अपडेट के बाद हार्ड-रीफ़्रेश करें (Ctrl या Cmd के साथ Shift और R)। अगर आपने ऑडियो फ़ाइलें बदली हैं, तो sw.js में कैश का नाम बदलें (मैनुअल का उदाहरण zabum-v5 से zabum-v6 तक जाता है) और वह फ़ाइल अपलोड करें। अगर आपकी साइट CDN के पीछे है, तो उसका कैश भी साफ़ करें। जो मैनुअल हमने पढ़े, उनमें Zabum ही PWA है; Velvet Pool और Puttide मैनुअल साफ़ कहते हैं कि उनका ऐप इंस्टॉल होने वाला ऑफ़लाइन ऐप नहीं है।

फ़ाइलें बदलने से पहले चेंजलॉग पढ़ें, और जो भी आपने संपादित किया है उसकी कॉपी रखें। सेव किया गया डेटा अपलोड की गई फ़ोल्डर में नहीं, हर खिलाड़ी के ब्राउज़र में रहता है, इसलिए फ़ाइलें बदलने से वह नहीं मिटता।

Zabum देखें, PWA संस्करण जिसमें वैकल्पिक PHP लीडरबोर्ड है

प्रगति कहां सहेजी जाती है, और ब्राउज़र साफ़ करने से क्या होता है

इन संस्करणों में कोई खाता या सर्वर डेटाबेस नहीं है। सेटिंग्स, भाषा, चालू रन और निजी सर्वोत्तम स्कोर ब्राउज़र के local storage में रहते हैं, और कुछ भी Polar Games को नहीं भेजा जाता। Gridspark मैनुअल कुंजियों के नाम gridspark.standalone.v1.* बताता है; एक चाल के बाद हमने gridspark.standalone.v1.best और gridspark.standalone.v1.save देखे।

स्टोरेज पते (प्रोटोकॉल, होस्ट और पोर्ट) से जुड़ा होता है, फ़ोल्डर से नहीं। हमने इसे तीन तरीकों से जांचा। उसी पते के दूसरे फ़ोल्डर में Gridspark की एक कॉपी ने वही सहेजे मान पढ़े। वही गेम 127.0.0.1 की जगह localhost के रूप में खुला, तो वह खाली शुरू हुआ, और उसी पते के दूसरे पोर्ट पर भी यही हुआ। Zabum मैनुअल जोड़ता है कि http और https, www और बिना www, और सबडोमेन, हर एक का अपना स्टोरेज होता है।

• साइट डेटा या कुकीज़ साफ़ करने से सहेजा गया गेम और रिकॉर्ड मिट जाते हैं। निजी विंडो में प्रगति सिर्फ़ सेशन भर रह सकती है; स्टोरेज ब्लॉक होने पर भी गेम चलता रहता है।
• दूसरा ब्राउज़र या दूसरा डिवाइस शून्य से शुरू करता है। कोई सिंक नहीं और साइन-इन करने के लिए कोई खाता नहीं।
• पता बदलने पर सब रीसेट होता है: http से https, www से बिना www, या नया डोमेन।
• उसी पते के दूसरे फ़ोल्डर में गेम ले जाने से सेव बचे रहते हैं, जैसा हमारे Gridspark परीक्षण ने दिखाया।

साझा करने से पहले परीक्षण सूची

1. अंतिम पते को उन ब्राउज़रों में खोलें जिन्हें आपके खिलाड़ी इस्तेमाल करते हैं: Chromium आधारित (Chrome या Edge), Firefox और Safari। हमारे अपने परीक्षण सिर्फ़ Chromium में चले, इसलिए यह सूची आपके चलाने के लिए है।
2. असली फ़ोन पर खोलें, पहले गेम के अपने पते पर और फिर अपने पेज के अंदर, दोनों दिशाओं में।
3. डेवलपर टूल्स में कनेक्शन थ्रॉटल करें और पहली लोडिंग देखें। Gridspark, हमारे लोकल सर्वर से बिना कम्प्रेशन के परोसा गया, स्टार्ट स्क्रीन तक पहुंचने के लिए लगभग 0.5 MB और 26 अनुरोध लेता है। Chromium को 1.6 Mbit/s और 150 ms लेटेंसी पर थ्रॉटल करने पर स्क्रीन लगभग 3 सेकंड में दिखी। हमारी प्रति में पूरा game/ फ़ोल्डर लगभग 3.4 MB है; Velvet Pool लगभग 7.3 MB और Puttide लगभग 15 MB। अगर पुराने फ़ोन संघर्ष करते हैं, तो Zabum मैनुअल सुझाता है कि जांचें आपकी होस्ट फ़ाइलें gzip या brotli से कम्प्रेस करती है या नहीं।
4. एक चाल चलें, रीलोड करें, और पक्का करें कि Continue और सर्वोत्तम स्कोर वहां हैं।
5. एक बार टैप करें और जांचें कि ऑडियो शुरू होता है। पहले टैप से पहले की खामोशी सामान्य है।
6. निजी विंडो खोलें। गेम फिर भी चलना चाहिए, भले ही बंद करने पर वह प्रगति भूल जाए।
7. पहली लोडिंग पर Console और Network टैब पढ़ें: कोई लाल लाइन नहीं, कोई 404 नहीं।
8. एम्बेड में जांचें कि fullscreen बटन दिखता है और फ़ोन पर फ़्रेम काफ़ी ऊंचा है।

अक्सर पूछे जाने वाले प्रश्न

क्या HTML5 गेम होस्ट करने के लिए PHP, डेटाबेस या कोई खास सर्वर चाहिए?

हमारे संस्करणों को जैसा दिया गया है, उनके लिए नहीं। ये स्टैटिक हैं: game/ फ़ोल्डर को ऐसी होस्ट पर अपलोड करें जो HTTP या HTTPS पर फ़ाइलें देती हो, और उसे खोलें। Zabum और Ricopop में वैकल्पिक लीडरबोर्ड है, जिसे PHP 7.4 या नए संस्करण और लिखने योग्य फ़ोल्डर की ज़रूरत है।

क्या मैं सिर्फ़ index.html पर डबल-क्लिक कर सकता हूं?

नहीं। ब्राउज़र file:// पर गेम मॉड्यूल ब्लॉक करते हैं, और पेज खाली रहता है। गेम को http या https पते से खोलें: अपनी होस्ट से, या python -m http.server 8765 जैसे स्थानीय टेस्ट सर्वर से।

क्या मुझे HTTPS चाहिए?

मैनुअल सार्वजनिक होस्टिंग के लिए HTTPS इस्तेमाल करने को कहते हैं। Zabum मैनुअल कहता है कि Add to home screen को इसकी ज़रूरत है, और https पेज कोई http iframe एम्बेड नहीं कर सकता, क्योंकि ब्राउज़र उसे मिक्स्ड कंटेंट मानकर ब्लॉक करते हैं।

WordPress पेज में गेम कैसे जोड़ूं?

फ़ोल्डर को अपनी होस्ट की फ़ाइल मैनेजर या FTP से अपलोड करें, उसका पता खोलकर पक्का करें कि वह चलता है, फिर iframe को Custom HTML ब्लॉक में जोड़ें। जिन उपयोगकर्ताओं के पास unfiltered_html क्षमता नहीं है, उनके iframe हटा दिए जाते हैं, इसलिए पेज संपादित करने वाले की भूमिका जांचें।

प्रगति कहां सहेजी जाती है, और अगर खिलाड़ी ब्राउज़र डेटा साफ़ कर दें तो?

ब्राउज़र के local storage में, हर पते के हिसाब से। साइट डेटा साफ़ करने से वह मिट जाता है, दूसरा ब्राउज़र या डिवाइस खाली शुरू करता है, और डोमेन बदलने या http और https के बीच जाने से वह रीसेट होता है। कोई खाता नहीं है और कुछ भी हमें नहीं भेजा जाता।

क्या Polar Games मेरे लिए गेम होस्ट करती है?

नहीं। स्टोर फ़ाइलें बेचता है। सपोर्ट उन्हें इंस्टॉल और इस्तेमाल करने के सवालों में मदद करता है; आपके सर्वर पर होस्टिंग और इंस्टॉलेशन अलग सेवाएं हैं, जिनका अनुमान हम कोई भी काम शुरू करने से पहले देते हैं।

अगला कदम

अगर आप अब भी अपनी वेबसाइट के लिए HTML5 गेम चुन रहे हैं, तो हर आइटम के पेज पर उसकी ज़रूरतें लिखी हैं, उसका मैनुअल लिंक है, और खरीदने से पहले आप डेमो चला सकते हैं। पहले इंस्टॉलेशन अध्याय पढ़ें: इस गाइड में काम के लिए यही पन्ना आपके काम आएगा।

HTML5 गेम टेम्पलेट ब्राउज़ करें