https://github.com/socheatsok78/use-refresh-lock

useRefreshLock - Ensure that user allow the browser to refresh
https://github.com/socheatsok78/use-refresh-lock

beforeunload refresh-lock

Last synced: 4 months ago
JSON representation

useRefreshLock - Ensure that user allow the browser to refresh

• Host: GitHub
• URL: https://github.com/socheatsok78/use-refresh-lock
• Owner: socheatsok78
• License: mit
• Created: 2020-07-27T12:07:25.000Z (almost 5 years ago)
• Default Branch: master
• Last Pushed: 2023-01-06T12:35:52.000Z (over 2 years ago)
• Last Synced: 2025-03-02T02:48:05.742Z (4 months ago)
• Topics: beforeunload, refresh-lock
• Language: TypeScript
• Homepage: https://www.npmjs.com/package/use-refresh-lock
• Size: 267 KB
• Stars: 1
• Watchers: 2
• Forks: 0
• Open Issues: 6
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# use-refresh-lock

Ensure that user allow the browser to refresh

[![npm-version](https://img.shields.io/npm/v/use-refresh-lock)][npm-url]

[![npm-minzip](https://img.shields.io/bundlephobia/minzip/use-refresh-lock)][npm-url]

[![npm-download](https://img.shields.io/npm/dm/use-refresh-lock)][npm-url]

### Installation

```sh

yarn add use-refresh-lock

```

### Usage

Create a simple refresh lock

```js

import { useRefreshLock } from 'use-refresh-lock'

// create a lock

const release = useRefreshLock()

// now when you refresh the browser, the browse will prompt an

// 'Change you made may not be save.' prompt (aka Chrome)

// release the lock, just call the `release` method returned by `useRefreshLock`

release()

```

Aditionally, you could provide a callback to `useRefreshLock`. Recommended to use only to call `navigator.sendBeacon` only.

> See: https://developer.mozilla.org/en-US/docs/Web/API/Navigator/sendBeacon

```js

import { useRefreshLock } from 'use-refresh-lock'

const release = useRefreshLock(function() {

    // execute before the page successfully unloaded/reloaded

    navigator.sendBeacon("/log", analyticsData);

})

```

## License

License under [MIT](LICENSE)

[npm-url]: https://www.npmjs.com/package/use-refresh-lock