सर्वर-साइड प्रतिपादन के लिए स्थिर प्रतिक्रिया

Question

सर्वर पर घटकों को प्रस्तुत करने के लिए प्रतिक्रिया का उपयोग करते समय, मुझे लगता है कि डेटा-प्रतिक्रियात्मक विशेषताएं प्रभावी रूप से यादृच्छिक हैं। मैं समझता हूं कि इसकी उम्मीद है। (https://groups.google.com/forum/#!topic/reactjs/ewTN-WOP1w8)

हालांकि यह थोड़ा आश्चर्यजनक है कि यह अन्यथा कार्यात्मक रूपरेखा दृश्य आउटपुट में ऐसे गैर-निर्धारणा को प्रस्तुत करती है। इसका मतलब है कि समान राज्य के साथ एक दृश्य के लगातार प्रस्तुतिकरण अलग-अलग HTML बनाएंगे, उदाहरण के लिए, दृश्य इंजन '304 संशोधित नहीं' लौटने से या विश्वसनीय ईटीएजी उत्पन्न करने से रोक देगा। (मुझे सराहना है कि इस तरह के कैशिंग को उच्च इंफ्रास्ट्रक्चर परत पर भी संभाला जा सकता है।)

क्या पहचानकर्ता की पीढ़ी को बीज करने का कोई तरीका है ताकि प्रतिक्रियाएं निर्धारक हों? या यही कारण है कि एक बुरा विचार कहीं और समझाया गया है?

Answer 1

Google Group thread बेन अल्पेर्ट पर अंतिम टिप्पणी में कहते हैं:

सर्वर प्रतिपादन के लिए, यह महत्वपूर्ण है कि अलग अलग गाया घटकों टकराने आईडी नहीं है (भले ही वे अलग सर्वर पर गाया रहे हैं, उदाहरण के लिए) इसलिए हम उन्हें यादृच्छिक रूप से चुनते हैं।

Answer 2

इसके अलावा हाल ही में यह (बस reactjs उपयोग शुरू कर दिया) के बारे में सोचा,

संभव समाधान काफी सरल है - ETag की कोई आवश्यकता असली एचटीएमएल से उत्पन्न किया जा करने के लिए नहीं है ... - यह से उत्पन्न किया जा सकता प्रदर्शित डेटा।

तो तुम यह आभासी डोम से उत्पन्न कर सकते हैं - बस React.renderComponentToStaticMarkup(…) उपयोग करने और उससे ETag उत्पन्न ...

या आप regexp साथ यह hashing से पहले गाया एचटीएमएल से सभी reactid के निकाल सकते हैं (संभावना तेजी से तो अलग प्रस्तुत करना)। कुछ ..

मामले में अगर आप एक्सप्रेस का उपयोग कर रहे हैं, इस तरह होगा:

var virtualDom = React.createFactory(Handler)({}); 
var html = React.renderToString(virtualDom); 

var etag = app.get('etag fn'); 
if (etag) { 
    etag = etag(React.renderComponentToStaticMarkup(virtualDom), 'utf8'); 
    etag && res.set('ETag', etag); 
} 

res.render(...); 

Answer 3

यह मैं भी गुस्सा दिलाना था, इसलिए मैं कुछ देखने के लिए क्या करता है, तो मैं जड़ नियतात्मक reactid बनाया होगा खुदाई किया ।

यदि आप निम्नलिखित हैक को प्रस्तुत करने के इच्छुक हैं तो यह संभावित 0.14.x में इसे ओवरराइड कर सकता है। अपने सर्वर साइड फ़ाइल जहां ReactDOM.renderToString फोन में, शीर्ष पर रखें:

// Override the ServerReactRootIndex.createReactRootIndex function 
var ServerReactRootIndex = require('react/lib/ServerReactRootIndex'); 
ServerReactRootIndex.createReactRootIndex = function(){ 
    return "x"; // Results in an attribute like data-reactid=".x" 
}; 

// Use React as usual 
// NB: require('react') must come AFTER overriding ServerReactRootIndex.createReactRootIndex 
var React = require('react'); 

यह प्रतिक्रिया एपीआई का हिस्सा नहीं है, तो यह निकट भविष्य में टूट सकता है। हालांकि, अगर आपको बिल्कुल इसकी आवश्यकता है तो यह अभी काम करता है। यह डेटा-रिएक्ट-चेकसम विशेषता को उसी rendered DOM के लिए स्थिर बनाता है।

यदि आपके पास एक पृष्ठ में एकाधिक रूट प्रतिक्रिया घटक हैं, तो उनके पास अलग-अलग रूट आईडी होनी चाहिए, इसलिए आपको इस फ़ंक्शन को इसके लिए खाते में संशोधित करने की आवश्यकता होगी।