XMLHttpRequest उत्पत्ति null को फ़ाइल के लिए Access-Control-Allow-Origin की अनुमति नहीं है: /// से फाइल करने के लिए: /// (सर्वर रहित)

209

मैं एक ऐसी वेबसाइट बनाने की कोशिश कर रहा हूं जिसे डाउनलोड किया जा सके और स्थानीय रूप से इसकी इंडेक्स फाइल लॉन्च करके चलाया जा सके।

सभी फाइलें स्थानीय हैं, कोई भी संसाधन ऑनलाइन उपयोग नहीं किए जाते हैं।

जब मैं एक XSL टेम्पलेट (उप निर्देशिका में) के साथ XML फ़ाइल को संसाधित करने के लिए jQuery के लिए AJAXSLT प्लगइन का उपयोग करने की कोशिश करता हूं, तो मुझे निम्नलिखित त्रुटियां प्राप्त होती हैं:

XMLHttpRequest cannot load file:///C:/path/to/XSL%20Website/data/home.xml. Origin null is not allowed by Access-Control-Allow-Origin.

XMLHttpRequest cannot load file:///C:/path/to/XSL%20Website/assets/xsl/main.xsl. Origin null is not allowed by Access-Control-Allow-Origin.

अनुक्रमणिका फ़ाइल अनुरोध कर रही है, file:///C:/path/to/XSL%20Website/index.htmlजबकि उपयोग की गई जावास्क्रिप्ट फ़ाइलें संग्रहीत हैं file:///C:/path/to/XSL%20Website/assets/js/।

मैं इस मुद्दे को कैसे ठीक कर सकता हूं?

— केविन हेरेरा
स्रोत

177

ऐसे उदाहरणों के लिए जहां स्थानीय वेबसर्वर चलाना एक विकल्प नहीं है, आप file://ब्राउज़र स्विच के माध्यम से फ़ाइलों तक क्रोम की अनुमति दे सकते हैं । कुछ खुदाई के बाद, मुझे यह चर्चा मिली , जिसमें शुरुआती पोस्ट में एक ब्राउज़र स्विच का उल्लेख है। अपने Chrome उदाहरण को इसके साथ चलाएं:

chrome.exe --allow-file-access-from-files

यह विकास के वातावरण के लिए स्वीकार्य हो सकता है, लेकिन बहुत कम। आप निश्चित रूप से हर समय ऐसा नहीं चाहते हैं। यह अभी भी एक खुला मुद्दा (जनवरी 2011 के अनुसार) प्रतीत होता है।

इसे भी देखें: Chrome में स्थानीय फ़ाइलों का उपयोग करके jQuery getJSON के साथ समस्याएं

— कर्टनी क्रिस्टेंसन
स्रोत

1

@ जो, खुशी है कि यह मदद की! मुझे आश्चर्य है कि ब्राउज़र-आधारित ऐप्स की ओर Google के जोर देने से इसके लिए अधिक मांग होगी। मुझे लगता है कि मांग ही बढ़ेगी।

— कोर्टनी क्रिस्टेंसेन

4

यह macs OS X cweagans.net/blog/2011/1/24/… के

— kinet

1

धन्यवाद, मैं सोच रहा था कि मैंने कहाँ गलत कोडित किया है, लगता है कि ब्राउज़र मुद्दा है।

— अरदा

4

क्या कोई कारण है -आलो-फाइल-एक्सेस-से-फाइल्स समस्या को ठीक नहीं करेगी। मैं केवल $ .getScript ("application.js") जैसी स्क्रिप्ट फ़ाइल लोड करने का प्रयास कर रहा हूं; और प्रश्न में वर्णित त्रुटि प्राप्त करें।

— डेनजो जूल

1

यह काम करता है, हालांकि "कमांड निष्पादित करने से पहले, सुनिश्चित करें कि आपकी सभी क्रोम विंडो बंद है और अन्यथा नहीं चल रही है। या, कमांड लाइन परम प्रभावी नहीं होगा।" chrome.exe --allow-file-access-from- फ़ाइलें "" ( stackoverflow.com/a/4208455/1272428 )

