素材巴巴 > 程序开发 >

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

程序开发 2023-09-02 16:57:48

今天遇到一个调用服务端接口跨域问题,我用本地的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


标签:

素材巴巴 Copyright © 2013-2021 http://www.sucaibaba.com/. Some Rights Reserved. 备案号:备案中。