【vue oidc-client】invalid_requestRequest Id: 0HN0OOPFRLSF2:00000002

【vue oidc-client】invalid_requestRequest Id: 0HN0OOPFRLSF2:00000002_第1张图片

需求:完成统一登录,需要从三方平台跳到我们的平台。

oidc-client报错记录。这个一般是配置信息出错,需要和三方平台进行沟通,一定要把client_id,密钥进行对应;

【vue oidc-client】invalid_requestRequest Id: 0HN0OOPFRLSF2:00000002_第2张图片

同时关于此次出错还修改了以下代码,以供参考:

删除了关于配置项的这段代码:

【vue oidc-client】invalid_requestRequest Id: 0HN0OOPFRLSF2:00000002_第3张图片

修改回调地址在后面增加‘?’,并修改源代码以提取token:

【vue oidc-client】invalid_requestRequest Id: 0HN0OOPFRLSF2:00000002_第4张图片

在node_modules里面的oidc-client文件夹里面全局搜索readSigninResponseState()函数,强制将它的token截取规则改为'?'。注意多个文件都有这个函数,都得改。

【vue oidc-client】invalid_requestRequest Id: 0HN0OOPFRLSF2:00000002_第5张图片

【vue oidc-client】invalid_requestRequest Id: 0HN0OOPFRLSF2:00000002_第6张图片

注意,改完需要切换到oidc-client目录,装依赖 npm install,打包 npm run build。这样打包项目,就会用我们改过的oidc-client组件。

或者可以尝试更新oidc-client的版本或者降低版本,可能这个bug就好了(我并没有尝试。。。)

然后还牵扯到后端服务器配置的问题,因为这个要求https,我们当时接口用的都是http,所以登录成功进入我们平台后又卡在loading界面了。这个处理的方法,简单听后端讲了下,需要反向代理,映射url。

安装了2个插件

【vue oidc-client】invalid_requestRequest Id: 0HN0OOPFRLSF2:00000002_第7张图片

进行url重写映射

【vue oidc-client】invalid_requestRequest Id: 0HN0OOPFRLSF2:00000002_第8张图片

你可能感兴趣的:(vue2,vue.js,前端,javascript,后端)