मेरे पास एक रिएक्ट ऐप है जहां मैं उपयोगकर्ता को <script> टैग को HTML हेडर के रूप में जोड़ने के लिए निर्दिष्ट करने की अनुमति देता हूं। दस्तावेज़ लोड होने के बाद इन्हें प्राप्त किया जाता है, और सादे पाठ गुणों के रूप में संग्रहीत किया जाता है (मैं केवल <script src="//some-location... को इंगित नहीं कर सकता क्योंकि यह एक स्ट्रिंग है, फ़ाइल नहीं)। मैंने कई चीजों की कोशिश की है लेकिन कुछ भी काम नहीं कर रहा है।

let json = loadDataFromServer();
console.log(json.headerHTML); // prints <script type="text/javascript">alert("Header script working");</script>

// This just appends it as a string to the header.
document.getElementsByTagName("head")[0].append(json.headerHTML);

enter image description here

// This appends the script tags properly, but doesn't run the script.
document.head.innerHTML = document.head.innerHTML + json.headerHTML;

enter image description here

यह उल्लेखनीय हो सकता है कि यह एक रिएक्ट ऐप का हिस्सा है, लेकिन जहां तक ​​मुझे पता है dangerouslySetInnerHTML() हेडर में इस्तेमाल नहीं किया जा सकता, केवल बॉडी एचटीएमएल।

0
David Ferris 28 अक्टूबर 2020, 22:47

2 जवाब

सबसे बढ़िया उत्तर

react-helmet इसे हासिल करने में मदद कर सकता है। आप सर्वर की प्रतिक्रिया से ओपनिंग और क्लोजिंग script टैग को हटा सकते हैं और हेडर सामग्री को नीचे दिखाए अनुसार जोड़ सकते हैं।

import {Helmet) from 'react-helmet'

...
return (
    <>
      <Helmet>
        {json.headerHTML ? (
          <script>
            {`
              ${json.headerHTML}
            `}
          </script>
        ) : null}
      </Helmet>
      ...
    </>
)
2
Orinayo Oyelade 28 अक्टूबर 2020, 23:34

यह बहुत आसान है। आपको एक डोम तत्व बनाने और इसे सिर में जोड़ने की जरूरत है।

const element = document.createElement('script');
element.innerHTML += 'alert("hello");'
document.head.appendChild(element);
0
ihormillion 28 अक्टूबर 2020, 23:31