本文目录一览:
- 1、jQuery Cookie.js cdn 失效了怎么换?
- 2、js文件cdn后要注意哪些问题
- 3、如何将大量的HTML中的js和css整体的切换到cdn的服务器上去
- 4、create-react-app脚手架项目打包CDN部署
jQuery Cookie.js cdn 失效了怎么换?
把这个文件jquery.cookie.js下载下来,保存到项目js相关的目录里,然后再页面引入的地方改为项目中该js的路径,name就不存在失效的问题。或者自己买个cdn对该文件加速,可以预控失效的问题。
js文件cdn后要注意哪些问题
CDN缓存任何内容都有一个缓存到期时间(这个通常是可以自定义的),一旦缓存时间到期,下一次有人访问的时候,就需要回源站重新获取内容。
比如:一个图片设置缓存时间是1小时,那么在一个CDN节点上,有人第一次访问这个图片之后,就会缓存,在接下来的一个小时,再有人盗这个节点访问该图片的话,都是直接返回缓存内容。一个小时后,再有访问的话,就需要回源站了。
如果在源站宕掉之前,CDN节点并没有缓存该内容的话,那么肯定也是访问不了的。
有的CDN提供“keep-online”功能,即:源站宕机以后,凡是之前已经缓存的内容随时都可以访问,不会受有效期的限制。
如何将大量的HTML中的js和css整体的切换到cdn的服务器上去
方法一:修改html里面js, css引用链接,指向cdn服务器(这些都有规律,直接替换应该可行)
方法二:在服务器做rewrite,将*.js, *.css的访问301到cdn
方法三:将所有的css, js引用改为xx.php,在xx.php里面集中处理这些请求,替换链接。
建议使用第一种。
create-react-app脚手架项目打包CDN部署
因为react项目多为SPA项目,用于生产部署时,存在首屏响应过慢导致用户难以忍受等待时间从而流失问题。一般导致首页响应过慢的原因有很多,网络问题是其中之一。本文记录通过七牛云免费CDN部署react项目。
1.create-react-app创建react项目,并启动项目。
2.项目打包。
此时如果只是普通部署,不要求体验效果时,把build文件下的文件拷贝到静态服务器即可。
接下来考虑如何静态文件CDN部署。
3.修改webpack文件,打包文件的引用路径省车过为CDN路径。
1. config文件夹下paths.js(修改pathname为cnd的域名)
2. config文件夹下webpack.config.js 修改output文件名,使用绝对路径。
修改后重新打包,发现index.html中引入css,js的路径皆改成cdn路径。
附加: 上传打包文件至七牛云CDN。(upload.js)