एचटीएमएल/जावास्क्रिप्ट: src set

के साथ एक स्क्रिप्ट टैग में लोड किए गए JSON डेटा तक कैसे पहुंचे, मेरे पास यह JSON फ़ाइल है जो मैं सर्वर पर उत्पन्न करता हूं, जिसे मैं क्लाइंट पर एक्सेस करना चाहता हूं क्योंकि पृष्ठ देखने योग्य है। असल में मैं क्या हासिल करना चाहते हैं:एचटीएमएल/जावास्क्रिप्ट: src set

मैं निम्नलिखित है:

<script id="test" type="application/json" src="http:/myresources/stuf.json">

टैग को मेरी HTML दस्तावेज़ में घोषित कर दिया। इसके स्रोत में दी गई फ़ाइल में जेसन डेटा है। जैसा कि मैंने देखा है, डेटा डाउनलोड किया गया है, जैसे स्क्रिप्ट के साथ होता है।

अब, मैं इसे जावास्क्रिप्ट में कैसे एक्सेस करूं? मैंने अपने जेसन डेटा को प्राप्त करने के लिए कई तरीकों का उपयोग करके, jquery के साथ और बिना स्क्रिप्ट टैग तक पहुंचने का प्रयास किया है, लेकिन किसी भी तरह यह काम नहीं करता है। अपने आंतरिक HTML प्राप्त करने से काम किया होगा, जेसन डेटा स्क्रिप्ट में इनलाइन लिखा गया था। जो यह नहीं था और वह नहीं है जिसे मैं हासिल करने की कोशिश कर रहा हूं।

पेज लोड के बाद रिमोट JSON अनुरोध भी एक विकल्प नहीं है, अगर आप इसका सुझाव देना चाहते हैं।

स्रोत

2012-11-22 ChuckE

एक जेसन फ़ाइल के बजाय, इसे एक जावास्क्रिप्ट फ़ाइल बनाएं जो ऑब्जेक्ट को एक चर के लिए असाइन करता है। अन्य दृष्टिकोण AJAX का उपयोग करना है। –

पहला सुझाव वर्तमान कार्यान्वयन है। मैं ऐसा नहीं करना चाहता क्योंकि मैं संरचना प्रदान करने के लिए व्यवहार का उपयोग कर रहा हूं। मैं संरचना के लिए संरचना का उपयोग करना पसंद करूंगा (अगर मैं JSON चाहता हूं, तो मुझे JSON मिल जाएगा)। दूसरा सुझाव नहीं चाहता था (मुझे प्रारंभिक प्रक्रिया के लिए इस डेटा की आवश्यकता है)। – ChuckE

@ChuckE '

आप अन्य डोमेन से JSON लोड करने के लिए की जरूरत है: http://en.wikipedia.org/wiki/JSONP
हालांकि संभावित XSSI हमलों के बारे में पता होना: https://www.scip.ch/en/?labs.20160414

यदि यह एक ही डोमेन तो बस अजाक्स का उपयोग है।

स्रोत

2014-01-24 18:07:17

JSONP JSON- स्वरूपित परिणामों के साथ काम नहीं करता है। साथ ही, जेएसओएनपी पैरामीटर एक स्क्रिप्ट के लिए तर्क के रूप में पारित सर्वर द्वारा परिभाषित किया गया है ... जिनके पास आपके पास पहुंच नहीं है। टेक्स्ट सामग्री के लिए –

एक और समाधान सर्वर-साइड स्क्रिप्टिंग भाषा का उपयोग करना होगा और बस जेसन-डेटा इनलाइन को शामिल करना होगा।यहाँ एक उदाहरण पीएचपी का उपयोग करता है है:

<script id="data" type="application/json"><?php include('stuff.json'); ?></script> 
<script> 
var jsonData = JSON.parse(document.getElementById('data').textContent) 
</script>

ऊपर के उदाहरण प्रकार application/json साथ एक अतिरिक्त स्क्रिप्ट टैग का उपयोग करता है। एक और भी सरल समाधान JSON जावास्क्रिप्ट में सीधे शामिल करने के लिए है:

<script>var jsonData = <?php include('stuff.json');?>;</script>

अतिरिक्त टैग के साथ समाधान का लाभ यह है कि जावास्क्रिप्ट कोड और JSON डेटा एक दूसरे से अलग रखा जाता है।

स्रोत

2015-07-14 12:19:50 terabaud

+। .html स्क्रिप्ट टैग –

ऐसा प्रतीत होता है कि यह संभव नहीं है, या कम से कम समर्थित नहीं है।

HTML5 specification से:

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

स्रोत

2016-07-20 15:49:16 btx9000

चेक इस उत्तर: https://stackoverflow.com/a/7346598/1764509

$.getJSON("test.json", function(json) { 
    console.log(json); // this will show the info it in firebug console 
});

स्रोत

2017-01-27 11:30:09

$ पर मेरे लिए काम नहीं करता है .getJSON() एक AJAX कॉल है। –

मैं कंसोल की बजाय किसी लिंक की गई HTML फ़ाइल में जानकारी कैसे दिखा सकता हूं? –

एक अन्य विकल्प जावास्क्रिप्ट के भीतर ठीक उसी json उपयोग करने के लिए। चूंकि यह जावास्क्रिप्ट ऑब्जेक्ट नोटेशन है, इसलिए आप सीधे अपने ऑब्जेक्ट को जेसन नोटेशन के साथ बना सकते हैं। यदि आप इसे .js फ़ाइल में संग्रहीत करते हैं तो आप अपने एप्लिकेशन में ऑब्जेक्ट का उपयोग कर सकते हैं। यह मेरे लिए एक उपयोगी विकल्प था जब मेरे पास कुछ स्थिर जेसन डेटा था जो मैं अपने बाकी ऐप से अलग फ़ाइल में कैश करना चाहता था।

//Just hard code json directly within JS 
    //here I create an object CLC that represents the json! 
    $scope.CLC = { 
     "ContentLayouts": [ 
      { 
       "ContentLayoutID": 1, 
       "ContentLayoutTitle": "Right", 
       "ContentLayoutImageUrl": "/Wasabi/Common/gfx/layout/right.png", 
       "ContentLayoutIndex": 0, 
       "IsDefault": true 
      }, 
      { 
       "ContentLayoutID": 2, 
       "ContentLayoutTitle": "Bottom", 
       "ContentLayoutImageUrl": "/Wasabi/Common/gfx/layout/bottom.png", 
       "ContentLayoutIndex": 1, 
       "IsDefault": false 
      }, 
      { 
       "ContentLayoutID": 3, 
       "ContentLayoutTitle": "Top", 
       "ContentLayoutImageUrl": "/Wasabi/Common/gfx/layout/top.png", 
       "ContentLayoutIndex": 2, 
       "IsDefault": false 
      } 
     ] 
    };

स्रोत

2018-01-21 23:04:09 DominicTurner

संबंधित मुद्दे