-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Showing
9 changed files
with
329 additions
and
1 deletion.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,11 @@ | ||
| # `axios` | ||
|
|
||
| > TODO: description | ||
| ## Usage | ||
|
|
||
| ``` | ||
| const axios = require('axios'); | ||
| // TODO: DEMONSTRATE API | ||
| ``` |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,7 @@ | ||
| 'use strict'; | ||
|
|
||
| const axios = require('..'); | ||
|
|
||
| describe('axios', () => { | ||
| it('needs tests'); | ||
| }); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,20 @@ | ||
| /** | ||
| * 这是axios的cancel服务， | ||
| * 支持自定义cancel策略 | ||
| * 默认支持两个策略 | ||
| * | ||
| * 当发送重复请求时候，且上一条请求还未完成，可取消上一次的请求。（CANCEL_LAST_AT_MOST_ONCE） | ||
| * 当发送重复请求时候，且上一条请求还未完成，可不发送本次请求。（CANCEL_CURRENT_AT_MOST_ONCE） | ||
| * 当路由切换时，可取消上一个页面的所有请求。（cancelReqs） | ||
| * | ||
| * export enum AjaxStrategy { | ||
| CANCEL_LAST_AT_MOST_ONCE = 'cancel_last_at_most_once', | ||
| CANCEL_CURRENT_AT_MOST_ONCE = 'cancel_current_at_most_once', | ||
| } | ||
| */ | ||
|
|
||
| module.exports = axios; | ||
|
|
||
| function axios() { | ||
| // TODO | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,32 @@ | ||
| { | ||
| "name": "axios", | ||
| "version": "0.0.1", | ||
| "description": "axios strategy", | ||
| "keywords": [ | ||
| "axios" | ||
| ], | ||
| "author": "pearone <1181019452@qq.com>", | ||
| "homepage": "https://github.com/DPDFE/react-layout#readme", | ||
| "license": "ISC", | ||
| "main": "lib/axios.js", | ||
| "directories": { | ||
| "lib": "lib", | ||
| "test": "__tests__" | ||
| }, | ||
| "files": [ | ||
| "lib" | ||
| ], | ||
| "repository": { | ||
| "type": "git", | ||
| "url": "git+https://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@github.com/DPDFE/react-layout.git" | ||
| }, | ||
| "scripts": { | ||
| "test": "echo \"Error: run tests from root\" && exit 1" | ||
| }, | ||
| "bugs": { | ||
| "url": "https://github.com/DPDFE/react-layout/issues" | ||
| }, | ||
| "dependencies": { | ||
| "axios": "^1.6.2" | ||
| } | ||
| } |
Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,6 @@ | ||
| /** | ||
| * 场景：前后端分离的架构，后端更新，用户长期不刷新，导致接口访问不通 | ||
| * 方案： | ||
| */ | ||
|
|
||
| export {}; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,149 @@ | ||
| /** | ||
| * 类型定义 | ||
| */ | ||
| interface ReloadSiteProps { | ||
| /** 在黑名单中的url不要刷页面 */ | ||
| isInBlacklist?: (url?: string) => boolean; | ||
|
|
||
| /** 检查网站是否有更新(调用后端接口检查，或者直接获取'/'拿到html与当前页面初始加载时获取的'/'进行比对)，若未传递，可设置一个默认方法 */ | ||
| hasNewVersion?: ( | ||
| old_html?: string, | ||
| online_url?: string | ||
| ) => Promise<boolean>; | ||
|
|
||
| /** 可以通过获取html url是否发生变化来判断是否有新的代码上线 */ | ||
| online_url?: string; | ||
| } | ||
|
|
||
| /** | ||
| * 当网页有新内容上线的时候，自动更新页面 | ||
| * | ||
| * @param props - Props | ||
| */ | ||
| export default async function reloadSiteWhenRouteChange( | ||
| props = {} as ReloadSiteProps | ||
| ) { | ||
| const { | ||
| isInBlacklist = () => false, | ||
| hasNewVersion = defaultHasNewVersion | ||
| } = props; | ||
|
|
||
| const old_html = await fetchHtml(props.online_url); | ||
|
|
||
| let check_time = +new Date(); | ||
|
|
||
| /** 检查页面有更新后，此变量会变成true，下周期中，如果是true，直接刷新页面，实现网页更新 */ | ||
| let need_load = false; | ||
|
|
||
| addRouteChangeListener(); | ||
|
|
||
| /** | ||
| * 监听路由变化时，来检测页面是否有更新 | ||
| */ | ||
| function addRouteChangeListener() { | ||
| const origin_pushState = window.history.pushState; | ||
| const origin_replaceState = window.history.replaceState; | ||
| const origin_hashChange = window.onhashchange; | ||
|
|
||
| /** | ||
| *重新history的pushState 和 replaceState方法 | ||
| * @param data - data | ||
| * @param title - title | ||
| * @param url - url | ||
| */ | ||
| window.history.pushState = (data, title, url) => { | ||
| origin_pushState.apply(window.history, [data, title, url]); | ||
| reloadPageWhenUpdate(); | ||
| }; | ||
|
|
||
| window.history.replaceState = (data, title, url) => { | ||
| origin_replaceState.apply(window.history, [data, title, url]); | ||
| reloadPageWhenUpdate(); | ||
| }; | ||
|
|
||
| window.onhashchange = (event) => { | ||
| origin_hashChange?.apply(window, [event]); | ||
| reloadPageWhenUpdate(); | ||
| }; | ||
| } | ||
|
|
||
| /** | ||
| *如果网站有更新，reload page | ||
| */ | ||
| async function reloadPageWhenUpdate() { | ||
| if (need_load) { | ||
| window.location.reload(); | ||
| } | ||
| if ( | ||
| checkTime() && | ||
| !isInBlacklist(window.location.href) && | ||
| (await hasNewVersion(old_html, props.online_url)) | ||
| ) { | ||
| need_load = true; | ||
| } | ||
| } | ||
|
|
||
| /** | ||
| * 超过1小时后检查页面是否有更新 | ||
| * | ||
| * @returns | ||
| */ | ||
| function checkTime() { | ||
| const now = +new Date(); | ||
| const time_diff = now - check_time; | ||
| if (time_diff > 1000 * 60 * 60) { | ||
| check_time = +new Date(); | ||
| return true; | ||
| } | ||
| console.log('未超过1小时'); | ||
| return false; | ||
| } | ||
| } | ||
|
|
||
| /** | ||
| * 判断一下是否更新版本，默认通过对比html文件是否相等处理 | ||
| * | ||
| * @param old_html - 旧版本的html | ||
| * @param online_url - | ||
| */ | ||
| async function defaultHasNewVersion(old_html: string, online_url?: string) { | ||
| try { | ||
| const new_html = await fetchHtml(online_url); | ||
|
|
||
| const res = old_html !== new_html; | ||
| return res; | ||
| } catch (e) { | ||
| console.error(e); | ||
| return false; | ||
| } | ||
| } | ||
|
|
||
| /** | ||
| * 获取html | ||
| * | ||
| * @param online_url - html url | ||
| */ | ||
| async function fetchHtml(online_url?: string) { | ||
| const res = await fetchWithTimeout( | ||
| online_url ?? window.location.protocol + '//' + window.location.host | ||
| ); | ||
|
|
||
| return res.text(); | ||
| } | ||
|
|
||
| /** | ||
| * 设置超过3600ms，终止fetch请求 | ||
| * | ||
| * @param url - 请求参数 | ||
| * @param timeout - 超时时间 | ||
| * @returns | ||
| */ | ||
| async function fetchWithTimeout(url: string, timeout = 3600) { | ||
| const controller = new AbortController(); | ||
| const id = setTimeout(() => controller.abort(), timeout); | ||
| const response = await fetch(url, { | ||
| signal: controller.signal | ||
| }); | ||
| clearTimeout(id); | ||
| return response; | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters