qs库使用指南(代码片段)

关键词：

qs是一个流行的查询参数序列化和解析库。可以将一个普通的object序列化成一个查询字符串，或者反过来将一个查询字符串解析成一个object，而且支持复杂的嵌套。它上手很容易：

Qs.parse('x[]=1') // x: ['1']
Qs.stringify(x: [1]) // x%5B0%5D=1

qs的两个方法都接受一个可选的第二参数，可以让我们对结果进行配置，个人觉得比较有用的有以下几个：

ignoreQueryPrefix和addQueryPrefix

ignoreQueryPrefix这个参数可以自动帮我们过滤掉location.search前面的?，然后再解析，addQueryPrefix设为true可以在序列化的时候给我们加上?

// 解析
Qs.parse('?x=1') // ?x: "1"
Qs.parse('?x=1', ignoreQueryPrefix: true) //  x: "1"

// 序列化
Qs.stringify(x: "1") //  x=1
Qs.parse(x: "1", addQueryPrefix: true) //  ?x=1

数组解析和序列化

数组序列化有几种方式：indices, brackets, repeat, comma，用来控制字符串的生成格式。来看下面的例子：

qs.stringify( a: ['b', 'c'] ,  arrayFormat: 'indices' )
// 'a[0]=b&a[1]=c'
qs.stringify( a: ['b', 'c'] ,  arrayFormat: 'brackets' )
// 'a[]=b&a[]=c'
qs.stringify( a: ['b', 'c'] ,  arrayFormat: 'repeat' )
// 'a=b&a=c'
qs.stringify( a: ['b', 'c'] ,  arrayFormat: 'comma' )
// 'a=b,c'

上面的四种方式，序列化得到的结果越来越精简，但是当面对嵌套数组时，却会导致不同程度的信息丢失，而且丢失的越来越严重。以四种方式对 a: [[‘b‘], ‘c‘] stringify 再 parse为例：

qs.parse(qs.stringify( a: [['b'], 'c'] ,  arrayFormat: 'indices' )) //  a: [['b'], 'c'] 
qs.parse(qs.stringify( a: [['b'], 'c'] ,  arrayFormat: 'brackets' )) // a: ["b", "c"]
qs.parse(qs.stringify( a: [['b'], 'c'] ,  arrayFormat: 'repeat' )) // a: ["b", "c"]
qs.parse(qs.stringify( a: [['b'], 'c'] ,  arrayFormat: 'comma' )) // a: "b,c"

所以当数据里有嵌套时最好使用indices模式，好在这也是默认模式。

delimiter

delimiter可以控制将哪种字符作为分隔符，由于cookie的格式是使用;来分隔，一个有用的例子是用来解析cookie：

document.cookie // "_ga=GA1.2.806176131.1570244607; _jsuid=1335121594; _gid=GA1.2.1453554609.1575990858"
Qs.parse(document.cookie, delimiter:'; ')

数字类型的解析

正如我们在第一个例子看到的那样，我们把一个数字序列化再还原，得到的并不是一个数字，而是一个字符串：

Qs.parse(Qs.stringify(x:1)) // x: '1'

如果希望解析出来依旧是数字，可以参考这个issue,就是写一个自定义decoder：

Qs.parse('x[0]=1', 
    decoder(str, defaultEncoder, charset, type) 
      if (/^(d+|d*.d+)$/.test(str)) 
        return parseFloat(str)
      
      return str
    
  )

本文完

qs.parse()qs.stringify()使用方法(代码片段)

qs是一个npm仓库所管理的包,可通过npminstallqs命令进行安装.1.qs.parse()将URL解析成对象的形式2.qs.stringify()将对象序列化成URL的形式，以&进行拼接   查看详情

qs.parse()qs.stringify()使用方法(代码片段)

qs是一个npm仓库所管理的包,可通过npminstallqs命令进行安装.qs.parse()将URL解析成对象的形式constQs=require('qs');leturl='method=query_sql_dataset_data&projectId=85&appToken=7d22e38e-5717-11e7 查看详情

qs.parse()qs.stringify()使用方法(代码片段)

最近在别的博客看到的，正好也要用就记录一下。一、下载：npminstallqs 二、语法：1.qs.parse()   将url解析成对象的形式例如：constQs=require(‘qs‘);leturl="method=query_sql_dataset_data&projectId=85&appToken=7d22e38e-5717-11e7-907b... 查看详情

小tips：qs.stringify()和json.stringify()的区别以及在vux中使用post提交表单数据需要qs库序列化

...ge=10而JSON.stringify序列化结果如下："{"a":"hehe","age":10}"vux中使用post提交表单数据：this.$htt 查看详情

