XMLHttpRequest tidak dapat memuat file. Permintaan lintas sumber hanya didukung untuk HTTP

Saya mendapatkan kesalahan berikut:

XMLHttpRequest cannot load file:///C:/Users/richa.agiwal/Desktop/get/rm_Library/templates/template_viewSettings.html. Cross origin requests are only supported for HTTP. 

Saya menyadari bahwa pertanyaan ini telah dijawab sebelumnya, tetapi saya masih belum menemukan solusi untuk masalah saya. Saya mencoba menjalankan chrome.exe --allow-file-access-from-filesdari command prompt, dan memindahkan file ke sistem file lokal, tetapi saya masih mendapatkan kesalahan yang sama.

Saya menghargai semua saran!

Jika Anda melakukan sesuatu seperti menulis HTML dan Javascript di editor kode di komputer pribadi Anda, dan menguji keluaran di browser Anda, Anda mungkin akan mendapatkan pesan kesalahan tentang Cross Origin Requests. Browser Anda akan merender HTML dan menjalankan Javascript, jQuery, angularJs di browser Anda tanpa perlu menyiapkan server. Tetapi banyak browser web diprogram untuk mengawasi serangan lintas situs, dan akan memblokir permintaan. Anda tidak ingin sembarang orang dapat membaca hard drive Anda dari browser web Anda. Anda dapat membuat halaman web yang berfungsi penuh menggunakan Notepad ++ yang akan menjalankan Javascript, dan kerangka kerja seperti jQuery dan angularJs; dan uji semuanya hanya dengan menggunakan item menu Notepad ++,RUN, LAUNCH IN FIREFOX. Itu cara yang bagus dan mudah untuk mulai membuat halaman web, tetapi ketika Anda mulai membuat apa pun selain tata letak, css, dan navigasi halaman sederhana, Anda memerlukan server lokal yang disiapkan di komputer Anda.

Berikut beberapa opsi yang saya gunakan.

1. Uji halaman web Anda secara lokal di Firefox, lalu terapkan ke host Anda.
2. atau: Jalankan server lokal

Uji di Firefox, Terapkan ke Host

1. Firefox saat ini mengizinkan Permintaan Lintas Asal dari file yang disajikan dari hard drive Anda
2. Situs web hosting Anda akan mengizinkan permintaan ke file dalam folder seperti yang dikonfigurasi oleh file manifes

Jalankan Server Lokal

• Jalankan server di komputer Anda, seperti Apache atau Python
• Python bukanlah sebuah server, tetapi ia akan menjalankan sebuah server sederhana

Jalankan Server Lokal dengan Python

Dapatkan alamat IP Anda:

• Di Windows: Buka 'Command Prompt'. Semua Program, Aksesoris, Prompt Perintah
• Saya selalu menjalankan Command Promptas Administrator. Klik kanan Command Promptitem menu dan cariRun As Administrator
• Ketik perintah: ipconfigdan tekan Enter.
• Cari: Alamat IPv4. . . . . . . . 12.123.123.00
• Ada situs web yang juga akan menampilkan alamat IP Anda

Jika Anda tidak memiliki Python, unduh dan instal.

Dengan menggunakan 'Command Prompt' Anda harus pergi ke folder tempat file-file yang ingin Anda jadikan sebagai halaman web.

• Jika Anda perlu kembali ke direktori C: \ Root - ketik cd /
• ketik cd Drive: \ Folder \ Folder \ etc untuk membuka folder tempat file .Html Anda berada (atau php, dll)
• Periksa jalannya. ketik: jalur pada prompt perintah. Anda harus melihat jalur ke folder tempat python berada. Misalnya, jika python ada di C: \ Python27, maka Anda harus melihat alamat itu di jalur yang terdaftar.
• Jika jalur ke direktori Python tidak berada di jalur, Anda harus menyetel jalurnya. ketik: jalur bantuan dan tekan Enter. Anda akan melihat bantuan untuk jalan.
• Ketik sesuatu seperti: path c: \ python27% path%
• % path% menyimpan semua jalur Anda saat ini. Anda tidak ingin menghapus semua jalur Anda saat ini, cukup tambahkan jalur baru.
• Buat jalur baru DARI folder tempat Anda ingin menyajikan file.
• Mulai Server Python: Ketik: python -m SimpleHTTPServer portDi mana 'port' adalah nomor port yang Anda inginkan, misalnyapython -m SimpleHTTPServer 1337
• Jika Anda membiarkan port kosong, defaultnya adalah port 8000
• Jika server Python berhasil dimulai, Anda akan melihat pesan pesan.

Jalankan Aplikasi Web Anda Secara Lokal

