Ini bukan masalah efek, ini harus terkait dengan pengambilan. Lintas domain?

Saya membuat permintaan lintas domain, dan mengubahnya menjadi axios untuk membuat permintaan. Semuanya normal. Parameter apa yang harus dikonfigurasi agar pengambilan mendukung lintas domain?

Saya belum mencobanya secara khusus, tetapi melihat dokumentasi pengambilan, dikatakan bahwa pemrosesan lintas domain konsisten dengan XMLHTTPRequest. Mungkinkah itu terkait dengan fakta bahwa cookie tidak dibawa? https://www.npmjs.com/package/whatwg-fetch#sending -cookies

Dalam proyek saya, server ditulis dalam bahasa GO Selama server dikonfigurasi untuk mendukung / mengizinkan lintas domain, pengambilan klien tidak memerlukan konfigurasi tambahan;

Saya rasa @xaviertung dapat mempertimbangkan untuk memeriksa log server untuk menganalisis / menemukan masalah. Jika ini adalah masalah otentikasi, selesaikan masalah otentikasi :)

Pada 8:30 pada 18 November 2016, chencheng (云 谦) [email protected] menulis:

Saya belum mencobanya secara khusus, tetapi melihat dokumentasi pengambilan, dikatakan bahwa pemrosesan lintas domain konsisten dengan XMLHTTPRequest. Mungkinkah itu terkait dengan fakta bahwa cookie tidak dibawa? https://www.npmjs.com/package/whatwg-fetch#sending -cookies https://www.npmjs.com/package/whatwg-fetch#sending -cookies
-
Anda menerima ini karena Anda berlangganan utas ini.
Balas email ini secara langsung, lihat di GitHub https://github.com/dvajs/dva/issues/282#issuecomment -261413729, atau nonaktifkan utas https://github.com/notifications/unsubscribe-auth/ACv7UniRkGq0Uv8XFBUeNMe5jBeGyWpQksp5q_P 4

Terima kasih, masalah sudah teratasi, ini adalah masalah pengaturan mode dan kredensial.

Bagaimana mengatasinya, mari kita bicara tentang rencananya? Mungkin orang lain akan menemukannya nanti.

1. Kesalahan yang dilemparkan oleh pengambilan tidak menemukan masalah dengan jelas, dan berubah menjadi solusi Janji (axios) untuk mengetahui bahwa itu adalah masalah lintas-domain
   2. Saya menemukan posting di Internet untuk dengan mudah memecahkan masalah lintas-domain, mengatur mode: tanpa cors, dan mengambil jalan memutar.
   3. Akhirnya, saya memiliki pemahaman yang lebih dalam tentang fetch dengan membaca dokumen resmi fetch, dan akhirnya memecahkan masalah dengan mengatur mode; cors.
   Ringkasan: Kunci untuk memecahkan masalah lintas-domain terletak pada pemahaman tentang protokol xhr dan http. Perbedaan terbesar antara menentukan mode sebagai Cors dan no-cors adalah bahwa cors melewati opsi sebelum mengirim area permintaan.

Guru @sorrycc , saya juga mengalami beberapa masalah dengan pengambilan lintas domain. Setelah menggunakan permintaan pengambilan, permintaan 200 Opsi muncul di konsol. Latar belakang dapat memasuki breakpoint. Metode penilaiannya adalah GET (permintaan saya yang sebenarnya), dan front end menggunakan response.json () Data latar belakang juga dapat diperoleh, tetapi konsol tidak memiliki catatan permintaan GET, hanya Opsi. Jika Anda menggunakan ajax, semuanya normal. Konsol memiliki permintaan Opsi dan GET.

@AsceticBoy sepertinya ada masalah dengan konsol. Apakah dilengkapi dengan penyaringan?

@xaviertung Antarmuka lintas situs hanya perlu menyetel mode; kors?
Saya menambahkan kredensial: 'sertakan' di tajuk, dan saya akan melaporkan kesalahan yang mengatakan bahwa permintaan tersebut tidak diizinkan.
Debugging merepotkan sekarang. Saya harus mengubah domain biaya setiap saat dan kemudian mengkompilasi front-end dan memasukkannya ke dalam proyek back-end untuk debugging.
Bagaimana cara menyiapkan backend nginx + tomcat (musim semi) yang saya gunakan?Terima kasih

@wuyongdec perlu memeriksa apakah server terbuka untuk mengizinkan konfigurasi lintas domain.

@wuyongdec dora mendukung debugging lintas-domain

@xaviertung Server dibuka, tetapi server menolak ketika kredensial: 'sertakan' ditambahkan.

@jingchenxu Apakah ada dokumentasi?