— 12

87

अनिवार्य रूप से इससे निपटने का एकमात्र तरीका लोकलहोस्ट पर चलने वाला वेबसर्वर होना और वहां से उनकी सेवा करना है।

यह एक ब्राउज़र के लिए असुरक्षित है जो आपके कंप्यूटर पर किसी भी फ़ाइल को एक्सेस करने के लिए अजाक्स अनुरोध करने की अनुमति देता है, इसलिए अधिकांश ब्राउज़र " समान उत्पत्ति नीति " के उद्देश्य के लिए कोई फ़ाइल नहीं होने के कारण "फ़ाइल: //" अनुरोधों का इलाज करते हैं ।

एक वेबसर्वर को शुरू cdकरना उस निर्देशिका के रूप में तुच्छ हो सकता है , जिस पर फ़ाइलें चल रही हैं और चल रही हैं:

python -m SimpleHTTPServer

— Singletoned
स्रोत

1

मैं एक ऐसे समाधान को विकसित करने की उम्मीद कर रहा हूं जिसके लिए उपयोगकर्ता को अपने वेब ब्राउज़र से अधिक कुछ भी उपयोग करने की आवश्यकता नहीं है। पायथन, किसी भी दुभाषिया, या किसी भी गैर-प्रणाली अज्ञेय सॉफ़्टवेयर का उपयोग करना व्यवहार्य नहीं है।

— केविन हरेरा

5

वैसे मैं केवल एक अन्य समाधान के बारे में सोच सकता हूं कि पूरी चीज को एक ही पृष्ठ में लोड करना है ताकि आपको फाइल सिस्टम में किसी भी ऐजैक्स अनुरोध करने की आवश्यकता न हो।

— सिंगलटन

2

शुक्रिया @Singletoned! मैं आपके समाधान का उपयोग कर रहा हूं और यह बहुत आसान है!

— हेंडी इरावन

4

और अगर आप पायथन 3 का उपयोग कर रहे हैं, तो कमांड होगा python -m http.server।

— एलेक्स्टरसेप्ट

4

यहाँ एक एप्स्क्रिप्ट है, जो OSX / Chrome देवों के लिए - - फाइल-एक्सेस-से-फाइल्स स्विच ऑन के साथ क्रोम लॉन्च करेगा।

set chromePath to POSIX path of "/Applications/Google Chrome.app/Contents/MacOS/Google Chrome"    
set switch to " --allow-file-access-from-files"
do shell script (quoted form of chromePath) & switch & " > /dev/null 2>&1 &"

— ericsoco
स्रोत

14

आप केवल झंडे जोड़ने के लिए खुले (1) का उपयोग कर सकते हैं open -a 'Google Chrome' --args --allow-file-access-from-files:।

— जोश ली

4

यह समाधान आपको jQuery.getScript () का उपयोग करके एक स्थानीय स्क्रिप्ट लोड करने की अनुमति देगा। यह एक वैश्विक सेटिंग है लेकिन आप प्रति-अनुरोध के आधार पर क्रॉसडोमैन विकल्प भी सेट कर सकते हैं।

$.ajaxPrefilter( "json script", function( options ) {
  options.crossDomain = true;
});

— रेनॉड
स्रोत

एक स्थानीय HTML फ़ाइल से एक स्थानीय js फ़ाइल लोड करने के लिए एक आकर्षण की तरह काम किया! धन्यवाद, वास्तव में मुझे क्या चाहिए।

— 15:15 बजे user1577390

4

स्थानीय फ़ाइल खोलने के लिए जावास्क्रिप्ट FileReader फ़ंक्शन का उपयोग करने के बारे में क्या है , अर्थात:

<input type="file" name="filename" id="filename">
<script>
$("#filename").change(function (e) {
  if (e.target.files != undefined) {
    var reader = new FileReader();
    reader.onload = function (e) {
        // Get all the contents in the file
        var data = e.target.result; 
        // other stuffss................            
    };
    reader.readAsText(e.target.files.item(0));
  }
});
</script>