• Buka browser
• Di jenis baris alamat: http://your IP address:port
• http://xxx.xxx.x.x:1337 atau http://xx.xxx.xxx.xx:8000untuk default
• Jika server berfungsi, Anda akan melihat daftar file Anda di browser
• Klik file yang ingin Anda layani, dan itu akan ditampilkan.

Solusi yang lebih canggih

• Instal editor kode, server web, dan layanan lain yang terintegrasi.

Anda dapat menginstal Apache, PHP, Python, SQL, Debugger, dll. Semuanya secara terpisah di mesin Anda, dan kemudian menghabiskan banyak waktu mencoba mencari cara untuk membuat semuanya bekerja sama, atau mencari solusi yang menggabungkan semua hal itu.

Saya suka menggunakan XAMPP dengan NetBeans IDE. Anda juga dapat menginstal WAMP yang menyediakan User Interfaceuntuk mengelola dan mengintegrasikan Apache dan layanan lainnya.

Solusi Sederhana

Jika Anda bekerja dengan file html / js / css murni.

Pasang aplikasi ( tautan ) server kecil ini di chrome. Buka aplikasi dan arahkan lokasi file ke direktori proyek Anda.

Buka url yang ditampilkan di aplikasi.

Edit: Solusi lebih cerdas menggunakan Gulp

Langkah 1: Untuk menginstal Gulp. Jalankan perintah berikut di terminal Anda.

npm install gulp-cli -g
npm install gulp -D

Langkah 2: Di dalam direktori proyek Anda, buat file bernama gulpfile.js. Salin konten berikut di dalamnya.

var gulp        = require('gulp');
var bs          = require('browser-sync').create();   

gulp.task('serve', [], () => {
        bs.init({
            server: {
               baseDir: "./",
            },
            port: 5000,
            reloadOnRestart: true,
            browser: "google chrome"
        });
        gulp.watch('./**/*', ['', bs.reload]);
});

Langkah 3: Instal plugin gulp sinkronisasi browser. Di dalam direktori yang sama di mana gulpfile.js ada, jalankan perintah berikut

npm install browser-sync gulp --save-dev

Langkah 4: Mulai server. Di dalam direktori yang sama di mana gulpfile.js ada, jalankan perintah berikut

gulp serve

Kesalahan ini terjadi karena Anda baru saja membuka dokumen html langsung dari browser. Untuk memperbaikinya, Anda harus menyajikan kode Anda dari server web dan mengaksesnya di localhost. Jika Anda memiliki pengaturan Apache, gunakan untuk melayani file Anda. Beberapa IDE telah dibangun di server web, seperti JetBrains IDE's, Eclipse ...

Jika Anda memiliki setup Node.Js maka Anda dapat menggunakan http-server . Jalankan saja npm install http-server -gdan Anda akan dapat menggunakannya di terminal seperti http-server C:\location\to\app. Kirill Fuchs

Untuk menambah jawaban rumit Alan Wells di sini adalah perbaikan cepat

Jalankan Server Lokal

Anda dapat menyajikan folder apa pun di komputer Anda dengan Sajikan

Pertama, navigasikan menggunakan baris perintah ke dalam folder yang ingin Anda layani.

Kemudian

npx i -g serve
serve

atau jika Anda ingin menguji Serve dengan mendownloadnya

npx serve

dan hanya itu! Anda dapat melihat file Anda di http: // localhost: 5000

Saya menghadapi kesalahan ini ketika saya menerapkan proyek API Web saya secara lokal dan saya memanggil proyek API hanya dengan URL yang diberikan di bawah ini:

localhost // myAPIProject

Karena pesan kesalahan mengatakan itu bukan http: // maka saya mengubah URL dan memberi awalan http seperti yang diberikan di bawah ini dan kesalahan itu hilang.

http: // localhost // myAPIProject

Jika Anda menggunakan WebStorm Javascript IDE , Anda cukup membuka proyek Anda dari WebStorm di browser Anda. WebStorm akan secara otomatis memulai server dan Anda tidak akan mendapatkan kesalahan ini lagi, karena Anda sekarang mengakses file dengan protokol yang diizinkan / didukung (HTTP).

Tergantung pada kebutuhan Anda, tetapi ada juga cara cepat untuk memeriksa sementara JSON (tiruan) Anda dengan menyimpan JSON Anda di http://myjson.com . Salin tautan api dan tempelkan itu ke kode javascript Anda. Biola! Saat Anda ingin menerapkan kode, Anda tidak boleh lupa untuk mengubah url itu di kode Anda!

Tempatkan folder proyek Anda ke dalam htdocs dari direktori Xampp Mulai server Apache Anda menggunakan panel kontrol xampp kemudian buka browser, goto localhost / projectfolder, lalu mulai berfungsi