angular中涉及rxjs请求beego接口跨域问题解决

今天遇到一个调用服务端接口跨域问题，我用本地的angular运行项目，访问本地的beego接口，发现请求接口状态404，并且接口方法还是OPTIONS。一查知道是跨域了，在网上搜索一些跨域访问的方法，发现跨域时访问可以了，但正常post接口却没有调起，也就是OPTIONS访问通了并且访问状态为200成功状态，理应该OPTIONS通了应当要请求正常访问为的post业务接口。

最后找到原因，在此记录下，希望遇到同样问题的同学少走弯路。

原因是angular请求时用户凭证开启了（withCredentials=true）图1，服务端预检OPTIONS返回的头部信息为（Access-Control-Allow-Origin:*），查了相关资料，Access-Control-Allow-Origin信息需要绑定指定的源域名（Access-Control-Allow-Origin:http://localhost:4200）图2，源域名是angular项目域名

 

在beego中 beego.Run()前执行以下代码

    beego.InsertFilter("*", beego.BeforeRouter,

        cors.Allow(&cors.Options{

            // AllowAllOrigins: true, #注意此设置开了后，响应头部信息为*会导致不成功，（Access-Control-Allow-Origin: * ）

            AllowOrigins: []string{"http://localhost:4200"}, //绑定源域名

            AllowMethods: []string{"PUT", "PATCH"},

            AllowHeaders: []string{"Origin", "Content-Type"},

            ExposeHeaders: []string{"Content-Length"},

            AllowCredentials: true,

        }))

 

图1

 

 

图2