Rumah > hujung hadapan web > View.js > Apakah yang perlu saya lakukan jika 'Ralat: Akses Ditolak' muncul apabila menggunakan sumber vue dalam aplikasi Vue?

Apakah yang perlu saya lakukan jika 'Ralat: Akses Ditolak' muncul apabila menggunakan sumber vue dalam aplikasi Vue?

WBOY
Lepaskan: 2023-06-24 17:51:12
asal
2140 orang telah melayarinya

Vue ialah rangka kerja JavaScript popular yang membantu pembangun membina aplikasi web moden. Dalam Vue, vue-resource ialah perpustakaan HTTP yang biasa digunakan yang menyediakan cara yang mudah untuk menghantar permintaan HTTP dan mengendalikan respons.

Walau bagaimanapun, apabila menggunakan vue-resource, anda mungkin menghadapi ralat biasa: Ralat: Akses Ditolak. Ralat ini biasanya berlaku apabila cuba menghantar permintaan HTTP dan ini bermakna anda tidak mempunyai kebenaran yang mencukupi untuk mengakses sumber tersebut. Di bawah ini kami akan memperkenalkan beberapa penyelesaian.

1. Semak tetapan pelayan

"Ralat: Akses Ditolak" biasanya disebabkan oleh isu CORS (Perkongsian Sumber Silang). Untuk menyelesaikan isu ini, anda perlu memastikan pelayan anda disediakan dengan betul. Di bahagian pelayan, anda perlu membenarkan permintaan silang asal. Ini boleh dicapai dengan menetapkan pengepala respons yang betul. Dalam respons HTTP, anda perlu menetapkan maklumat pengepala seperti Access-Control-Allow-Origin dan Access-Control-Allow-Methods untuk membenarkan permintaan dihantar melalui CORS. Jika anda menggunakan Node.js sebagai pelayan anda, anda boleh mencapainya dengan mudah menggunakan perisian tengah CORS.

2. Gunakan proksi

Cara lain untuk menyelesaikan masalah CORS ialah menggunakan proksi dalam aplikasi Vue anda. Dalam mod pembangunan, anda boleh menggunakan fail konfigurasi vue.config.js untuk menetapkan proksi. Sebagai contoh, anda boleh mengkonfigurasi aplikasi Vue anda untuk dijalankan pada localhost:8080 dan memajukan semua permintaan API ke http://example.com/api:

module.exports = {
devServer: {

proxy: {
  '^/api': {
    target: 'http://example.com',
    changeOrigin: true,
    pathRewrite: { '^/api': '/api' }
  }
}
Salin selepas log masuk

}
}

Ini akan memberitahu aplikasi Vue untuk mengubah hala permintaan API ke http://example.com/api apabila menghantarnya, sekali gus mengelakkan isu CORS.

3. Gunakan JSONP

JSONP adalah satu lagi cara untuk menyelesaikan masalah CORS. Ia membolehkan anda meminta sumber daripada domain berbeza terus dalam penyemak imbas anda. Dalam aplikasi Vue, anda boleh menggunakan pemalam vue-jsonp untuk melaksanakan JSONP. Pertama, anda perlu memasang vue-jsonp:

npm install vue-jsonp --save

Kemudian gunakannya dalam aplikasi Vue anda:

import Vue dari 'vue'
import VueJsonp dari 'vue-jsonp'

Vue .use(VueJsonp)

Kini anda boleh menggunakan kaedah VueJsonp Vue untuk menghantar permintaan kepada nama domain yang berbeza.

Ringkasan

"Ralat: Akses Ditolak" apabila menggunakan sumber vue dalam aplikasi Vue biasanya bermakna anda tidak mempunyai kebenaran yang mencukupi untuk mengakses sumber tersebut. Masalah ini biasanya disebabkan oleh isu CORS. Untuk menyelesaikan masalah ini, anda boleh menyemak tetapan pelayan, menggunakan proksi atau menggunakan JSONP. Menggunakan teknik ini, anda boleh menyelesaikan masalah "Ralat: Akses Ditolak" dengan mudah dan menjadikan aplikasi Vue anda berfungsi dengan baik.

Atas ialah kandungan terperinci Apakah yang perlu saya lakukan jika 'Ralat: Akses Ditolak' muncul apabila menggunakan sumber vue dalam aplikasi Vue?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Label berkaitan:
sumber:php.cn
Kenyataan Laman Web ini
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
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan