关于react开发的项目接公司内部权限平台调试遇到的问题总结

关于react开发的项目接公司内部权限平台调试遇到的问题总结

问题描述

1. 公司的各个系统登录都需要经过sso验证，包括接口都需要经过sso验证
2. 项目都是需要域名去访问（ip访问是过不了sso的）所以我在本地开发的时候用nginx去分发端口

遇到的问题

• 由于接口都是需要经过sso验证，sso会产生一个ticket用来验证，验证不通过返回401重新跳转sso登录拿到ticket，所以获取用户信息就得将ticket给到权限中台去验证，但是我本地开发在host文件绑定的域名是我本地的域名，而后端的接口的域名和我本地的域名是不一样的，所以ticket验证通过不了，唯一的办法就是前后端都在同一个域名下，才能测试登录逻辑
• 这样的话就得把前后端打包上到测试环境去测试，但是这样会很繁琐，改动一点就得打包上线一次，上线一次得十分钟，前端上线真的慢！！！

尝试解决的办法

1. 既然是需要同一个域名，那就把我本地的域名改成和后端一样的域名，用nginx去分发，前端分发到本地ip，后端接口分发到后端ip上

   问题：因为后端已经部署到容器上了，我分发到容器的ip上话，就绕过了权限中台，依然拿不到用户信息

   然后就改成分发到权限中台的ip

   问题： 因为权限中台必须是https协议访问，而用nginx分发的话只能是http协议，所以还是不行

   历经了半下午的时间，此方法放弃了，然后思考了很久，脑子里突然闪过两个词（正向代理，反向代理），在另一个小姐姐的建议下开始尝试第二种方法

   ···中间经过了很长时间的前端建立流水线上线等问题···

2. 既然上一种办法不行，那就尝试用抓包工具charles 将域名下的资源换成我本地的资源，
   也就是将测试环境域名指向我本地build后的dist的文件夹，当然这中间也经历了从不会使用charles到勉强可以Map Local成功···
   方法是执行成功了，但是···

   问题：sso登录成功后会跳转回登录前的页面，这个跳转就跳转到了线上资源，具体过程我没弄明白，就是跳转过后域名的资源不再指向我本地dist文件。所以···又失败了

   所以最后我也没有成功，我本意只是想测试一下登录逻辑正不正确，最后还是打包上测试环境后测试了一下，幸好写的逻辑就没问题了测试一遍就通过了，这也是挺幸运的，不然改一点打个包上个线，这过程真是不太敢想···

收获

其实也并不是没有收获，最起码后续的调试都可以用charles将某个文件指向本地资源去测试，这算是最欣慰的一点吧

对，你看的没错！！！后续调试修改bug都不能在本地调试了。因为想在本地调试，得把登录的逻辑注释掉，让后端把接口的sso验证关掉，这中间的改动还不小，很麻烦哎，我这人最怕麻烦··· 唉

项目最终成功跑起来了，遇到的问题算是解决了一半吧，登录逻辑还是相当于打包在测试环境测试的，幸好没有报错，，其它的bug调试可以在本地改完代码用charles调试一下，最后一起打包上测试环境，避免的频繁无法调试的问题