Spring Boot: So lösen Sie Cross-Origin-Probleme

Beschreibung des Cross-Origin-Problems

Möglicherweise wird die folgende Fehlermeldung angezeigt:

wurde durch die CORS-Richtlinie blockiert: Auf der angeforderten Ressource ist kein „Access-Control-Allow-Origin“-Header vorhanden

Dieser Fehler weist darauf hin, dass eine Anfrage an eine bestimmte Adresse vom CORS-Protokoll blockiert wurde, weil der Access-Control-Allow-Origin-Header in der Ressource fehlt.

Analyse ursprungsübergreifender Probleme

Die Hauptursache für Cross-Origin-Probleme liegt darin, dass Browser aus Sicherheitsgründen den Zugriff auf Ressourcen außerhalb der aktuellen Site einschränken.

Stellen Sie sich zum Beispiel eine Website vor, die unter http://127.0.0.1:8080/ mit einer bestimmten Seite gehostet wird. Wenn Sie von derselben Site aus auf Ressourcen zugreifen, gibt es keine Einschränkungen. Wenn Sie jedoch versuchen, von einer anderen Site aus auf Ressourcen zuzugreifen (z. B. http://127.0.0.1:8081), blockiert der Browser die Anfrage.

Hinweis: Wir betrachten Protokoll, Domäne und Port als Teil der Definition eines „gleichen Ursprungs“.

Elemente mit einem src-Attribut, wie img- und script-Tags, unterliegen dieser Einschränkung nicht.

In der Vergangenheit, als Front-End und Back-End nicht getrennt waren, existierten Seiten und Anforderungsschnittstellen unter derselben Domäne und demselben Port. Browser würden dann Anfragen von einer Seite, die in einer Domain gehostet wird, erlauben, Ressourcen von derselben Domain anzufordern.

Zum Beispiel kann http://127.0.0.1:8080/index.html http://127.0.0.1:8080/a/b/c/userLit frei anfordern.

Heutzutage, da Front-End und Back-End in verschiedene Anwendungen getrennt sind, ist dies nicht zulässig und führt zu CORS-Problemen.

Was ist Ursprung und Cross-Origin?

Ursprung (oder Quelle) besteht aus dem Protokoll, der Domäne und der Portnummer.

Eine URL besteht aus Protokoll, Domäne, Port und Pfad. Zwei URLs gelten als „gleicher Ursprung“, wenn ihr Protokoll, ihre Domäne und ihr Port alle identisch sind. Jeder Unterschied in einem dieser drei Elemente stellt eine herkunftsübergreifende Anfrage dar.

Erwägen Sie herkunftsübergreifende Vergleiche für https://www.baidu.com/index.html:

Apakah Dasar Asal Sama?

Dasar Asal Sama ialah ciri keselamatan pelayar asas. Tanpanya, kefungsian biasa penyemak imbas mungkin berisiko. Seni bina web sangat bergantung pada dasar ini dan penyemak imbas melaksanakannya untuk memastikan keselamatan.

Dasar Asal Sama termasuk:

1. Dasar Asal Sama DOM: Menghalang manipulasi DOM bagi halaman asal yang berbeza. Terpakai terutamanya pada senario iframe silang asal yang mana iframe domain berbeza tidak boleh mengakses satu sama lain.
2. Dasar XMLHttpRequest Same-Origin: Melarang permintaan HTTP ke asal yang berbeza menggunakan objek XHR.

Menyelesaikan Isu Silang Asal dalam But Spring

1. Mencipta Penapis untuk Mengendalikan CORS

Dalam projek di mana bahagian hadapan dan bahagian belakang digunakan secara berasingan, menangani CORS adalah penting. Kuki digunakan untuk menyimpan maklumat log masuk pengguna, dan pemintas Spring mengurus kebenaran. Isu timbul apabila pemintas dan CORS diproses dalam susunan yang salah, menyebabkan ralat CORS.

Permintaan HTTP terlebih dahulu melalui penapis sebelum mencapai servlet dan kemudian pemintas. Untuk memastikan pemprosesan CORS berlaku sebelum pemintasan kebenaran, kami boleh meletakkan konfigurasi CORS dalam penapis.

