Rumah  >  Artikel  >  hujung hadapan web  >  Apakah yang perlu saya lakukan jika "Tidak dibenarkan memuatkan sumber tempatan: file:///xxx" muncul apabila menggunakan sumber-vue dalam aplikasi Vue?

Apakah yang perlu saya lakukan jika "Tidak dibenarkan memuatkan sumber tempatan: file:///xxx" muncul apabila menggunakan sumber-vue dalam aplikasi Vue?

WBOY
WBOYasal
2023-06-25 10:02:114613semak imbas

Vue.js ialah rangka kerja bahagian hadapan yang popular dan ramai orang menggunakan Vue.js dalam projek mereka. Dalam pembangunan Vue.js, kami sering menggunakan pemalam sumber vue untuk melaksanakan operasi permintaan tak segerak. Walau bagaimanapun, apabila kami menggunakan vue-resource dalam persekitaran setempat, mesej ralat "Tidak dibenarkan memuatkan sumber tempatan: file:///xxx" mungkin muncul dalam konsol. Mari perkenalkan penyelesaian kepada masalah ini secara terperinci.

Pertama, kita perlu memahami punca kesilapan ini. Ini kerana mekanisme keselamatan penyemak imbas menyekat akses terus kepada fail pada sistem fail tempatan. Aplikasi Vue dijalankan dalam fail HTML dalam sistem fail tempatan, dan laluan ke fail tempatan digunakan dalam permintaan tak segerak. Oleh itu, penyemak imbas akan berfikir bahawa ini adalah permintaan berniat jahat dan memintasnya.

Untuk menangani masalah ini, kami boleh menggunakan dua penyelesaian berbeza, seperti berikut:

  1. Mulakan pelayan tempatan

Dalam pembangunan Vue.js, kami biasanya menggunakan arahan npm untuk memulakan pelayan tempatan, seperti " perintah npm run serve". Selepas memulakan pelayan tempatan, aplikasi Vue.js boleh dijalankan pada pelayan tempatan dan bukannya dalam sistem fail tempatan kami. Dengan cara ini, kami boleh mengelakkan sekatan mekanisme keselamatan penyemak imbas dan menggunakan pemalam vue-resource untuk melaksanakan operasi permintaan tak segerak.

Jika anda mencipta projek menggunakan vue-cli, anda boleh memasukkan "npm run serve" pada baris arahan untuk memulakan pelayan tempatan. Selepas permulaan, buka alamat localhost:8080 dalam penyemak imbas dan panggil kaedah sumber vue pada halaman.

  1. Menggunakan protokol HTTP

Jika kami masih mahu menjalankan aplikasi Vue.js dalam sistem fail tempatan dan tidak mahu memulakan pelayan tempatan, kami boleh menggunakan protokol HTTP untuk melaksanakan operasi permintaan tak segerak.

Kami boleh menggunakan protokol HTTP dalam dua cara berikut:

(1) Ubah suai laluan permintaan tak segerak:

Kami boleh menggunakan protokol HTTP dengan mengubah suai laluan permintaan tak segerak. Sebagai contoh, kita boleh menukar alamat permintaan http://localhost:8080/mockData.json kepada http://127.0.0.1:8080/mockData.json, dan buka http://127.0.0.1:8080 dalam penyemak imbas. Daripada menggunakan fail:// protokol.

(2) Gunakan bendera --benarkan-fail-akses-dari-fail penyemak imbas Chrome.

Kami boleh menggunakan bendera penyemak imbas Chrome --allow-file-access-from-files untuk membenarkan penyemak imbas mengakses sistem fail setempat. Sila ambil perhatian bahawa teg ini hanya digunakan pada penyemak imbas Chrome.

Dalam sistem pengendalian Windows, kita perlu memasukkan arahan berikut dalam command prompt (cmd):

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

Dalam sistem pengendalian MacOS, kita perlu membuka terminal dan masukkan arahan berikut:

open -a Google Chrome --args --allow-file-access-from-files

Jika anda menggunakan yang lain penyemak imbas, anda perlu menyemak tetapan sepadan penyemak imbas untuk membenarkan sistem fail tempatan.

Secara umum, dalam pembangunan Vue.js, kita boleh mengelakkan ralat "Tidak dibenarkan memuatkan sumber tempatan: file:///xxx". Jika anda ingin menjalankan aplikasi Vue.js anda dalam sistem fail tempatan, anda boleh menggunakan protokol HTTP, atau masukkan arahan "npm run serve" pada baris arahan untuk memulakan pelayan setempat, atau gunakan --allow-file apabila menggunakan bendera pelayar Chrome -access-from-files. Kaedah ini membolehkan kami menggunakan pemalam sumber vue untuk melaksanakan operasi permintaan tak segerak.

Atas ialah kandungan terperinci Apakah yang perlu saya lakukan jika "Tidak dibenarkan memuatkan sumber tempatan: file:///xxx" muncul apabila menggunakan sumber-vue dalam aplikasi Vue?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn