Web前台跨域问题：

Web前台跨域问题： 前台调用接口出现跨域问题原因： 本地HTML和服务器的接口不在同一域名下 解决： 方法一：前台ajax使用jsonp向后台请求，但是仅限get请求，jsonp不支持post请求 方法二：使nginx进行静态资源部署，将HTML网页和后台接口放同一域名下。 HTML在本地测试运行服务器上的接口会报跨域问题，通过在后台解决，前台获取回调信息将数据库中的数据返回web前台 方法一：暂时解决 Java后台： 定义抽象类： public class AbstractController { public void print(String callback,String result, HttpServletResponse res){ try { res.getWriter().write(callback + "("+JSONObject.toJSONString(result)+")"); } catch (IOException e) { e.printStackTrace(); } } } 在控制类中： /** * 查询所有行业 * @param userId * @param pageNum * @param pageSize * @return */ @RequestMapping(value = "/industryList") public void industryList( @RequestParam("callback") String callback, HttpServletResponse res) { Result<List<IndustryAllDto>> rs = new Result<List<IndustryAllDto>>(); ArrayList<IndustryAllDto> newlist = new ArrayList<IndustryAllDto>(); List<IndustryDto> onedto = industryService.findAll(); for (int i = 0; i < onedto.size(); i++) { IndustryAllDto allDto = new IndustryAllDto(); IndustryDto industryDto = onedto.get(i); Long oneId = industryDto.getId(); List<IndustryTwoDto> twodto =industryTwoService.findById(oneId); allDto.setId(oneId); allDto.setName(industryDto.getName()); allDto.setIndustryTwoDto(twodto); newlist.add(allDto); } rs.setData(newlist); print(callback,JSONObject.toJSONString(rs),res); } 在web前端ajax中： $(".next a").click(function(){

			var formData=new FormData($("#form_34")[0]); 
    		$("#form_34 #zx_aimg").attr("value",$("#form_34 #zx_aimg").val());

// $("#form_34 .Cls").attr("value",$("#form_34 .Cls").val()); $(".Cls input").attr("value",$(".Cls input").val()); formData.append("userId",303); $.ajax({ type: "get",
url:"http://api.apsc.com.cn/app/authentication/taxInd",
dataType:"jsonp", //请求支持jsonp async: false, jsonp: "callback", //服务端用于接收callback调用的function名的参数
jsonpCallback: "jsonp1", //callback的functio data:formData, contentType:false, processData:false, success:function(data){ console.log(data); } }); // location.href="File_ audit_5.html"

		})

方法二：根本解决 将前台HTML网页使用nginx进行部署，在服务器上绑定域名，域名和后台war包在同一域名下，与HTML相关文件夹绑定，将HTML网页放文件夹中，即可解决跨域问题 Java后台： /** * 查询所有行业 * @param userId * @param pageNum * @param pageSize * @return */ @RequestMapping(value = "/industryList") public Result<List<IndustryAllDto>> industryList() { Result<List<IndustryAllDto>> rs = new Result<List<IndustryAllDto>>(); ArrayList<IndustryAllDto> newlist = new ArrayList<IndustryAllDto>(); List<IndustryDto> onedto = industryService.findAll(); for (int i = 0; i < onedto.size(); i++) { IndustryAllDto allDto = new IndustryAllDto(); IndustryDto industryDto = onedto.get(i); Long oneId = industryDto.getId(); List<IndustryTwoDto> twodto =industryTwoService.findById(oneId); allDto.setId(oneId); allDto.setName(industryDto.getName()); allDto.setIndustryTwoDto(twodto); newlist.add(allDto); } rs.setData(newlist); return rs; } web前台： 在本地测试时，将HTML放置在本地的nginx下的HTML文件夹下面，运行nginx即可访问服务器的接口，解决跨域问题 Ajax不用jsonp传输

转载于:https://my.oschina.net/u/3727427/blog/1842294