后台SpringBoot通过@CrossOrigin实现跨域，前台可以直接调用跨域，后台controller可以参考@CrossOriginpublicclassDutyControllerextendsBaseController{@AutowiredDutyServicedutyService;@ApiOperation(value="Paginggettest",notes="Paginggettest",produces="application/json")@ApiImplicitParams({@ApiImplicitParam(paramType="header",dataType="String",name="token",example="token-swagger",required=true),@ApiImplicitParam(name="page_no",value="username",dataType="int",paramType="query",example="1"),@ApiImplicitParam(name="page_size",value="userid",dataType="int",paramType="query",example="10")})}前端vue程序中，如果配置了vue的proxy之前跨域代理，请先注释掉，然后创建开发（部署）文件---.env.development和生产（prod）环境变量文件---.env.production.env.development文件内容在项目和目录#只是一个flagENV='development'#baseapi#这个变量主要用于mockjs的模拟登录#如果实现后台登录，就不用配置两个api，直接用一个base-urlVUE_APP_BASE_API='/dev-api'#这个rul主要是测试期间使用的BusinessAP我测试了#monitormanageapiVUE_APP_MONITOR_MANAGE_API='http://localhost:8081/monitor_manage'#vue-cli使用VUE_CLI_BABEL_TRANSPILE_MODULES环境变量，#控制babel-plugin-dynamic-import-node插件是否启用。#它通过将所有import()转换为require()来完成一件事。#当你有大量页面时，这个配置可以显着提高热更新的速度。#详情：https://github.com/vuejs/vue-cli/blob/dev/packages/@vue/babel-preset-app/index.js#这个变量用于npmrundev打包mockjs时调用es6语法。具体可以看上面vue-template-admin的官方说明VUE_CLI_BABEL_TRANSPILE_MODULES=true.env.productionfilecontent#justaflagENV='production'#baseapiVUE_APP_BASE_API='/prod-api'VUE_APP_MONITOR_MANAGE_API='http://188.131.222.102:8181/monitor_manage/'在axios调用api的地方，可以使用环境变量设置baseurl，例如src/api/console.jsdutyconsoleapicallimportrequestfrom'@/utils/request'request。defaults.baseURL=process.env.VUE_APP_MONITOR_MANAGE_API//列出附近的3天数据接收任务exportfunctionget3dayList(data){returnrequest({url:'/api/receive-task/list-3day-recent',method:'get',params:data})}//processby按发生时间倒序分页exportfunctiongetStepEventList(data){returnrequest({url:'/api/event/step-event-page',method:'get',params:data}).then(e=>format(e,'flow'))}这种跨域方案的好处是不需要配置vueproxyTable，避免配置nginx代理。npmdev和build互不影响，开发测试和生产部署时无需修改生成API调用地址。本次跨域方案要求后端springboot服务使用@CrossOrigin支持跨域。目前我也尝试过在后台使用Filter代替@CrossOrigin进行跨域。但是，此解决方案无法解决方法选项请求。restful跨域时，前端一般需要在header中写入token信息，这会让浏览器在跨域时发起option请求，从而导致filterscheme失效。有时间的话可以看看@CrossOrigin。应该可以通过拦截器或者过滤器实现后台全局交叉。域支持。
