区别在于导入既可以使用绝对公共路径(基于开发期间的项目根路径)，也可以使用相对路径。 CSS中的url()引用也以同样的方式处理。...raw' Importing Script as a Worker 脚本可以作为带有?worker后缀的web worker导入。...worker&inline' The public Directory 如果你有以下资产: 从未在源代码中引用过(例如robots.txt) 必须保留完全相同的文件名(没有哈希) …或者您只是不想为了获取...在开发过程中，这个目录中的资源将在根路径/中提供，并原样复制到dist目录的根目录中。 该目录默认为/public，但可以通过publicDir选项配置。...注意: 你应该总是使用根目录绝对路径来引用公共资产——例如，public/icon.png在源代码中应该被引用为/icon.png。 公共的资产不能从JavaScript中导入。
kube-scheduler、kube-controller-manager 一般和 kube-apiserver 部署在同一台机器上，它们使用非安全端口和 kube-apiserver通信，非安全端口默认为...--service-account-key-file=ca-private.pem/apiserver-private.pem包含PEM-encoded x509 RSA公钥和私钥的文件路径，用于验证...由于kube-controller-manager是和kube-apiserver部署在同一节点上，且使用非安全端口通信，故不需要证书。...： 同上 --root-ca-file=： 根CA证书文件路径 ，用来对 kube-apiserver 证书进行校验，指定该参数后，才会在Pod 容器的 ServiceAccount 中放置该 CA 证书文件...从节点上配置kubelet所使用的配置文件worker-kubeconfig.yaml (kubelet和kube-proxy进程共用)指定证书: 配置客户端证书等相关参数,内容如下: kubelet
但是，由于移动互联网的到来，和世界上其它领域的发展，参差不齐的互联网连接在现代网络用户中已经越来越普遍了。 因此，网站在离线时如何展现，将变得非常重要，以使用户不至于被网络可用性所限制。...文件名 /sw.js 表示 Service Worker 的范围是 URL 的根路径（或 http://localhost:3000），这意味着根路径下发出的请求都能过通过触发的事件被 Service...注意，我们使用 cache.match 方法和 INDEX_HTML_URL 查找数据，而不是 request.url，表示我们只通过 key 查找缓存，而不用关心当前的路径。...是因为, Ember 应用总是使用 index.html 渲染。在应用程序的根路径下的任何 URL 请求，都会以 index.html 的缓存版本结尾，Ember 应用通常在此接管。...这里有 一些插件 使用了 ember-service-worker 架构，并允许您定制和微调 Service Worker 的行为和缓存策略。
Service Worker 特点 网站必须使用 HTTPS。...') 注意： Service Worker 的注册路径决定了其 scope 默认作用范围。...示例中 service-worker.js 是在 /sw 路径下，这使得该 Service Worker 默认只会收到 /sw 路径下的 fetch事件。...如果存放在网站的根路径下，则将会收到该网站的所有 fetcg事件。 如果希望改变它的作用域，可在第二个参数设置 scope范围。示例中将其改为了根目录，即对整个站点生效。...要使用推送通知，需要设置一台服务器，该服务器会将通知推送给所有客户端。 由于Service Worker在后台在另一个线程上运行，因此即使页面当前未打开，用户也可以看到推送通知。
如果生命周期中的所有事件都成功了，Service Worker 便已准备就绪，随时可以使用了！...3.2.3 实现离线缓存 index.html 注：Service Worker 的注册路径决定了其 scope 默认作用页面的范围。...如果 service-worker.js 是在 /sw/ 页面路径下，这使得该 Service Worker 默认只会收到 页面 / sw/ 路径下的 fetch 事件。...如果存放在网站的根路径下，则将会收到该网站的所有 fetch 事件。 如果希望改变它的作用域，可在第二个参数设置 scope 范围。示例中将其改为了根目录，即对整个站点生效。...以 Chrome 上使用 Google Cloud Messaging作为推送服务为例，第一步是注册 applicationServerKey(通过 GCM 注册获取)，并在页面上进行订阅或发起订阅。
首先，我们想一下，当访问一个web网站时，我们实际上做了什么呢？总体上来说，我们通过与与服务器建立连接，获取资源，然后获取到的部分资源还会去请求新的资源（例如html中使用的css、js等）。...通过监听用户请求信息，Service Worker可以决定是否使用缓存来作为Web请求的返回。 下图展示普通Web App与添加了Service Worker的Web App在网络请求上的差异： ?...这里需要强调一下，虽然图中好像将浏览器、SW(Service Worker)与后端服务三者并列放置了，但实际上浏览器（你的Web应用）和SW都是运行在你的本机上的，所以这个场景下的SW类似一个“客户端代理...这里我们将sw.js文件注册为一个Service Worker，注意文件的路径不要写错了。 值得一提的是，Service Worker的各类操作都被设计为异步，用以避免一些长时间的阻塞操作。...注意其中的'/'，由于根路径也可以访问我们的应用，因此不要忘了将其也缓存下来。
当worker不够的时候，master会通过配置里的信息，动态启动worker，等空闲的时候可以收回worker 到现在还是没明白php-fpm 是个什么东西?...要把这个设置的值设用的非根用户的用户名。 group = nobody #拥有这个 PHP-FPM进程池中子进程的系统用户组。要把这个设置的值设应用的非根用户所属的用户组名。...对大多数中小型PHP应用来说,每个PHP进程要使用5~15MB内存(具体用量可能有差异）。...假设我们使用设备为这个PHP-FPM进程池分配了512MB可用内存，那么可以把这个设置设为（512MB总内存）/(每个进程使用10MB) = 51个进程。 ......catch_workers_output = Yes #将worker的标准输出和错误输出重定向到主要的错误日志记录中，如果没有设置，根据FastCGI的指定，将会被重定向到/dev/null上 生产环境配置
因此，如果我们把 PWA 的关键技术之一 Service Worker 的出现作为 PWA 的诞生时间，那就应该是 2015 年。...离线使用 离线使用依赖Service Work，其本质是一段运行在并行于主进程的后台进程上，他不参与web交互功能，主要职责是和服务器交互，和指示缓存的内容。...hexo为静态博客，因此只需要实现离线使用即可，不需要进行消息推送，因此可以使用固定服务注册脚本，在hexo中服务注册脚本有着专门的插件进行生成： hexo-offline hexo-pwa hexo-service-worker...hexo-service-worker插件，下面是插件使用的细节： 首先安装hexo-service-worker插件： npm install --save hexo-service-worker 在...stripPrefix 网站文件的根路径绝对位置 runtimeCaching 缓存选项 urlPattern 文件的正则匹配 handler 缓存模式 origin 网站访问域名(代理域名) 如此支持离线的
事实上使用PWA也确实从中获得了显而易见的益处。...为此我们需要提供两张不同分辨率的站点图标文件： ServiceWorker服务 Service Worker是一个注册在指定源和路径下的事件驱动型Web Worker。...Service Worker本质上就是一个Web Worker，因此它具有Web Worker的特点：无法操作DOM、脱离主线程、独立上下文。 ...如果Service Worker存在更新，我们使用skipWaiting跳过等待，直接强制新的worker进入激活状态。 ...其中，参数为要执行的worker逻辑文件路径，注意这个路径是基于origin的，而非当前文件。
service worker缓存的优缺点： 优点： 非侵入式缓存 缓存内容开发者完全可控 持续性缓存 独立于主线程之外，不堵塞进程 缺点： 权限太大，能拦截所有fetch请求，需要控制一下 发版更新处理比较麻烦...，第二个参数是对匹配路径进行的处理函数，可以用workbox封装的缓存策略处理函数，也可以自定义，上述示例就是使用的workbox内部封装的CacheFirst缓存策略。...使用service worker其他特性 如果你只想简单的引入service worker，建议使用第一种方式 第二步：注册Service Worker 配置好插件之后，我们需要在项目中注册service...worker引入到我们已有的用webpack构建的项目上。...如果正常引入，我们可以在控制台中看到下图： 总结 service worker实现缓存有非侵入、持久化、缓存内容可控等优点 Workbox可以理解为service worker的库，利用它可以快速进行
GenerateSW GenerateSW与InjectManifest如何选择： 如果你只是想简单地将项目 PWA 化，选择GenerateSW，插件会自动帮你生成包含 precache manifest 的service-worker.js...如果你有较高的定制需求，需要在已有 Service Worker 的基础上将项目 PWA 化，则选择InjectManifest，插件会在你指定的service-worker.js的基础上加入 precache...自动跳过 Service Worker 的等待阶段 添加离线 Google Analytics 支持 运行时缓存runtimeCaching，Workbox 的强大所在，阅读这些内容会使你更好地了解如何配置以及具体能做什么...Worker 的更新 这是开发 PWA 应用时需要考虑的一个重要问题 由于 Service Worker 的更新机制（扩展阅读：【Service Worker】生命周期那些事儿），直接单纯的刷新页面并没有结束当前...注：以下方法中提到的registerServiceWorker.js是由 PWA 插件在src目录中自动生成的，其作用是注册 SW 以及提供其生命周期钩子，具体可以看该 npm 包 register-service-worker
默认情况下，Firefox 不会在 HTTPS 上 prefetch 任何内容。考虑到现在大多数东西都是 HTTPS，这有效地禁用了Firefox上的预取。...控制请求，以便在请求尚未在 bundle 中时可以解除请求。简单而言，我们希望从一个被动的执行预取转变为一个主动控制预取。事实证明，service worker 能做到。...Service worker 可以拦截请求并控制缓存中的内容。使用 service worker，我们可以对流程进行正确的控制，还可以了解 chunk 依赖关系图，并可以加载相关代码。...但是创建这样一个service worker并不容易，所以大多数开发人员都不这么做。...但事实证明，现实从来没有这么简单，使用 prefetch 在实践中并不像你所希望的那样有效。相反，我们建议使用 service worker 来完全控制 prefetch 过程。
默认情况下，Firefox 不会在 HTTPS 上 prefetch 任何内容。考虑到现在大多数东西都是 HTTPS，这有效地禁用了Firefox上的预取。...控制请求，以便在请求尚未在 bundle 中时可以解除请求。 简单而言，我们希望从一个被动的执行预取转变为一个主动控制预取。 事实证明，service worker 能做到。...Service worker 可以拦截请求并控制缓存中的内容。使用 service worker，我们可以对流程进行正确的控制，还可以了解 chunk 依赖关系图，并可以加载相关代码。...但是创建这样一个service worker并不容易，所以大多数开发人员都不这么做。...但事实证明，现实从来没有这么简单，使用 prefetch 在实践中并不像你所希望的那样有效。 相反，我们建议使用 service worker 来完全控制 prefetch 过程。
3 Service Worker开发调试方法 有过使用chrome inspect前端页面调试经验对于Service Worker开发调试就很容易上手了，以 offline-page 为例： 使用pc...Service Worker脚本并push到测试页面服务器上之后，刷新页面并不能立即去网络更新脚本，给开发调试带来麻烦，但图2中的5可以帮助开发强行忽略本地Service Worker脚本cache，实时的去网络更新...4 使用Service Worker进行资源缓存 4.1 使用Service Worker进行简单的资源缓存 还是以 offline-page 为例，前端在原来的web应用中使用Service Worker...这里可以将静态资源按优先级分为两类，一类是重要资源，一类是非重要资源，将重要资源放到安装等待队列中，非重要资源放到独立的队列中，这样只需要重要资源全部都加载成功就可以成功安装Service Worker...即可，TBS启动时会自动搜索该路径。
推荐阅读《html5离线缓存manifest详解》、《HTML5离线存储实战之manifest的那些坑》 Service Worker本质上也是浏览器缓存资源用的，只不过他不仅仅是cache，也是通过...它设计为完全异步，同步API（如XHR和localStorage）不能在service worker中使用。...Service Worker的使用 Service worker是一个注册在指定源和路径下的事件驱动worker。...navigator.serviceWorker.register(path,object） path: service worker 文件的路径，请注意：这个文件路径是相对于 Origin ，而不是当前...Worker 的时候，把 scope 设置为非 origin 目录，那么在 service worker 文件中，我无法获取到 Origin 路径对应页面的 client。
背景介绍 最近实战了 Service Worker（以下简称“sw”）来进行网站缓存，以实现离线状态下，网站仍然可以正常使用。...> body> html> 注册 Service Worker 我们通过script.js来判断浏览器是否支持 serviceWorker，并且加载对应的代码。...例如上面代码中，/sw.js是 serviceWorker 脚本，它拦截根路径下的所有静态资源。如果是/static/sw.js，就只拦截/static/下的静态资源。...Service Worker 最佳实践 笔者爬了很久的坑，中途看了很多人的博客，包括张鑫旭老师的文章。但是实践的时候都出现了问题，直到读到了百度团队的文章才豁然开朗。...参考链接 本文全部代码地址 Service Worker 生命周期 百度团队：怎么使用 ServiceWorker Web Worker 开发模式
/ssl cd /etc/nginx/ssl openssl genrsa -out nginx.key 2048 我们的CA中心与要申请证书的服务器是同一个，否则应该是在另一台需要用到证书的服务器上生成...user www www; # 指定工作进程数(一般等于CPU总核数) worker_processes auto; # 指定错误日志的存放路径,错误日志记录级别选项为:[debug | info...| notic | warn | error | crit] error_log /var/log/nginx_error.log error; #指定pid存放的路径 #pid...logs/nginx.pid; # 指定文件描述符数量 worker_rlimit_nofile 51200; events { # 使用的网络I/O模型,Linux推荐epoll;FreeBSD...service docker restart!
所以我们这里使用二进制的方式来部署。二进制文件已经这里备好，大家可以打包下载，把下载好的文件放到每个节点上，放在哪个目录随你喜欢，放好后最好设置一下环境变量$PATH，方便后面可以直接使用命令。...在每个节点上都生成一遍，把所有配置都生成好，后面会根据节点类型去使用相关的配置。...（主节点） 根证书是证书信任链的根，各个组件通讯的前提是有一份大家都信任的证书（根证书），每个人使用的证书都是由这个根证书签发的。...在同一台机器上，所以可以使用非安全端口与api-server通讯，不需要生成证书和私钥。...scheduler一般与apiserver在同一台机器上，所以可以使用非安全端口与apiserver通讯。
> 使用 WORKDIR 指令可以来指定工作目录（或者称为当前目录），以后各层的当前目录就被改为指定的目录， 如果目录不存在，WORKDIR z会帮你建立目录 COPY COPY 路径...路径> COPY "路径1>",......，所以有的 RUN 指令会在每行的末尾使用续行符 \，命令之间也会用 && 来连接，这样保证在逻辑上是一行，就像下面这样： RUN apt-get update \ && apt-get install...但是，你可以使用 driver 属性来指定不同的网络类型。 在对 Worker 服务的配置中，各个配置的含义如下所示。 build 用于构建镜像，其中 build: ....MySQL 服务的 networks 应设置为和 Worker 服务相同的 counter-net，这样两个容器共用同一个网络命名空间，可以使用回环地址进行通信。
下面的步骤，将告诉大家如何在服务器上通过 Nginx 部署 HTTP 静态服务。...安装Nginx 在 CentOS 上，可直接使用 yum 来安装 Nginx： yum install -y nginx 安装完成后，使用 nginx 命令启动 Nginx： nginx 设置...Nginx 开机启动： systemctl enable nginx.service 配置静态服务器访问路径 外网用户访问服务器的 Web 服务由 Nginx 提供，Nginx 需要配置静态资源的路径信息才能通过...url 正确访问到服务器上的静态资源。.../50x.html; location = /50x.html { } } } 配置文件将 /data/www/static 作为所有静态资源请求的根路径
领取专属 10元无门槛券
手把手带您无忧上云
云服务器
ICP备案
腾讯会议
云直播
对象存储
