6

मैं क्रोम एक्सटेंशन में कुछ AJAX का उपयोग करने का प्रयास कर रहा हूं।क्रोम एक्सटेंशन में मेरा AJAX कॉल सिंक्रोनस क्यों है?

मेरे पास एक सामग्री स्क्रिप्ट है जो किसी मौजूदा पृष्ठ पर कुछ HTML जोड़ना है।

मैंने JQuery.get, JQuery.load और ng-include की कोशिश की है।

और उनमें से सभी कंसोल में एक चेतावनी दिखाते हैं, मुझे बताते हैं कि synchronous XHR बहिष्कृत हैं (प्रकृति द्वारा इन असीमित नहीं हैं ???)। और फिर पृष्ठ इस अजीब व्यवहार को दिखाता है, मुझे बताता है कि कुछ Pusher परिभाषित नहीं किया गया है, फिर पृष्ठ को रीफ्रेश करता है और मेरे सम्मिलित div को मारता है।

क्या गलत हो सकता है ??

नमूना कोड - यदि मैं पहले var txt को सक्षम करता हूं, तो यह पूरी तरह से काम करता है। यदि इसके बजाय मैं दूसरा var txt (टिप्पणी) सक्षम करता हूं, तो यह विफल हो जाता है।

//this first line works perfectly 
var txt = '<div id="myNewDiv" ng-controller="myController">{{testing}}</div>'; 

//this shows the warning and a really weird behavior 
//var txt = '<div id="myNewDiv" ng-controller="myController">{{testing}}<div ng-include="' + "'myhtml.html'" + '"></div></div>'; 


$('#a-certain-div-in-the-page').after(txt) 

var app = angular.module('myApp', []) 
    .controller('myController', function($scope) { 
     $scope.testing = 'Welcome!'; 
    }); 

angular.bootstrap(document, ['myApp']); 
+0

अपने HTML सिर्फ मार्क-अप में क्या है या यह स्क्रिप्ट का संदर्भ शामिल है –

+0

आप यकीन है कि यह पृष्ठ स्वयं उस चेतावनी से चलाता नहीं है कर रहे हैं? – Xan

+0

हैलो, @CodeUniquely, हाँ, केवल मार्कअप। वास्तव में मैंने बिना किसी टैग के सादा पाठ के साथ भी कोशिश की। परिणाम हमेशा एक ही है। (परीक्षण उद्देश्यों के लिए, मैं एक ही एचटीएमएल जोड़ने, कोड में अपनी सामग्री टाइप करने और $ ('# ...') का उपयोग करने में सक्षम था। संलग्न करें) –

उत्तर

6

ठीक है, यहाँ क्या होता है:

1 - एक्सटेंशन डोमेन पेज डोमेन से अलग है, तो यह, पृष्ठ के डोमेन से बातें लोड करने के लिए विस्तार फ़ाइलों से नहीं की कोशिश की। (और संसाधन नहीं मिला था)। इस मामले में चेतावनी संदेश पूरी तरह से भ्रामक है।

समाधान: उचित पूर्ण यूआरएल प्राप्त करने के लिए chrome.extention.getURL('myhtml.html') का उपयोग करें। या एक पूर्ण पथ बनाने के लिए अपने एक्सटेंशन की आईडी का उपयोग कर तारों को संयोजित करें।

var txt = '<div id="myNewDiv" ng-controller="myController">{{testing}}<div ng-include="' + "'" + chrome.extension.getURL('myhtml.html') + "'" + '"></div></div>'; 

2 - यहां तक ​​कि ऐसा करने पर, एक क्रॉस-डोमेन अनुरोध समस्या भी है। पृष्ठ केवल अपने डोमेन से अनुरोध स्वीकार करता है, जब तक कि आप इसे सही अनुमति नहीं देते। यह इस संसाधन की अनुमति manifest.json फ़ाइल में जोड़ने के लिए आवश्यक है:

{ 
    "manifest_version": 2, 

    ..... among many others .... 

    "web_accessible_resources": [ 
     "myhtml.html" 
    ] 

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