Site icon Régis Enguehard

Utiliser la fonctionnalité window.native.share()

Presque tous les navigateurs possèdent nativement une fonctionnalité de partage. On peut l’exploiter avec quelques lignes de Javascript.

https://blog.enguehard.info/wp-content/uploads/2022/12/navigator.share_.mov

Le marquage HTML :

<button id="btn-share">Partager</button>

La partie Javascript :

const shareButton = document.getElementById('btn-share');

// Ajoute un écouteur sur le bouton
shareButton.addEventListener('click', (event) => {
	// support de share ?
	if ('share' in navigator) {
    navigator
    	.share({
			title: 'Régis ENGUEHARD',
			text: 'Geek, HTML, CSS, PHP, Debian…et autres joyeusetées',
			url: 'https://blog.enguehard.info/',
		})
		.then(() => {
			console.log('Callback après partage');
		})
		.catch(console.error);
	} else {
		console.log('navigator.share() n\'est pas supporté');
	}
});

Tous les navigateurs ne supportent pas cette fonctionnalité : https://caniuse.com/?search=web%20share%20API

Capture d’écran du site caniuse avec la propriété “Web Share API”
Quitter la version mobile