首页
学习
活动
专区
圈层
工具
发布

不只是离线缓存! - 论如何善用ServiceWorker

最终我给出的一份较为完美的答案-npm图床,优点无非就是镜像多速度快,许可条款较为宽松,缺点也很明显,需要安装node,用专门的客户端上传。...是的,这种情况下使用SW最为巧妙不过,它可以在后台自动优选最佳的CDN,甚至可以用黑中黑Promise.any打出一套漂亮的并行拳。...同样的,为了避免刚安装完就刷新的尴尬感,建议用setTimeout延迟一秒刷新。...此脚本适用于卸载ServiceWorker的替换脚本。因为sw在无法拉取新版本时不会主动卸载,依旧保持运行,填入一个透明代理sw即可。...因此此方法无法绕开新浪图床反盗链 篡改响应 / Edit Response 这个例子会检测返回内容,若为html,将把所有的"TEST"都替换成"SHIT" const handle = async (

4.2K21

重构旧项目:从 jQuery 迁移到 Vue 3 的分步方案与避坑指南

重构旧项目:从 jQuery 迁移到 Vue 3 的分步方案与避坑指南 在许多历史项目中,jQuery 承担了选择器、事件、AJAX、动画与插件生态的核心角色。...迁移策略选择 渐进式共存:先在局部引入 Vue 3,逐页或逐模块替换。 Big Bang 重写:新仓库全面重建,适合规模可控、耦合较弱的项目。 推荐渐进式:风险低,易于灰度发布与回滚。...DOM 管理权交接 将一个页面中的“功能岛”替换为 Vue 组件(如过滤器、列表、弹窗)。 保留 jQuery 插件,外包裹 Vue 组件或指令,统一生命周期。 4....(e.config); } return Promise.reject(e); } ); export async function getList(params) { const...); let cancel = () => {}; async function load(params) { loading.value = true; const { promise

12610
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    2022高频前端面试题合集之JavaScript篇(中)

    因为在 ES6 规范中,引入了 class 的概念。使得 JS 开发者终于告别了直接使用原型对象模仿面向对象中的类和类继承时代。...事件名',fn); FF、Chrome、IE9-10 用: attachEventLister('事件名',fn,false); 关于获取滚动条距离而出现的问题 当我们获取滚动条滚动距离时: IE、Chrome...161. await async 如何实现 (阿里) 参考答案: async 函数只是 promise 的语法糖,它的底层实际使用的是 generator,而 generator 又是基于 promise...如何在 jquery 上扩展插件,以及内部原理(腾讯) 参考答案: 通过 $.extend(object); 为整个 jQuery 类添加新的方法。...、async2、promise1、script end、async1 end、promise2、setTimeout 185.

    2.7K10

    Hexo的安装及重置恢复

    landscape': checked out 'decdc2d9956776cbe95420ae94bac87e22468d38' INFO Install dependencies 错误: 找不到或无法加载主类...主题部分(初始化/重置) Hexo模块化的结构和生成流程决定了Hexo本身和主题theme是分离的,或者说耦合性不大,如果博客的主题在先使用过程中出现了一些无法修改的问题,那么就需要重置一下主题,比如我是用的...再次提醒,大部分错误都是theme中的错误导致的,在替换时只需要修改blog目录中的theme文件夹,替换其中的主题即可,blog根目录的东西一般不会出毛病(一般自定义时都是修改主题内的文件)。...indigo中 indigo\ _config.yaml (注意是indigo目录下的配置文件) indigo\source (全部内容,除了js和css,这两部分可能包含先前的错误) 基本的替换完成后即可运行了...正常来说,上述操作可以发现到底是在修改那个文件时出现错误,如果是一些不知道怎么引起的疑难杂症,通过这样的替换工作也可以将版本回退到正常的版本。

    2.8K20

    【JS】236-JS 异步编程六种方案(原创)

    jQuery.publish('done'); }, 1000); } 上面代码中,jQuery.publish('done')的意思是,f1执行完成后,向信号中心jQuery发布done信号,从而引发.../await 1.Async/Await简介 使用async/await,你可以轻松地达成之前使用生成器和co函数所做到的工作,它有如下特点: async/await是基于Promise实现的,它不能用于普通的回调函数...async/await与Promise一样,是非阻塞的。 async/await使得异步代码看起来像同步代码,这正是它的魔力所在。...-> Promise {: "1"} Generator函数依次调用三个文件那个例子用async/await写法,只需几句话便可实现 let fs = require('fs')...参考文章 Promises/A+ 前端面试之道 Javascript异步编程的4种方法 你不知道的JavaScript(中卷) async 函数的含义和用法 Async/Await替代Promise的6

    1.1K20

    Ajax,jQuery ajax,axios和fetch介绍、区别以及优缺点

    中秋节快乐 三年前入职的时候还是一个只会使用Ajax和Jquery Ajax的菜鸟,由于早期Jquery不支持大文件请求的问题,要么拆分文件,要么用XHR~今天总结一篇数据请求的 进入今天的世界吧~~~...请求的类型是由这个XMLHttpRequest对象的open()方法的第三个参数async的值决定的。...03 Axios 先来看看官网的案例: 执行 GET 请求 执行 POST 请求 执行多个并发请求 Vue2.0之后,尤雨溪推荐大家用axios替换JQuery ajax,未来App的趋势是轻量化和细化...相反,它会将 Promise 状态标记为 resolve (但是会将 resolve 的返回值的 ok 属性设置为 false ),仅当网络故障时或请求被阻止时,才会标记为 reject。...fetch() 接受第二个可选参数,一个可以控制不同配置的 init 对象: fetch的优点: 1 语法简洁,更加语义化 2 基于标准Promise实现,支持async/await。

    3K62

    【实战】小程序云开发,云函数中使用Router(附源码)

    项目开发 由于电影、电视列表模块用的都是同一个接口,只是某些参数不同,而详情页是解析网页方式,不是走的接口,所以处理逻辑与列表不相同,怎么样在一个云函数中处理不同的逻辑呢。...2.1 Router模块 在前端中,Router 可以处理不同的请求分支,于是在云函数中也可以使用 Router,下面使用了 tcb-router,它是一个基于 koa 风格的小程序·云开发云函数轻量级类路由库...request-promise,它是一个 Promise 分格的HTTP请求库,使用它还必须安装它的依赖,两个包都要安装 npm install --save request npm install...--save request-promise 下面看看电影列表是怎么处理的,douban/list.js const rp = require('request-promise') exports.main... 简单来说,cheerio 就是服务器端的 jQuery,去掉了 jQuery 的一些效果类和请求类等等功能后,仅保留核心对 dom 操作的部分,因此能够对 dom 进行和 jQuery 一样方便的操作

    1.4K31

    实战:小程序云开发之在云函数中使用Router

    项目目录结构 项目开发 由于电影、电视列表模块用的都是同一个接口,只是某些参数不同,而详情页是解析网页方式,不是走的接口,所以处理逻辑与列表不相同,怎么样在一个云函数中处理不同的逻辑呢。...Router模块 在前端中,Router 可以处理不同的请求分支,于是在云函数中也可以使用 Router,下面使用了 tcb-router,它是一个基于 koa 风格的小程序·云开发云函数轻量级类路由库...request-promise,它是一个 Promise 分格的HTTP请求库,使用它还必须安装它的依赖,两个包都要安装 npm install --save request npm install...--save request-promise 下面看看电影列表是怎么处理的,douban/list.js const rp = require('request-promise') exports.main... 简单来说,cheerio 就是服务器端的 jQuery,去掉了 jQuery 的一些效果类和请求类等等功能后,仅保留核心对 dom 操作的部分,因此能够对 dom 进行和 jQuery 一样方便的操作

    1.4K42

    都2019了,为何你的 JavaScript 代码还如此冗长~

    Promise也不错,但当代码规模越来越大时,它们总是有些别扭。 我的解决方案就是async / await,能让阅读代码变得更容易,代码变得更整洁。...实际上,Javascript中的任何Promise都可以await,只要你用的库能返回Promise,就可以await它。实际上,async/await只不过是promise的语法糖而已。...之前类刚刚出现时是没办法使用箭头函数的,因为类需要用某种特殊的方式来定义。我们需要在某个地方进行绑定,例如在构造函数里(在React.js中最好这样做)。...我很讨厌需要先定义类方法再绑定方法的流程,不过现在可以通过箭头函数进行自动绑定。箭头函数现在可以直接在类中使用。...即使是CSS,许多人也喜欢用现成的库,比如bootstrap。至于JavaScript,现在还有很多人在用jQuery以及各种小型库进行表单验证、跑马灯等等。

    1K30

    ES6-语法基础

    实际中,支持 ES6 的浏览器,都可以使用 fetch 对象实现基于 Promise 的异步请求,无需使用 jQuery 实现异步调用。 上述示例可以使用 fetch 简单实现。...对象 Promise对象的出现,用链式调用的形式替代了嵌套回调,解决“回调地狱”问题。...上述的fetch方法,then回调中的参数是响应而不是json,为了使用更简便,我们可以利用Promise的特性加上jQuery,自己实现一个then回调是json的Promise异步请求函数fetchJOSN...async和await关键字让我们可以用一种更简洁的方式写出基于Promise的异步行为,而无需刻意地链式调用Promise。...例如有如下的Promise函数: var flag=false; //用于控制Promise,模拟“成功”和“失败” //创建Promise函数 function promiseFunc

    64820

    nodejs爬虫

    静态网页爬虫 安装http、cheerio(jquery核心模块),http.get请求网页 动态网页爬虫 安装superagent,模拟浏览器ajax请求 安装selenium-webdriver,...包含大多数浏览器驱动,可以条用浏览器返回数据 无界面浏览器 安装PhantomJS已停止维护 chrome-headless库,nickjs、puppeteer(webpack打包缺少ws模块,package.json...() => { const browser = await puppeteer.launch(); //参数设置{headless:false}有界面 const page = await...,避免navigation超时 await page.screenshot({path: 'example.png'}); await browser.close(); //关闭时会有正常的异常...,服务端set-cookie)、session记录网页状态 js异步 await、async(async声明不创建线程) async函数返回Promise对象,Promise包含resolved执行完

    2.1K40

    ajax和fetch、axios的优缺点以及比较

    优缺点 本身是针对MVC的编程,不符合现在前端MVVM的浪潮 基于原生的XHR开发,XHR本身的架构不清晰,已经有了fetch的替代方案 JQuery整个项目太大,单纯使用ajax却要引入整个JQuery...在MDN上,讲到它跟jquery ajax的区别,这也是fetch很奇怪的地方: 当接收到一个代表错误的 HTTP 状态码时,从 fetch()返回的 Promise 不会被标记为 reject, 即使该...相反,它会将 Promise 状态标记为 resolve (但是会将 resolve 的返回值的 ok 属性设置为 false ), 仅当网络故障时或请求被阻止时,才会标记为 reject。...别急,再搭配上async/await将会让我们的异步代码更加优雅: async function test() { let response = await fetch(url); let...好吧,其实并不完美,async/await是ES7的API,目前还在试验阶段,还需要我们使用babel进行转译成ES5代码。

    9.7K20

    每天3分钟,重学ES6-ES12(十五)异步代码处理方案

    这是我参与「掘金日新计划 · 6 月更文挑战」的第27天,点击查看活动详情 每天3分钟,重学ES6-ES12文章汇总 前言 今天开始和大家一起系统的学习ES6+,每天3分钟,用一把斗地主的时间...,重学ES6+,前面我们介绍了promise,生成器和迭代器,async await,现在我们总结一下针对异步代码处理方案 业务场景 请求一个接口,拿到返回值,对返回值进行处理,当作第二个接口的请求参数...缺点:无法执行并发请求,必须有try catch才能捕获到异常 业务使用 Promise + async/await async/await是基于generator的语法糖,返回的也是一个promise...同步代码不多的情况,async await和promise的使用可以取决于个人喜好。 async/await设计初衷并不是为了取代Promise,而是为了让使用Promise更加方便。...JS异步的发展历程是callback->promise/generator->async/await 这三种历程我认为并没有 相互优越的区别,而是有使用场景的区别 注册事件必须是用回调,async await

    52110
    领券