UID548063性别保密经验 EP铁粒 粒回帖0主题精华在线时间 小时注册时间2022-8-5最后登录1970-1-1
| 关于前端跨域问题
跨域问题一直是前端常见的大问题,前端想要获取非CORS网站数据或者API往往需要后端的help
对于前端开发者,在做一些项目时,特别是小项目,部署一台后端 一是麻烦,也没必要,二来开发和学习成本也会增加等等
解决方案
这里推荐一个Js库,public-server-api,PublicServer API非第三方js库,为前端提供部分后端功能,或者说提供一个公用的后端,其中当然包括发送http(s)请求的功能
你可以使用npm进行下载,也可以通过script标签引入
NPM: https://www.npmjs.com/package/public-server-api
CDN:(页面是跨域的,你也可以选择一些模块化库引入)
(无需魔法)
- <script src="https://publicserver.n-project.us.kg/client/client.js"></script>
复制代码
使用此库的时候无需任何秘钥与账号以及魔法(至少目前),无限制
另外此库也可以用于请求一些国内连接不上的网站
请求方法
此模块提供两种请求方法,一种是和fetch完全一样的
PublicServer.prototype.request 方法,你只需要会fetch就好了,学习成本几乎为0
- (async function(){
- var myserver = new PublicServer()
- var response = await myserver.request( "https://example.com" )
- // example.com 不跨域
- document.write( await response.text() )
- // 写入页面
- })()
复制代码
另外一种就是 PublicServer.prototype.cat 方法,是一种简化方法,不过应对一些简单的场景还是绰绰有余的,也支持带数据Post
- (async function(){
- var myserver = new PublicServer()
- document.write( await myserver.cat( "https://example.com" ) )
-
- // 带参POST↓
- await myserver.cat( "https://api.site", "POST", { /*请求主体*/ })
- })()
复制代码
(个人)优缺点评价
优点:
•使用方便
•学习与使用成本低
•限制少
•可以解决部分地域问题
•支持Node和浏览器双端,方便测试与api库的开发
•开源
缺点
•不能请求 127.0.0.1(localhost)
•目前(至少v1.0.5)不能使用相对路径 |
|