Saya mengalami masalah ini karena proxy tidak dikonfigurasi di .roadhogrc. Perintah ini juga merupakan masalah lintas domain.

Ubah http://jsonplaceholder.typicode.com/ target ke alamat server Anda sendiri
"proxy": { "/api": { "target": "http://jsonplaceholder.typicode.com/", "changeOrigin": true, "pathRewrite": { "^/api" : "" } } }

@wuyongdec Saya juga mengalami masalah yang sama seperti Anda, apakah Anda sudah menyelesaikannya? Bagaimana cara mengatasinya?

Pisahkan ujung depan dan belakang untuk konfigurasi lintas-domain! ! ! Otentikasi non-cookie, konfigurasi otentikasi JWT! !
Selesaikan ketidakmampuan untuk permintaan lintas domain,
Pertama, jangan setel proxy di config.js. Konfigurasi ini hanya dapat digunakan untuk pengembangan lokal dan akan menjadi tidak valid setelah dibuat.

Rencana saya:
Konfigurasikan di .env (buat di direktori root jika tidak)
Saat meminta api, baca alamat server. (Ubah request.js)

nghin / apache / php server plus
add_header Access-Control-Allow-Origin * selalu; ### (Sejak Nginx 1.7.5)

add_header Access-Control-Allow-Methods GET, POST, OPSI, HEAD, PUT;
add_header Access-Control-Allow-Headers "Otorisasi, Jenis Konten";

Fentch ujung depan:
credentials: 'omit' // Artinya cookie tidak akan dikirim, dan permintaan lintas domain diperlukan
header: {
Otorisasi: localStorage.getItem ('login-token'),
}

Diantaranya, "Otorisasi" mengacu pada konfigurasi berbeda dari server yang berbeda, bergantung pada metode otentikasi sisi server

Catat apa yang saya lakukan di sini.
Jika nama domain tidak konsisten, pastikan backend mendukung lintas domain.
Tidak peduli itu 200 400500, itu harus membawa Access-Control-Allow-Origin dan informasi lainnya.
Dua parameter berikut dilakukan di tajuk pengambilan

{
  mode: 'cors',
  credentials: 'include',
}

Server nginx menulis header berikut

add_header Access-Control-Allow-Credentials: true
Access-Control-Allow-Headers: Keep-Alive,User-Agent,Cache-Control,Content-Type,Authorization,sbid
Access-Control-Allow-Methods: GET, POST, OPTIONS
Access-Control-Allow-Origin: 你的域名

Pada saat ini, hapus posting dan sebagainya semua dapat bekerja secara normal,
Namun, saat mengalami masalah lain, nginx kehilangan Access-Control-Allow-Origin dan informasi lainnya saat mengembalikan 401, yang mengakibatkan kegagalan untuk mendapatkan status respons di 401 (https://github.com/github/fetch/issues/201 # Issuecomment-141777867)
Solusi, nginx selalu menambahkan
Sintaks: | nilai nama kepala_jumlah [selalu];
http, server, lokasi, jika di lokasi

server {
  listen       80;
  server_name  www.google.com;

  #charset koi8-r;
  #access_log  /var/log/nginx/host.access.log  main;

  location / {
    if ($request_method = 'OPTIONS') { 
      add_header Access-Control-Allow-Origin 'http://www.baidu.com' always;
      add_header Access-Control-Allow-Credentials 'true' always; 
      add_header Access-Control-Allow-Methods 'GET, POST, OPTIONS' always;
      add_header Access-Control-Allow-Headers 'Keep-Alive,User-Agent,Cache-Control,Content-Type,Authorization,sbid' always;    
      return 200; 
    }

    root   /home/wwwroot/php;
    index  index.php index.html index.htm;
    try_files $uri $uri/ /index.php?$args;
  }

  location ~ \.php$ {
    add_header Access-Control-Allow-Origin 'http://www.baidu.com' always;
    add_header Access-Control-Allow-Credentials 'true' always; 
    add_header Access-Control-Allow-Methods 'GET, POST, OPTIONS' always;
    add_header Access-Control-Allow-Headers 'Keep-Alive,User-Agent,Cache-Control,Content-Type,Authorization,sbid' always;  
    root /home/wwwroot/php/;
    fastcgi_pass 127.0.0.1:9000;
    fastcgi_index index.php;
    fastcgi_param SCRIPT_FILENAME           $document_root$fastcgi_script_name;
    include fastcgi_params;
  }  
}

server {
  listen       80;
  server_name  www.baidu.com;

  #charset koi8-r;
  #access_log  /var/log/nginx/host.access.log  main;

  location / {
    root   /home/wwwroot/view;
    try_files $uri $uri/ /index.html;
  }  
}