javascriptjavascript-获取qs(代码片段)

查看详情

textqt的安装程序，noninteractive.qs(代码片段)

查看详情

vue中qs插件的使用

...一些安全性的查询字符串解析和序列化字符串的库项目中使用命令行工具输入：npminstallqs安装完成后在需要用到的组件中：importqsfrom’qs’qs.parse()和qs.stringify()区别：qs.parse()是将URL解析成对象的形式qs.stringify()是将对... 查看详情

urllib使用四--urlencode(代码片段)

urllib.urlencode把字典数据转换为URL编码#-*-coding:cp936-*-importurllibparams=‘score‘:100,‘name‘:‘爬虫基础‘,‘comment‘:‘verygood‘qs=urllib.urlencode(params)print(qs)编码后跟在URL后面传递参数：comment=very+good&score=100&am 查看详情

axios关于qs序列化问题总结(代码片段)

...的main.js文件，定义qs序列化工具类的全局引用。核心代码如下：axios表单请求，需要进行参数序列化针对post表单请求，需要进行请求参数序列化，实例代码如下：getData()varparams='pageNu 查看详情

vue常见命令行不定时更新(代码片段)

1、qs用于Get/Post请求时转换参数使用npminstallqs--save-dev用法：importqsfrom‘qs‘letpostData=qs.stringify(certificationAccount:that.certificationAccount,balance:that.balance)  查看详情

qs.parse()qs.stringify()使用方法

...1e7-907b-a6006ad3dba0‘;Qs.parse(url);console.log(Qs.parse(url));如上面代码所示,输出结果如下:2.qs.stringify()将对象序列化成URL的形式，以&进行拼接constQs=require(‘qs‘);letobj=method:"query_sql_dataset_data",projectId:"85",appToken:"7d22e38e-5717-11e7-907b-a6006ad... 查看详情

elklogstash配置小记(代码片段)

..._dir=>"./logstash/pat"match=>["request","%URIMATCH"]ruby：使用ruby代码调整输出内容rubycode=>"event.set(‘timelocal‘,event.get(‘@timestamp‘).time.localtime+8*60*60)"rubycode=>"event.set(‘@timestamp‘,event.get(‘timelocal‘))"rubycode=>"event.set(‘timeunix‘,e... 查看详情

git-删除文件后找回(代码片段)

#前提：删除前，文件存在是的状态提交到了本地库#操作：gitreset--hard指针位置　　　　删除操作已近提交到本地库：指针指向历史记录　　　　[email protected]004MINGW64/c/LXLWorking-Place/Git-Work$cdTest/[email protected]-QS-004MINGW64/c/LXL... 查看详情

nb-iot专栏(qs-100模块二次开发）-onenet云平台+微信小程序实现下行数据控制设备开关(代码片段)

前言最近公司老总买了NB-IOT的模块，老总考虑到STM32芯片的价格涨的很快，而我们的内容做的不是很复杂，再加上支持一下本地企业，QS-100模块到价格超级实惠，决定使用QS-100模块作为通信模块，主要是做... 查看详情

ts+vite3+vue3+mock+qs实现本地模拟数据功能(代码片段)

第一步：安装qs因为项目中用到了ts，所以还需要安装：第二步：安装mock第三步：创建Vue页面:Category.vue<template><button@click="getById">getById</button><button@click="getById11">getById11</butto 查看详情

向后台发送数据vue(代码片段)

在main.js中添加importaxiosfrom‘axios‘;Vue.prototype.$http=axios;在需要的登录vue组件中引入：需要先安装qs cnpminstallqs-dimportqsfrom‘qs‘最后this.$http.post(‘http://tapi.funxdata.com/login/login‘,qs.stringify(‘type‘:‘we 查看详情

史上最详细的python爬虫库urllib讲解：绝对经典，值得收藏(代码片段)

目录网络库urllibrequest发送GET请求发送POST请求请求超时处理爬虫伪装代理获取CookieParse中文的编码与解码quote与unquoteURL解析连接URL参数转换（parse_qs与parse_qsl）Robots协议Robots协议的定义规则Robots协议的解析errorHTTPError网络库... 查看详情

上传文件时，将file对象，经过qs.stringfly处理后，file文件被过滤(代码片段)

aa(event)//选择的excel文件varfile=event.target.files[0];console.log(file);varreader=newFileReader();reader.readAsBinaryString(file);reader.onload=(e=>varbb=lang:1,fileinfo:e.target.result,enen:2;console.log(bb)varxx=Qs.stringify(bb);console.log(xx);)以上是处理方法，原因是我们拿... 查看详情