urlcat是一个小型JavaScript库,可以非常方便地构建URL并防止常见错误。特点:友好的API无依赖压缩大小为0.8KB为什么使用TypeScript类型?调用HTTPAPI时,通常需要在URL中加入动态参数:constAPI_URL='https://api.example.com/';functiongetUserPosts(id,blogId,limit,offset){constrequestUrl=`${API_URL}/users/${id}/blogs/${blogId}/posts?limit=${limit}&offset=${offset}`;//发送HTTP请求}如您所见,这个最小的示例已经很难阅读。这也是不正确的:我忘了在API_URL常量的末尾有一个斜杠,所以这导致了一个包含重复斜杠的URL(https://api.example.com//users)嵌入的值需要使用转换encodeURIComponent定义我可以使用内置的URL类来防止重复的斜杠和URLSearchParams来转义查询字符串。但是我仍然需要手动转义所有路径参数。constAPI_URL='https://api.example.com/';函数getUserPosts(id,blogId,limit,offset){constescapedId=encodeURIComponent(id);constescapedBlogId=encodeURIComponent(blogId);constpath=`/users/${escapedId}/blogs/${escapedBlogId}`;consturl=newURL(path,API_URL);url.search=newURLSearchParams({limit,offset});constrequestUrl=url.href;//发送HTTP请求}如此简单的任务,却难读又乏味!这是这个小型库可以帮助您的地方:constAPI_URL='https://api.example.com/';functiongetUserPosts(id,limit,offset){constrequestUrl=urlcat(API_URL,'/users/:id/posts',{id,limit,offset});//发送HTTP请求}这个库会这样处理:转义所有参数并发送所有连接的部分(它们之间总是恰好有一个/和?)如何使用?目前,该软件包通过npm分发。(Zip下载和CDN即将推出)。Node.js中的npminstall--saveurlcat使用官方支持的Node10及更高版本。由于代码在内部使用了URL和URLSearchParams类,它们在v10以下不可用,因此我们无法支持这些版本。构建完整的URL(最常见的用例):consturlcat=require('urlcat').default;使用任何实用函数:const{query,subst,join}=require('urlcat');使用所有导出函数:const{default:urlcat,query,subst,join}=require('urlcat');在Typescript中使用官方支持的TypeScript2.1及更高版本。要构建完整的URL(最常见的用例):importurlcatfrom'urlcat';要使用任何实用功能:import{query,subst,join}from'urlcat';要使用所有导出的函数:importurlcat,{query,subst,join}from'urlcat';在Deno中使用importurlcatfrom'https://deno.land/x/urlcat/src/index.ts';console.log(urlcat('https://api.foo.com',':name',{id:25,name:'knpwrs'}));APIParamMap:带有字符串键的对象例如,{firstParam:1,'second-param':2}是一个有效的ParamMap。urlcat:构建一个完整的URL函数urlcat(baseUrl:string,pathTemplate:string,params:ParamMap):stringfunctionurlcat(baseUrl:string,pathTemplate:string):stringfunctionurlcat(baseTemplate:string,params:ParamMap):string例如:urlcat('https://api.example.com','/users/:id/posts',{id:123,limit:10,offset:120})→'https://api.example.com/users/123/posts?limit=10&offset=120'urlcat('http://example.com/','/posts/:title',{title:'字母和“特殊”字符'})→'http://example.com/posts/Letters%20%26%20%22Special%22%20Characters'urlcat('https://api.example.com','/users')→'https://api.example.com/users'urlcat('https://api.example.com/','/users')→'https://api.example.com/users'urlcat('http://example.com/','/users/:userId/posts/:postId/comments',{userId:123,postId:987,authorId:456,limit:10,offset:120})→'http://example.com/users/123/posts/987/comments?authorId=456&limit=10&offset=120'query:构建查询字符串使用指定的key-value对构建查询字符串。键和值被转义,然后由'&'字符连接。例如:paramsresult{}''{query:'sometext'}'query=some%20text'{id:42,'comment-id':86}'id=42&comment-id=86'{id:42,'aname':'avalue'}'id=42&a%20name=a%20value'subst:替换路径参数用模板字符串中的值替换参数。模板可能包含零个或多个参数占位符。占位符以冒号(:)开头,后跟只能包含大写或小写字母的参数名称。在模板中找到的任何占位符都将替换为params中相应键下的值。例如templateparamsresult':id'{id:42}'42''/users/:id'{id:42}'/users/42''/users/:id/comments/:commentId'{id:42,commentId:86}'/users/42/comments/86''/users/:id'{id:42,foo:'bar'}'/users/42'join:使用分隔符连接两个字符串仅使用一个分隔符来连接两个部分。如果定界符出现在part1的末尾或part2的开头,则将其删除并使用定界符连接两部分。例如:part1separatorpart2result'first'',''second''first,second''first,'',''second''first'','',second''first,'','',second'Github库地址:https://github.com/balazsbotond/urlcat