@Configuration
public class CorsConfig {

    @Bean
    public CorsFilter corsFilter() {
        CorsConfiguration corsConfiguration = new CorsConfiguration();
        corsConfiguration.addAllowedOrigin("*");
        corsConfiguration.addAllowedHeader("*");
        corsConfiguration.addAllowedMethod("*");
        corsConfiguration.setAllowCredentials(true);

        UrlBasedCorsConfigurationSource urlBasedCorsConfigurationSource = new UrlBasedCorsConfigurationSource();
        urlBasedCorsConfigurationSource.registerCorsConfiguration("/**", corsConfiguration);
        return new CorsFilter(urlBasedCorsConfigurationSource);
    }
}

2. Mengkonfigurasi CORS dalam WebMvcConfigurer

Walaupun JSONP boleh menangani isu silang asal pada bahagian hadapan, ia hanya menyokong permintaan GET, yang mengehadkan dalam aplikasi RESTful. Sebaliknya, anda boleh mengendalikan permintaan silang asal dengan Perkongsian Sumber Silang (CORS) di bahagian belakang. Penyelesaian ini bukan unik untuk Spring Boot dan telah digunakan dalam rangka kerja SSM tradisional. Anda mengkonfigurasinya dengan melaksanakan antara muka WebMvcConfigurer dan mengatasi kaedah addCorsMappings.

@Configuration
public class CorsConfig implements WebMvcConfigurer {

    @Override
    public void addCorsMappings(CorsRegistry registry) {
        registry.addMapping("/**")
                .allowedOrigins("*")
                .allowCredentials(true)
                .allowedMethods("GET", "POST", "PUT", "DELETE", "OPTIONS")
                .maxAge(3600);
    }
}

3. Mengkonfigurasi CORS dalam Pengawal

Anda boleh mendayakan CORS untuk kaedah pengawal tertentu dengan menambahkan anotasi @CrossOrigin pada anotasi @RequestMapping. Secara lalai, @CrossOrigin membenarkan semua asal dan kaedah HTTP yang dinyatakan dalam @RequestMapping.

@RestController
@RequestMapping("/account")
public class AccountController {

    @CrossOrigin
    @GetMapping("/{id}")
    public Account retrieve(@PathVariable Long id) {
        // ...
    }

    @DeleteMapping("/{id}")
    public void remove(@PathVariable Long id) {
        // ...
    }
}

Memahami Parameter @CrossOrigin：

• @CrossOrigin tanpa parameter membenarkan semua URL mengakses.
• @CrossOrigin(origins = "http://127.0.0.1:8080") mengehadkan akses kepada URL yang ditentukan.
• Anotasi ini boleh digunakan pada kelas atau kaedah.
• Atribut nilai atau asal usul menentukan URL yang dibenarkan.
• maxAge menunjukkan umur maksimum dalam saat untuk cache permintaan prapenerbangan.
• allowCredentials menunjukkan sama ada bukti kelayakan (kuki) dibenarkan. Lalai adalah palsu.
• allowedHeaders menentukan pengepala permintaan yang dibenarkan.
• kaedah menentukan kaedah permintaan yang dibenarkan, lalai ialah GET, POST, HEAD.

Sebab @CrossOrigin Mungkin Tidak Berfungsi

1. Versi MVC musim bunga mestilah 4.2 atau lebih tinggi untuk menyokong @CrossOrigin.
2. Permintaan yang salah mungkin muncul sebagai isu silang asal disebabkan oleh respons pelayan yang tidak betul.
3. Jika menambahkan @CrossOrigin di atas anotasi Pengawal masih mengakibatkan isu, satu penyelesaian yang mungkin adalah dengan menentukan kaedah HTTP dalam @RequestMapping.

Contoh:

@CrossOrigin
@RestController
public class PersonController {

    @RequestMapping(method = RequestMethod.GET)
    public String add() {
        // some code
    }
}

Das obige ist der detaillierte Inhalt vonSpring Boot: So lösen Sie Cross-Origin-Probleme. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!