vue.js 短连接 动态连接

有这么一种场景，我们实现了某个业务，现在需要将这个业务连接对外推广以期实现我们的运营、推广、佣金目的，那么我们如何实现呢？

比如这个页面连接为：

https://mp.domain.com/user/creation/editor?spm=1&userno=12324
&signature=aerqwerxxxx&token=xxxxxx&platform=ios&lat=xxx&longi=xxxx

1、将这个长长的连接发给别人，别人进行点击打开。遇到小白还是规矩，在页面中正常操作。遇到那些比较二的人，直接给你修改连接上的参数 ，你怎么办？

2、我们将如上的长连接转变为短连接，参数不进行暴露，反而将参数以某个固定的key保存到我们服务器，用户打开时，以此KEY去取参数再在页面中使用，便可避免原连接不安全的问题。

动动脑，是不是第一个方案存在的各种问题可想而知。URL过长，牛马蛇神全部清清楚楚的暴露了。而第二个方案如何实现呢？我们试着继续向下思考：那我将连接变为：

https://mp.domain.com/s/3xRghijm09R

 这个是不是就好太多了！可是这样的连接如何与页面路由呢？你的路由表中如何定义这个连接并成功识别呢？好了，打开你的项目配置路由的地方：

1、将path和name均配置为相同的能用匹配符表达式：'/s/:key'

2、打开我们的目标页面完善代码

 这一步的目的是取出我们动态KEY来还原原始的页面连接需要的参数。

3、生成短连接：http://localhost:8013/s/3xRghijm09R

我们再次复盘一下我们的疑惑，这个3xRghijm09R是怎么来的？是的，他肯定不是飞来的，也不是风刮来的，而你是你自己生成的！

让我们再次提出问题：怎么生成呢？

我们原始连接的参数为：

spm=1&userno=12324
&signature=aerqwerxxxx&token=xxxxxx&platform=ios&lat=xxx&longi=xxxx

那我们只需要新动态连接后的3xRghijm09R与spm=1&userno=12324
&signature=aerqwerxxxx&token=xxxxxx&platform=ios&lat=xxx&longi=xxxx建立对应关系即可！

则在生成3xRghijm09R的时候，以3xRghijm09R为键，将spm=1&userno=12324
&signature=aerqwerxxxx&token=xxxxxx&platform=ios&lat=xxx&longi=xxxx保存起来，在页面中捕获连接是否短连接，如果是短连接则通过3xRghijm09R取出原始值即可！不同参数值最终生成的不同的KEY，不同的KEY对应自己特定的参数表，则逻辑达成！

来看看数据库表：

至此，你看明白了吗？