前后端联调接入第三方接口之302游戏大作战的故事

业务背景:  接入第三方接口，获取用户名，实现用户登陆

接口采用Java编写，我们的平台前端业务使用React.js  后端采用PHP实现数据接口

业务流程:  前端向后端发请求，后端调用第三方接口，第三方接口实现跳转并跳转到登陆页面，登陆页面里面有一个回调地址，也就是登陆成功以后返回到调用该接口的地址。目标是返回到前端首页，并显示用户名。

302游戏大作战 关卡1 :由于react.js使用的fetch方法是使用ajax进行请求，所以跳转登陆页面是不成功的，被拦截掉了，也就是跳不出去。

302游戏大作战关卡2: 可不可以自己改变后边的回调地址，改成前端地址。====》不行，回调地址应该和后端请求地址相同。

302游戏大作战副本篇: 中间请教了很多同事，通过他们的分析，让我们更深刻的理解了里面的这个流程，也尝试了一下其他方法还是没有成功，也看了很多接入这个接口的系统，请教了下他们，发现他们的系统和我们不是很一样，他们的系统是通过一个域名都可以访问的到，我们的前后端是完全分离，部署在两台nginx上面，监听的端口也不一样，所以我们的比较特殊。中间和前端联调两个人的语气都不好了（不要放弃，控制情绪，积极分析），很无奈也挺崩溃的，请教了很多人，也尝试了很多方法，最后还是没有成功。

庆幸的是我们还没放弃，还在坚持的尝试。

302游戏大作战通关篇：由于后端需要调用第三方接口进行调整，登陆成功以后回调到后端请求的地址。当302重定向的时候前端跳不出去，我们可以通过一个接口来判断是否登陆，如果没有登陆，给前端一个标识，让前端自己跳转，等到前端跳转完成它的回调地址还是后端请求的地址，里面还是会回调到后端的地址，然后后端的地址再进行一次302跳转到前端，这次前端再次发送第一个请求判断是否登陆， 如果已经登陆，就不需要发送第二个请求了，这里获取到用户名了，到了这里，终于还是把302重定向这个关卡通过了！撒花