1
snailsir 2017-02-10 09:44:35 +08:00 2
url_encode 一下啊
|
2
xiaomajia008 OP @snailsir
感谢你的回复,我试过了。 http://www.abc.com/acts/#/share/20170101/ encode 之后,通过那个获取 code 的 url 跳转之后 变成了 http://www.abc.com/acts/?code=xxxx&state=STATE#/share/20170101/ 。。。。路由被破坏了。 |
3
bombless 2017-02-10 10:09:41 +08:00 via Android
微信就是这样设计的。看来你要让路由更聪明点自己处理查询串,或者把你 hash 带到查询串里面再由后端跳到一个没有查询串且 hash 也正常的地址
|
4
congminghaoxue92 2017-02-10 10:17:38 +08:00
微信的跳转是跳转到页面的,而不是页面上的锚点。
你的 url :'http://www.abc.com/acts/#/share/20170101/ '改掉'#','#'号后面代表是锚点;'http://www.abc.com/acts/#abc/dde'和'http://www.abc.com/acts/#/share/20170101/ '是指向同一个页面的。 |
5
qiayue 2017-02-10 10:20:42 +08:00
redirect_uri 你用一个新网址,这个网址对应的程序是没有界面的,后端处理完之后,你自己跳转回 vue 做的页面
|
6
Sunyanzi 2017-02-10 10:26:18 +08:00
我想知道你用前端接微信返回的话你准备怎么处理 code 和 state ..?
跳转链接和返回本来就是后端活儿 ... 包括 state 的验证也是 ... 你需要做的是跳一个类似 /wx/authorize 这样的 URL 由后端 redirect 到微信的 authorize 去 ... 同时 redirect_uri 也是后端维护的 ... 接收返回获得用户的信息和登录态才会再跳回前端 ... |
7
jarlyyn 2017-02-10 11:01:47 +08:00
有,去年年底某次改版改掉的,正好项目刚上线,客户反馈过来查了很久,蛋疼。之前都可以用
解决方案: 在执行前端 app 前预先处理 url ,直接 push 一个 statue 。 具体来说就是在 app.js 的头部加入 var search=location.search; if (search.length>0){history.pushState({},'web title','#wechatreturn'+search);} 不知道那些说之前就这样设计的,还有说跳转链接和返回的后端的活的是几个意思。 做一个接口, Post 一下获取登录地址,直接 location=跳转过去就可以 oauth 登录了。 再做一个接口,把得到的 search 直接 Post 到接口取得登录信息就可以了。 如果前端或者后台只熟一个,这么自信去评论自己不熟的部分不好 |
9
jarlyyn 2017-02-10 11:13:32 +08:00
@KeepPro
首先,如果是说浏览器兼容性的话,这不过是跑 app 自己的 router 之前先做个自己的简单 router 罢了。 其次,如果是说后台的话,前端是 ie6/h5/app/客户端,和后台 api 没什么关系吧? |
10
Sunyanzi 2017-02-10 11:32:26 +08:00
@jarlyyn 这里似乎有我事儿我就再多句嘴 ... 所以你是怎么处理的 code 和 state ..?
state 的意义是保证回调是由当前用户发起的 ... 也就是你要判断传出和传入相等 ... 前端额外存 ..? 那 code 呢 ..? 无论如何还是要丢给后端吧 ... 既然如此为什么不直接让后端来接这个回调 ..? |
11
jarlyyn 2017-02-10 12:00:40 +08:00
@Sunyanzi
"跳转链接和返回" 和怎么处理 code 与 state 有什么关系? 后端只需要提供是否能验证的功能。 至于验证成功后怎么处理怎么跳转怎么显示,这是前端的事情,为什么要交给后台来处理? 让后台来处理调整,那岂不是前端的结构和入口要跟着后端来?前端页面结构重构一下的话还必须要要后台配合? |
12
jarlyyn 2017-02-10 12:09:56 +08:00
@Sunyanzi
简单来说,前台本身是 /index.html#xxx 后来需要加入新版本,对 ab 测试,新版本地址是 /v2/index.html#xxx 又要加英文版本,英文版的地址是 /en/index.html#xxx 这个项目难道应该通过后端来接这个回调? |
13
sighforever 2017-02-10 12:15:59 +08:00 via Android
做个自己的跳转页面吧,把当前页的 url 做成一个参数穿个跳转页,自己处理就好了
|
14
thundernet8 2017-02-10 12:50:52 +08:00 via iPhone
vue 路由用 history hash 吧
|
15
hellocy 2017-02-10 13:05:01 +08:00
我记得 redirect_uri 不能带任何参数
|
16
DeepCold 2017-02-10 14:16:29 +08:00
我的解决办法是放弃用 history 模式,改用 hash 模式。
可以借鉴我的线上项目, https://wx.wcar.net.cn/weiche-oil.php?station_id=83764 |
17
kanezeng 2017-02-10 15:06:30 +08:00
@jarlyyn 我觉得问题是微信授权后要做什么吧,比如至少基本授权拿到用户的 open-id ?那样的话拿到 code 后需要 appid 和 appkey 去取用户的 open-id ?这一步如果在前端做的话,是要把 appkey 也写到前端去么?这部分就是我一直没想明白的。
|
18
learnshare 2017-02-10 15:12:14 +08:00 via Android
没错的,微信是这样。我在 Angular 里手动解析跳转回来的 URL ,然后取 code 出来
|
19
jarlyyn 2017-02-10 15:12:16 +08:00
@kanezeng
微信授权后本质是做个登录的动作。 所以需要把登录成功与否的信息返回给前端啊。 前端收到 code/status,发给后端进行登录。 登录成功的话返回系统用户 id/openid/token 之类。 不然你准备怎么把用户信息传给前端,让前端再发个请求用 cooke 里的 session 判断吗?还是作为跳转的参数? 数据的归后端,浏览器的表现归前端。 |
20
qiayue 2017-02-10 15:14:40 +08:00
@jarlyyn 不管你前端几个版本,微信授权都应该是一个独立的服务,给前端调用。
比如我同时几个 web app 都要用同一个服务号来授权,难道每一个 web app 都重复写一套授权逻辑? |
21
jarlyyn 2017-02-10 15:17:33 +08:00
@qiayue
对啊,这就是我的意思啊。 微信授权应该是服务接口,而不是跳转页面啊。 按他们的说法,做一个 wx/authorize ,改跳转到哪个 Webapp 呢?还是每个 webapp 写一个接口? |
22
klgd 2017-02-10 15:20:17 +08:00
我觉得微信授权好像没前端( h5 )什么事啊,开始跳转到微信页面,用户授权,在跳转回来,通过 code+appid+secret 获取 access_token,再获取用户信息,这应该由服务端处理(不可能说把 secret 暴漏给前端吧)
这整个过程 h5 如果硬要加进来,反而变的复杂了 |
23
jarlyyn 2017-02-10 16:07:38 +08:00
@klgd
复杂在哪? 前端要做微信首先必然要做跳转操作。所以把跳转操作全放在前端是最好处理的。 后台就是做两个接口。 一个是 func(session/token,returnurl){ if !Validate(returnurl) return http.403 MakeState(token) return wx.getAuthUrl() } 一个是 func(prarams){ if wx.validate(prarams) token=prarams.token openid=wx. getUserinfo(token).openid return User(openid).id } |
24
klgd 2017-02-10 17:22:20 +08:00
@jarlyyn 是事情变的复杂了,不是代码变的复杂了
本来没前端的事呢 现在你前端要写代码,要去跟后端交互了 本来后端一个 controller 就可以解决了 现在要拆成 2 个接口了 不是说前端不可以这样做,只是觉得没必要这样做 |
25
jarlyyn 2017-02-10 17:31:00 +08:00
|
26
mrzhanyouwei 2017-03-30 21:15:20 +08:00
请问楼主最后怎么解决的呢?
|