springboot 做前后端分离，ajax 跨域请求问题 ajax 跨域条件：只要协议、域名、端口有任何一个不同，都被当作是不同的域 前后端分离：即将后端服务层与前端展示层分别开发和部署，因而产生两个需要打包 发布的项目， 将两个分别部署后，前端再去请求后端就会产生跨域请求的问题。 两种解决方案， 解决方案一，使用跨域方案 步骤： 服务端，springboot 配置中，增加配置跨域配置代码： package com.zx.zweb.conf; import org.springframework.context.annotation.Bean; import org.springframework.context.annotation.Configuration; import org.springframework.web.cors.CorsConfiguration; import org.springframework.web.cors.UrlBasedCorsConfigurationSource; import org.springframework.web.filter.CorsFilter; @Configuration public class CorsConfig { private CorsConfiguration buildConfig() { CorsConfiguration corsConfiguration = new CorsConfiguration(); corsConfiguration.addAllowedOrigin("*"); // 1 允许任何域名使用 corsConfiguration.addAllowedHeader("*"); // 2 允许任何头 

corsConfiguration.addAllowedMethod("*"); // 3 允许任何方法（post、get 等） return corsConfiguration; } @Bean public CorsFilter corsFilter() { UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource(); source.registerCorsConfiguration("/**", buildConfig()); // 4 return new CorsFilter(source); } } 客户端请求，不用做任何修改，仍然如下 $.ajax({ type : "POST" , url : "http://127.0.0.1:9080/sysUserAccount/search" , contentType : "application/json", dataType : "JSON", data : JSON.stringify(sysUserAccount), success : function(data) { alert("ok") }, error : function(data) { alert("err") } }); 

解决方案二，采用 server+nginx，原理是用 nginx 代理分别代理两个 server，让这 2 个 server 处于统一服务下， 这样就可以实现本地访问了 步骤： 在 nginx 中增加代码，代理后端项目 location / { proxy_pass http://127.0.0.1:9080; index index.html index.htm; #Proxy Settings IP # 后端的 Web 服务器可以通过 X-Forwarded-For 获取用户真实 off; proxy_redirect proxy_set_header Host proxy_set_header X-Real-IP proxy_set_header X-Forwarded-For $host; $remote_addr; $proxy_add_x_forwarded_for; http_502 http_503 http_504; proxy_next_upstream error timeout invalid_header http_500 proxy_max_temp_file_size 0; proxy_connect_timeout 90; # nginx 跟后端服 务器连接超时时间(代理连接超时) 

proxy_send_timeout 90; # 连接成功后，后 端服务器发送时间(代理接收超时) proxy_read_timeout 90; # 连接成功后，后 端服务器响应时间(代理接收超时) proxy_buffer_size 4k; # 设置代理服务器（nginx） 保存用户头信息的缓冲区大小 proxy_buffers 网页平均在 32k 以下的话，这样设置 4 32k; # proxy_buffers 缓冲区， proxy_busy_buffers_size 64k; # 高负荷下缓冲大 小（proxy_buffers*2） proxy_temp_file_write_size 64k; # 设定缓存文件夹 大小，大于这个值，将从 upstream 服务器传 } } 代理前端 html 项目 location /zweb { add_header Cache-Control no-cache; add_header Access-Control-Allow-Origin *; root D:/zweb; #显示的根索引目录 } 在 ajax 中，去掉端口，使用 nginx 代理的请求地址 $.ajax({ type : "POST" , 

url : "http://127.0.0.1/sysUserAccount/search" , contentType : "application/json", dataType : "JSON", data : JSON.stringify(sysUserAccount), success : function(data) { alert("ok") }, error : function(data) { alert("err") } }); 总结 一：实现跨域请求； 优点：简单，不用做任何修改，请求远程与本地没任何区别 缺点：带来技术问题跨域 cookies 共享 二：server+nginx 代理 优点：略 确定：稍微复杂一下