如何分割URL，并提取其参数值

一、字符串分割分析法。 这里是一个获取URL带QUESTRING参数的JAVASCRIPT客户端解决方案，相当于asp的requestquerystring，PHP的$_GET 函数: function GetRequest() { var url = locationsearch; //获取url中""符后的字串 var theRequest = ne

在express中，使用这些模块可以将post参数转换为对象。

1、没接触express时获取get的数据并想将他转化为对象的格式需要借助一个模块：url模块。

2、在post请求中就没有像get那样简单，它需要用到一个模块，body-parser模块。

1import Qs from 'qs'

2 var params=thispropslocationsearch;

        if(params){

            var obj = Qsparse(params, { ignoreQueryPrefix: true });//忽略符号 { ignoreQueryPrefix: true }

            consolelog('obj:',obj);

            let is_id=objcoupon_id;

            let md5=objmd5;

            let unionid=objunion_id;

            thisbindVasUserAndGetCouponDetail(is_id,md5,unionid);

        }

更多参考：>

get请求一般是在你请求的地址后边 加上 par=''&par2='' 例如 请求的页面是 ado(假设你后台是java) 那么 请求地址是这样的 adopar='123'&par2='456' 这个请求传递的参数 就 par 和par2 他俩的值分别为 123，456

本章内容分为三部分：

开始之前先简单了解一下

如：url地址: >

2022年来到深圳，感觉到了与之前所在城市的差异，心里多少有点落差。虽然时机不太对吧，但是相信一切都会好起来的，给自己加油呀！

整理了一些面试被问到的问题，虽然很多是无效面试，但是我也强行问了面试官，从他们的回答中猜测了一下他们关注的面试点，所以也算是有点收获吧，只是浪费了很多简历和路费，哭唧唧。

——1、区块链——

1-1、vue生命周期；

1-2、vuex属性；

1-3、用户开始登录到登录成功都发生了什么；

1-4、git常用的命令；

——2、金融：vue——

笔试：

2-1、深浅拷贝的区别，为什么会出现深浅拷贝，浅拷贝的优势；

2-2、强制中断 foreach 遍历；

2-3、多处组件复用；

2-4、你对前端是什么概念，前端在整个软件生态内是什么角色；

2-5、Vue2 中数据变化但视图没有发生同步更新，描述一下出现的场景，解决方式，以及该问题发生的可能原因；

2-6、nextTick 是如何确保开发者能够获取到最新的 DOM 状态的；

2-7、如何使用 mixins，有何利弊；

2-8、使用 Hooks 模式开发时，useMemo，useCallback 常用来作为优化的手段。描述一下它们各自的适用场景，以及背后的原理实现；

2-9、前端从 Jquery 时代演变至如今的三大框架，这种演变的根源是什么，jquery 解决了什么问题，如今的三大框架又是为了解决什么问题出现的？

视频面试：

2-10、js遍历树形结构，每个节点都有一个唯一ID，只能遍历一次；

2-11、组件封装的意义；

——3、知识产权：vue2、vue3、ts、react——

3-1、说一说面向对象的理解，包括继承、封装、多态等；

3-2、说一说promise；

3-3、webpack优化；

3-4、vuex使用场景；

3-5、描述一下对vue响应式原理的理解；

3-6、vue生命周期；

3-7、父子组件钩子函数执行顺序；

3-8、v-if和v-show；

3-9、js数据类型；

3-10、实现深拷贝；

——4、物流——

4-1、vue生命周期；

4-2、生命周期-修改元素样式在生命周期的哪个阶段；

4-3、生命周期-修改数据在哪个阶段；

4-4、生命周期-destroy里面会做哪些 *** 作；

4-5、怎么修改title的内容；

4-6、父子组件传参的具体写法；

4-7、v-model的多种写法；

4-8、js数据类型；

4-9、判断数组的方法；

4-10、实现左边固定右边自适应的布局；

4-11、实现div垂直水平居中；

4-12、flex:1；

4-13、flex详解；

4-14、call,apply,bind是干什么的；

——5、新兴产业——

5-1、封装路由，怎么拦截路由；

5-2、浏览器缓存有哪些，又问localStorage和sessionStrorage的区别和应用场景；

5-3、浏览器强缓存和协商缓存；

5-4、webpack打包机制，构建过程和配置；

5-5、性能优化方法；

5-6、前端的业务和后端的API是怎么做到数据实时请求的（问的其实是前端对后端API接口的封装和管理）；

5-7、computed和watch；

5-8、说了几个关于大屏的应用场景，有没有做过，怎么做的；

——6、某水果：vue2、vue3、ts、各种前沿技术都用——

6-1、怎么封装一个组件库/工具类库，比如vue封装过什么复杂组件，jquery封装过什么类库；

6-2、get和post的区别，传参格式等；

6-3、promise怎么用的；

6-4、原型链，test()的原型链；

6-5、websocket；

6-6、es6中的generator；

6-7、es6中的set和map有啥区别，set为什么能去重；

6-8、项目难点；

——7、医疗健康：vue——

7-1、vue自定义指令配置；

7-2、webpack的理解；

7-3、对node的了解，用过express吗；

7-4、项目中的拖拽是怎么做的；

7-5、websocket和socket的区别；

7-6、听过mqtt吗，因为没听过所以解释了一下activemq的用法；

7-7、二维地图的聚合，如果有十万个点，会做什么优化；

7-8、地图实现多个点连成一条线会怎么做；

7-9、地图实现一条曲线；

7-10、内网下git怎么用的；

7-11、openlayers渲染机制；

7-12、父子组件通信方法；

7-13、router中实现拦截；

7-14、对象合并的方法；

7-15、父子组件的生命周期执行顺序，渲染阶段为什么会先执行父组件再执行子组件；

7-16、vue生命周期；

7-17、npm run dev, run build可以在项目中的什么位置找到；

7-18、vue中跳转页面的方法；

7-19、mixins用过吗；

7-20、判断引用类型的方法；

7-21、js数据类型；

7-22、判断基本数据类型的方法；

7-23、for in和for of的用法和区别，两者遍历的是索引还是属性值，两者都可以遍历对象吗；

7-24、foreach和map的区别，两者会不会改变原数组；

7-25、主要用什么技术栈；

7-26、行内元素和块级元素的区别，分别都有哪些，行块级元素有哪些；

7-27、div垂直水平居中，grid知不知道怎么用；

7-28、splice和slice；

——8、智慧园区：vue2、vue3、ts、uniapp——

8-1、flex了解吗，flex布局方向，flex:1 0的页面效果是怎样的；

8-2、做过移动端吗，了解uniapp吗；

8-3、keep-alive；问了一个没听明白的，可能和keep-alive有关系；

8-4、vuex中的action；不用vuex，怎么代替vuex；

8-5、promiseall和promiseon；

8-6、防止表单重复提交；

8-7、async，await的使用；

8-8、vue3和ts的了解；

8-9、防抖怎么控制时间；

8-10、vue中的data为什么要设计成一个函数；

——9、智慧工地：vue、uniapp、小程序——

9-1、Vuex是干什么的；

9-2、openlayers怎么用的；

9-3、性能优化；

9-4、spa首屏加载优化；

9-5、bundlerjs太大，打包怎么优化；

9-6、加密方式了解多少，比如md5,base64等，一大堆没听过的；

9-7、冒泡排序的实现原理；

9-8、js设计模式；

——10、某快递公司外包——

10-1、一棵树的数据，给的是列表格式，转换成树形结构；

10-2、项目相关的，聊天怎么做的，拖拽怎么做的，拖拽的数据怎么渲染的，拖拽重叠怎么处理的；

10-3、js设计模式；

——11、三维：vue、cesium——

11-1、一棵树的数据，给的是列表格式，转换成树形结构；

11-2、openlayers怎么用的，发布过wms吗，发布流程是怎样的；

11-3、openlayers转换经纬度的方法名是什么；

11-4、cesium常用的函数；

11-5、vue数据双向绑定原理；

11-6、Vue中data属性如果改变一个数组的下标，会不会马上发生变化，不变化可以怎么解决

11-7、数组常用方法有哪些；

11-8、 map和filter的区别；

11-9、es6常用的方法；

11-10、父子组件通信，兄弟组件通信；

11-11、new具体进行了什么 *** 作；

——12、医疗：vue、angular——

12-1、js渲染机制和运行机制；

12-2、vue数据绑定原理；

——13、建设行业：vue、uniapp——

笔试：

13-1、||与&运算符；

13-2、垂直居中方案；

13-3、let a=arr, b=a, c=arrconcat(), a[0]=3，打印b和c，应该是深浅拷贝；

13-4、实现font-size:12；

13-5、接口路径，给一个地址 >

在公司的业务中，有如下的业务场景：

在app端中点击活动banner图，跳转到H5端的活动页面；

若用户已在app中登陆，则在跳转到H5端时，携带一个后台下发的参数(autoLogin)，表明用于已在app端登陆；

H5页面获得参数后，通过ajax请求后台，获得用户的账户信息；

在此实现了H5端 自动登陆 的功能。

然而，在测试阶段，我们发现有时候出现自动登陆失败的情况。

根据 前言 中提及到的业务流程，我们一开始怀疑在自动登陆失败时，app未带上表面已登陆的参数(autoLogin)。

通过 Fiddlerexe 抓包，我们发现发生自动登陆失败时，并非是未从url获取到autoLogin参数，而是在H5端ajax请求用户信息时后台报错。

问题都这么明了，此时不怼后台，更待何时

此处省去联调、扯皮、打脸等过程。。。。。。。

我们经过艰苦卓绝的抓包，发现当自动登陆失败时，H5端提交的autoLogin有一个 空格 ！！！

然后对比了后台下发给app的autoLogin参数，H5端提交的autoLogin少了个 加号 ！！！

当app打开H5页面时，若autoLogin参数携带 加号 ,

由于浏览器 自动编码 url的机制，将 加号 编码成 空格 的 %20 ,而不是 %2B ，

导致H5端获取了一个错误的autoLogin参数，导致自动登陆失败。

url中的 空格 会自动编码，但 加号 在某些站点会编码，某些又不会。

这不是第一个坑，也不会是最后一个坑，未完待续

以上就是关于如何分割URL，并提取其参数值全部的内容，包括:如何分割URL，并提取其参数值、在express中,使用什么模块可以将post参数转换为对象、react 使用Qs获取url中的参数等相关内容解答，如果想了解更多相关内容，可以关注我们，你们的支持是我们更新的动力！