अब Choose fileबटन पर क्लिक करें और फ़ाइल पर ब्राउज़ करेंfile:///C:/path/to/XSL%20Website/data/home.xml

— suhailvs
स्रोत

3

इस प्रतिबंध को दरकिनार करने के लिए जैसे क्रोम लॉन्च करें open -a "/Applications/Google Chrome.app/Contents/MacOS/Google Chrome" --args --allow-file-access-from-files:।

जोश ली की टिप्पणी से व्युत्पन्न, लेकिन मुझे Google Chrome के पूर्ण पथ को निर्दिष्ट करने की आवश्यकता थी ताकि Google Chrome को मेरे Windows विभाजन (समानताएं) से खोलने से बचा जा सके।

— स्टनर
स्रोत

2

जिस तरह से मैंने इसके चारों ओर काम किया है वह XMLHTTPRequest का उपयोग करने के लिए बिल्कुल भी नहीं है, बल्कि इसके बजाय एक अलग जावास्क्रिप्ट फ़ाइल में आवश्यक डेटा शामिल करें। (मेरे मामले में मुझे https://github.com/kripken/sql.js/ के साथ उपयोग करने के लिए एक बाइनरी SQLite बूँद की जरूरत थी। )

मैंने एक फ़ाइल बनाई है, जिसका नाम base64_data.js(और btoa()उस डेटा को परिवर्तित करने के लिए उपयोग किया जाता है, जिसकी मुझे आवश्यकता थी और इसे सम्मिलित <div>करूं ताकि मैं इसे कॉपी कर सकूं)।

var base64_data = "U1FMaXRlIGZvcm1hdCAzAAQA ...<snip lots of data> AhEHwA==";

और फिर HTML में सामान्य जावास्क्रिप्ट की तरह डेटा शामिल किया गया:

<div id="test"></div>

<script src="base64_data.js"></script>
<script>
    data = atob(base64_data);
    var sqldb = new SQL.Database(data);
    // Database test code from the sql.js project
    var test = sqldb.exec("SELECT * FROM Genre");
    document.getElementById("test").textContent = JSON.stringify(test);
</script>

मुझे लगता है कि यह JSON, शायद XML भी पढ़ने के लिए इसे संशोधित करने के लिए तुच्छ होगा; मैं पाठक के लिए एक अभ्यास के रूप में छोड़ दूँगा;)

— एंथोनी ब्रिग्स
स्रोत

1

आप डालने की कोशिश कर सकते 'Access-Control-Allow-Origin':'*'में response.writeHead(, {[here]})।

— Shikon
स्रोत

6

response.writeHead कहाँ से आता है, मैं इसे कैसे और कहाँ से बुलाऊँ? क्या आप और उदाहरण दे सकते हैं? ध्यान रखें यह एक स्थानीय फाइल सिस्टम है न कि सर्वर। मेरी समझ यह है कि मूल्य केवल एक सर्वर से सेट किया जा सकता है?

— जोसेफ अस्त्रान

0

'क्रोम ऐप के लिए वेब सर्वर' का उपयोग करें। (आपके पास वास्तव में यह आपके पीसी पर है, जो आप जानते हैं या नहीं, बस इसे कॉर्टाना में खोजें!)। इसे खोलें और 'फ़ाइल चुनें' पर क्लिक करें, इसमें अपनी फ़ाइल के साथ फ़ोल्डर चुनें। वास्तव में अपनी फ़ाइल का चयन न करें। अपनी फ़ाइलों के फ़ोल्डर का चयन करें और फिर 'फ़ोल्डर चुनें' बटन के तहत लिंक पर क्लिक करें।

यदि यह आपको फ़ाइल में नहीं ले जाता है, तो फ़ाइल का नाम urs में जोड़ें। इस तरह:

   https://127.0.0.1:8887/fileName.txt

क्रोम के लिए वेब सर्वर से लिंक: मुझे क्लिक करें

— इंसान को
स्रोत