由于项目采用的微服务框架,前端与后端交互难免有跨域的问题。abp vnext实现跨域也很简单,只需要设置几处就可以了,这里只讲全局的跨域,至于局部的Action如何跨域请自行搜索.netcore 跨域相关的知识。
1、修改appsettings.json 下的App:CorsOrigins节点,把前端的域名加进来。比如
"App": { "CorsOrigins": "https://*.Test.com,http://localhost:4200,http://localhost:2213" }
2、abp vnext 已经默认跨域的配置代码如下:
context.Services.AddCors(options => { options.AddPolicy(DefaultCorsPolicyName, builder => { builder .WithOrigins( configuration["App:CorsOrigins"] .Split(",", StringSplitOptions.RemoveEmptyEntries) .Select(o => o.RemovePostFix("/")) .ToArray() ) .WithAbpExposedHeaders() .SetIsOriginAllowedToAllowWildcardSubdomains() .AllowAnyHeader() .AllowAnyMethod() .AllowCredentials(); }); });
这样调试,前端就可以访问了。
这样就完了吗。还没说完呢,说一个我遇到的坑,就是我调试时发现前端调用后端登录接口,后端用调试模式或者用Debug启动服务都没问题。但是后端用Release启动却发现前端怎么也调用不了。前端错误日志提示不允许跨域,我当时就想我明明设置了啊,难道这块Release与Debug哪里不同的设置还?就搜索全网各种资料都没有解决。
然后我就冷静思考下,我用restclient看看是否允许访问接口。结果发现也不行,这时我就想可能不是跨域问题了,就去看后端日志了,结果发现居然是配置的swagger的问题。默认调试模式生成了xml文档,但是到了Release下就没有生成,这时调用接口发生了错误。于是把swagger改成只有在调试开发环境下才使用的,这下问题就解决了。这块没少费我时间,这里说出来,能给大家减少点时间浪费。
swagger 配置改成这样
if (env.IsDevelopment()) { app.UseSwagger(); app.UseSwaggerUI(options => { options.SwaggerEndpoint("/swagger/v1/swagger.json", "Support APP API"); }); }
以上就说完了跨域相关的了。