डेवलपर / HTML
HTML व्यूअर: CSS और JavaScript के साथ लाइव sandbox प्रीव्यू
लाइव, अलग प्रीव्यू देखने के लिए HTML और वैकल्पिक CSS पेस्ट करें। JavaScript को स्पष्ट रूप से चालू करें, प्रीव्यू को फ़ुल स्क्रीन में खोलें या HTML प्रीव्यू फ़ाइल डाउनलोड करें।
HTML व्यूअर: CSS और JavaScript के साथ लाइव sandbox प्रीव्यू: यह source को अपारदर्शी origin वाले sandbox फ़्रेम में रेंडर करता है। Scripts डिफ़ॉल्ट रूप से बंद रहते हैं। Content security policy बाहरी संसाधनों, fetch अनुरोधों, forms और embedded pages को ब्लॉक करती है, जबकि inline styles और data images की अनुमति देती है। पेज को रीफ़्रेश कर सकने वाला metadata, base elements और embedded browsing contexts हटा दिए जाते हैं। डाउनलोड में अलग sandbox फ़्रेम बना रहता है। यह आपके ब्राउज़र में 100% स्थानीय रूप से चलता है और सर्वर पर कोई फ़ाइल अपलोड नहीं होती।
- श्रेणी
- डेवलपर टूल्स
- रन
- आपके ब्राउज़र में
- लागत
- मुफ़्त · साइन अप की ज़रूरत नहीं
- उपलब्धता
- इस्तेमाल के लिए तैयार
पूरी तरह आपके ब्राउज़र में चलता है
प्रीव्यू इस साइट से अलग है। स्क्रिप्ट डिफ़ॉल्ट रूप से बंद रहती हैं। बाहरी स्टाइल, स्क्रिप्ट, इमेज, fetch अनुरोध, फ़ॉर्म और एम्बेड किए गए पेज ब्लॉक हैं; इनलाइन स्टाइल और डेटा इमेज की अनुमति है। स्क्रिप्ट सक्षम करने पर प्रीव्यू के अंदर आपके पेस्ट किए गए कोड चलते हैं।
डाउनलोड किया गया HTML उसी अलग किए गए प्रीव्यू को खोलता है। इस पेज में कोई स्रोत शामिल नहीं किया जाता।
फ़्रेम को अलग रखना
WHATWG HTML standard iframe sandbox restrictions (https://html.spec.whatwg.org/multipage/iframe-embed-object.html#attr-iframe-sandbox) परिभाषित करता है। यह preview कभी भी allow-same-origin की अनुमति नहीं देता।
सामग्री प्रतिबंध
W3C Content Security Policy specification resource restrictions (https://www.w3.org/TR/CSP3/) परिभाषित करती है। Preview दिए गए markup से पहले restrictive policy लागू करता है। डाउनलोड किया गया wrapper sandbox boundary बनाए रखता है।
इस्तेमाल करने का तरीका
- HTML और वैकल्पिक CSS या JavaScript पेस्ट करें।
- पेस्ट किए गए कोड को अलग प्रीव्यू में चलाना हो, तभी scripts चालू करें।
- लाइव या फ़ुल स्क्रीन प्रीव्यू देखें, फिर sandbox वाला प्रीव्यू फ़ाइल डाउनलोड करें।
गोपनीयता और सीमाएँ
आपके इनपुट और फ़ाइलों को आपके ब्राउज़र में प्रोसेस किया जाता है। कुछ भी अपलोड नहीं होता।
संबंधित टूल्स
अक्सर पूछे जाने वाले सवाल
क्या मेरा प्रीव्यू इस साइट की cookies या page को ऐक्सेस कर सकता है?
Sandbox same-origin ऐक्सेस नहीं देता। पेस्ट किया गया कोड इस साइट के DOM या storage को पढ़ नहीं सकता। Scripts केवल तभी चलते हैं, जब आप उन्हें चालू करते हैं।
बाहरी images या libraries लोड क्यों नहीं होतीं?
स्थानीय प्रीव्यू remote resources को ब्लॉक करता है। Styles और scripts को editors में सीधे रखें और images के लिए data URLs का इस्तेमाल करें।
क्या मैं पूरा HTML document पेस्ट कर सकता हूँ?
हाँ। प्रीव्यू complete documents और fragments, दोनों स्वीकार करता है। यह metadata और embedded browsing contexts हटाता है, अपनी content security policy लागू करता है और परिणाम को अलग फ़्रेम में रेंडर करता है।
डाउनलोड में क्या शामिल होता है?
इसमें एक HTML फ़ाइल होती है, जो आपके source को उसी sandbox के अंदर खोलती है। यह preview फ़ाइल है, न कि किसी सामान्य page में सीधे पेस्ट किया गया source।
मुफ़्त टूल · आपके ब्राउज़र में बार चलता है · अकाउंट की ज़रूरत नहीं