พื้นหลัง
หลายโครงการที่เราทำอยู่ตอนนี้แยกออกจากด้านหน้าและด้านหลังซึ่งนำไปสู่ปัญหาที่พบบ่อยมาก หน้าและอินเทอร์เฟซของเราอยู่ภายใต้ชื่อโดเมนที่แตกต่างกัน เมื่อเราเข้าถึงอินเทอร์เฟซแบ็กเอนด์ผ่าน AJAX ปัญหาข้ามโดเมนจะเกิดขึ้น เราจะแก้ปัญหานี้ได้อย่างไร? โดยทั่วไปมีวิธีแก้ปัญหาสองวิธีคือ Cors และ JSONP ฤดูใบไม้ผลิทำให้การกำหนดค่าของ CORS ง่ายขึ้นลองดูที่ CORS ที่ให้ไว้
คำอธิบายปัญหาข้ามโดเมน
การพัฒนาเว็บมักจะพบปัญหาข้ามโดเมนและการแก้ปัญหา ได้แก่ : JSONP, IFRAME, CORS ฯลฯ
Cors เทียบกับ JSONP:
1. JSONP สามารถดำเนินการตามคำขอได้เท่านั้นในขณะที่ CORS รองรับคำขอ HTTP ทุกประเภท
2. การใช้ CORS นักพัฒนาสามารถใช้ XMLHTTTPREQUEST ทั่วไปเพื่อเริ่มต้นการร้องขอและรับข้อมูลซึ่งมีการจัดการข้อผิดพลาดที่ดีกว่า JSONP
3. JSONP ส่วนใหญ่ได้รับการสนับสนุนโดยเบราว์เซอร์เก่า พวกเขามักจะไม่สนับสนุน CORS และเบราว์เซอร์ที่ทันสมัยส่วนใหญ่รองรับ CORS อยู่แล้ว
วัตถุ WebMVCCONFigurer
เราสามารถเริ่มต้นวัตถุ WebMVCCONFigurer เพื่อกำหนดค่าการแมป CORS ของเรา
@ConfigurationPublic คลาส corscongiguration {@bean public webmvcconfigurer corsconfigurer () {ส่งคืน webmvcconfigureradapter ใหม่ () {@Override โมฆะสาธารณะ AddCorsMappings (Corsregistry Registry) // readedorigins ("http://domain2.com") // ระบุชื่อโดเมนต้นทาง // .allowedmethods ("ใส่", "ลบ") // .allowedheaders ("header1", "header2", "header3") // .exposedheaders ("header1", ") - -สืบทอด webmvcconfigureradapter
วิธีนี้คล้ายกับวิธีการข้างต้นมาก
@configuration @enablewebmvcpublic คลาส corsconfiguration_2 ขยาย webmvcconfigureradapter {@Override โมฆะสาธารณะ addCorsMappings (corsregistry registry) {registry.addmapping ("/api/**"); -ตัวกรอง
วิธีนี้ไม่ค่อยใช้ในขณะนี้
@component@enablewebmvcpublic คลาส corsfiltercongiguration ขยาย corsfilter {public corsfiltercongiguration (corsconfigurationsource configsource) {super (configsource); } @Bean Public FilterRegistrationBean Corsfilter () {urlbasedCorsConfigurationsource แหล่งที่มา = ใหม่ urlbasedCorsConfigurationSource (); corsconfiguration config = new corsconfiguration (); config.setallowcredentials (จริง); config.addallowedorigin ("*"); // config.addallowedorigin ("http://domain1.com"); config.addallowedheader ("*"); config.addallowedmethod ("*"); source.registerCorsConfiguration ("/api/**", config); FilterRegistrationBean Bean = ใหม่ FilterRegistrationBean (Corsfilter ใหม่ (แหล่งที่มา)); Bean.setOrder (0); // จะต้องส่งคืนถั่วก่อนตัวกรองทั้งหมด -ข้างต้นเป็นเนื้อหาทั้งหมดของบทความนี้ ฉันหวังว่ามันจะเป็นประโยชน์ต่อการเรียนรู้ของทุกคนและฉันหวังว่าทุกคนจะสนับสนุน wulin.com มากขึ้น