Web-Frontend
H5-Tutorial
HTML5 implementiert die Desktop-Benachrichtigungsfunktion der Benachrichtigungs-API. _HTML5-Tutorial-Fähigkeiten
HTML5 implementiert die Desktop-Benachrichtigungsfunktion der Benachrichtigungs-API. _HTML5-Tutorial-Fähigkeiten
Herkömmliche Desktop-Benachrichtigungen können als Div geschrieben und in der unteren rechten Ecke der Seite platziert werden, damit sie automatisch angezeigt werden und Nachrichten weiterleiten Umfragen und andere Methoden. Ein Nachteil dieser Methode besteht darin, dass ich beim Einkaufen über JD.com nicht weiß, ob mir Neuigkeiten von Renren übermittelt wurden, sondern ich warten muss, bis ich die aktuelle Seite auf Renren umschalte, um zu erfahren, dass es Neuigkeiten gibt . Diese Methode des Nachrichten-Push basiert auf dem Seitenüberleben, aber wir brauchen eine solche Strategie: Egal welche Seite Sie ansehen, solange eine Nachricht vorhanden ist, sollte sie an mich gesendet werden. Dies ist das Problem, das webkitNotification lösen möchte lösen. Die von Notification generierte Nachricht wird nicht an eine bestimmte Seite angehängt, sondern nur an den Browser.
Der normale Prozess zum Generieren einer Desktop-Benachrichtigung
Sehen wir uns zunächst an, wie eine Desktop-Benachrichtigung generiert wird:
1. Überprüfen Sie, ob der Browser Benachrichtigungen unterstützt
2. Überprüfen Sie die Benachrichtigungsberechtigungen des Browsers (ob Benachrichtigungen zulässig sind)
3. Wenn die Berechtigungen nicht ausreichen, holen Sie sich die Benachrichtigungsberechtigungen des Browsers
5 >HINWEIS: Zum ersten Punkt bedarf es einiger Erklärungen. Die Benachrichtigung wurde noch nicht standardisiert und unterstützt derzeit nur chrome19 und safari6. Es gibt Informationen im Internet, dass Firefox26 dies auch unterstützt, aber die Ergebnisse meines Firefox27-Tests sind dies es kann nicht unterstützt werden.
Ich glaube, jeder kennt Desktop-Benachrichtigungen von HTML5. Zu den gängigen Anwendungen gehört die Webversion von WeChat, für deren Nutzung die Einrichtung der Desktop-Benachrichtigungsfunktion erforderlich ist.
Es ist nicht schwierig, eine solche Funktion mit einem Client-Programm zu implementieren. Für die herkömmliche Webversion von Desktop-Benachrichtigungen können Sie ein Div schreiben und es in der unteren rechten Ecke der Seite platzieren, damit es automatisch angezeigt wird, und Nachrichten über Umfragen und andere Methoden abrufen und an den Benutzer weiterleiten. Ein Nachteil dieser Methode besteht darin, dass ich beim Einkaufen mit Taobao nicht weiß, ob auf Weibo Nachrichten an mich gesendet werden. Ich muss jedoch warten, bis ich die aktuelle Seite auf Sina Weibo umschalte, um zu erfahren, dass Nachrichten gesendet werden für mich. Diese Methode des Nachrichten-Push basiert auf dem Seitenüberleben, aber wir brauchen eine solche Strategie: Egal welche Seite Sie ansehen, solange eine Nachricht vorhanden ist, sollte sie an mich gesendet werden. Dies ist das Problem, das webkitNotification lösen möchte lösen.
Benachrichtigungen sind noch nicht standardisiert, sodass Sie sie nicht auf Websites wie w3cschool erlernen können. Allerdings unterstützen die meisten aktuellen Mainstream-Browser Benachrichtigungen. Die Desktop-Benachrichtigungsdarstellung von HTML5 sieht wie folgt aus:
Der Code lautet wie folgt:
XML/HTML-Code
- >
- <html>
- <Kopf>
- <meta charset="utf- 8">
- <Titel>HTML5-Desktop-Benachrichtigung Titel>
- Kopf>
- <Körper>
- <Eingabe Typ="Schaltfläche" Wert="Desktop-Benachrichtigungen aktivieren" onclick ="showNotice();">
- <Skript>
- Funktion showNotice(){
- Notification.requestPermission(function(status){
- //Der Standardwert des Status „Standard“ entspricht einer Ablehnung. „Verweigert“ bedeutet, dass der Benutzer keine Benachrichtigungen möchte. „Gewährt“ bedeutet, dass der Benutzer der Aktivierung von Benachrichtigungen zustimmt
- if("granted" != Status)
- zurück;
- var notify = new Notification("Message",{
- dir:'auto',
- lang:'zh-CN',
- tag:'sds',//Die ID der instanziierten Benachrichtigung
- //icon unterstützt die Formate ico, png, jpg, jpeg
- icon:'http://www.xttblog.com/icons/favicon.ico',//Miniaturbild der Benachrichtigung
- body:'html5-Desktop-Benachrichtigung' //Der spezifische Inhalt der Benachrichtigung
- });
- notify.onclick=Funktion(){
- //Wenn auf die Benachrichtigungsmeldung geklickt wird, wird das Benachrichtigungsfenster aktiviert
- window.focus();
- }
- });
- }
- Skript>
- Körper>
- html>
Bei dem obigen Inhalt handelt es sich um die vom Herausgeber geteilte HTML5-Implementierung der Benachrichtigungs-API-Desktop-Benachrichtigungsfunktion. Ich hoffe, dass sie für alle hilfreich ist!
Originaltext: http://www.xttblog.com/?p=249
Heiße KI -Werkzeuge
Undresser.AI Undress
KI-gestützte App zum Erstellen realistischer Aktfotos
AI Clothes Remover
Online-KI-Tool zum Entfernen von Kleidung aus Fotos.
Undress AI Tool
Ausziehbilder kostenlos
Clothoff.io
KI-Kleiderentferner
AI Hentai Generator
Erstellen Sie kostenlos Ai Hentai.
Heißer Artikel
Heiße Werkzeuge
Notepad++7.3.1
Einfach zu bedienender und kostenloser Code-Editor
SublimeText3 chinesische Version
Chinesische Version, sehr einfach zu bedienen
Senden Sie Studio 13.0.1
Leistungsstarke integrierte PHP-Entwicklungsumgebung
Dreamweaver CS6
Visuelle Webentwicklungstools
SublimeText3 Mac-Version
Codebearbeitungssoftware auf Gottesniveau (SublimeText3)
Heiße Themen
PHP- und Manticore-Suchentwicklungshandbuch: Erstellen Sie schnell eine Such-API
Aug 07, 2023 pm 06:05 PM
PHP- und ManticoreSearch-Entwicklungshandbuch: Erstellen Sie schnell eine Such-API. Die Suche ist eine der unverzichtbaren Funktionen moderner Webanwendungen. Unabhängig davon, ob es sich um eine E-Commerce-Website, eine Social-Media-Plattform oder ein Nachrichtenportal handelt, muss eine effiziente und genaue Suchfunktion bereitgestellt werden, damit Benutzer die Inhalte finden, die sie interessieren. Als Volltextsuchmaschine mit hervorragender Leistung stellt uns ManticoreSearch ein leistungsstarkes Tool zur Erstellung hervorragender Such-APIs zur Verfügung. Dieser Artikel zeigt Ihnen, wie es geht
Wie kann ich Daten durch Aufrufen der API-Schnittstelle in einem PHP-Projekt crawlen und verarbeiten?
Sep 05, 2023 am 08:41 AM
Wie kann ich Daten durch Aufrufen der API-Schnittstelle in einem PHP-Projekt crawlen und verarbeiten? 1. Einführung In PHP-Projekten müssen wir häufig Daten von anderen Websites crawlen und diese Daten verarbeiten. Viele Websites bieten API-Schnittstellen, und wir können Daten durch Aufrufen dieser Schnittstellen abrufen. In diesem Artikel wird erläutert, wie Sie mit PHP die API-Schnittstelle zum Crawlen und Verarbeiten von Daten aufrufen. 2. Ermitteln Sie die URL und die Parameter der API-Schnittstelle. Bevor Sie beginnen, müssen Sie die URL der Ziel-API-Schnittstelle und die erforderlichen Parameter ermitteln.
React API Call Guide: So interagieren und übertragen Sie Daten mit der Backend-API
Sep 26, 2023 am 10:19 AM
ReactAPI-Aufrufanleitung: So interagieren Sie mit der Backend-API und übertragen Daten an diese. Übersicht: In der modernen Webentwicklung ist die Interaktion mit und die Übertragung von Daten an die Backend-API eine häufige Anforderung. React bietet als beliebtes Front-End-Framework einige leistungsstarke Tools und Funktionen, um diesen Prozess zu vereinfachen. In diesem Artikel wird erläutert, wie Sie mit React die Backend-API aufrufen, einschließlich grundlegender GET- und POST-Anfragen, und es werden spezifische Codebeispiele bereitgestellt. Installieren Sie die erforderlichen Abhängigkeiten: Stellen Sie zunächst sicher, dass Axi im Projekt installiert ist
Speichern Sie API-Daten mit Python im CSV-Format
Aug 31, 2023 pm 09:09 PM
In der Welt der datengesteuerten Anwendungen und Analysen spielen APIs (Application Programming Interfaces) eine entscheidende Rolle beim Abrufen von Daten aus verschiedenen Quellen. Wenn Sie mit API-Daten arbeiten, müssen Sie die Daten häufig in einem Format speichern, das leicht zugänglich und einfach zu bearbeiten ist. Ein solches Format ist CSV (Comma Separated Values), mit dem tabellarische Daten effizient organisiert und gespeichert werden können. In diesem Artikel wird der Prozess des Speicherns von API-Daten im CSV-Format mithilfe der leistungsstarken Programmiersprache Python erläutert. Indem wir die in diesem Leitfaden beschriebenen Schritte befolgen, erfahren wir, wie wir Daten aus der API abrufen, relevante Informationen extrahieren und sie zur weiteren Analyse und Verarbeitung in einer CSV-Datei speichern. Tauchen wir ein in die Welt der API-Datenverarbeitung mit Python und erschließen wir das Potenzial des CSV-Formats
Analyse der Oracle API-Integrationsstrategie: Erreichen einer nahtlosen Kommunikation zwischen Systemen
Mar 07, 2024 pm 10:09 PM
Analyse der Oracle API-Integrationsstrategie: Um eine nahtlose Kommunikation zwischen Systemen zu erreichen, sind spezifische Codebeispiele erforderlich. Im heutigen digitalen Zeitalter müssen interne Unternehmenssysteme miteinander kommunizieren und Daten austauschen, und Oracle API ist eines der wichtigen Tools, um eine nahtlose Kommunikation zu erreichen Kommunikation zwischen Systemen. Dieser Artikel beginnt mit den grundlegenden Konzepten und Prinzipien von OracleAPI, untersucht API-Integrationsstrategien und gibt schließlich spezifische Codebeispiele, um den Lesern zu helfen, OracleAPI besser zu verstehen und anzuwenden. 1. Grundlegende Oracle-API
Oracle API-Nutzungshandbuch: Erkundung der Datenschnittstellentechnologie
Mar 07, 2024 am 11:12 AM
Oracle ist ein weltbekannter Anbieter von Datenbankmanagementsystemen und seine API (Application Programming Interface) ist ein leistungsstarkes Tool, das Entwicklern hilft, einfach mit Oracle-Datenbanken zu interagieren und diese zu integrieren. In diesem Artikel befassen wir uns mit dem Oracle API-Nutzungsleitfaden, zeigen den Lesern, wie sie die Datenschnittstellentechnologie während des Entwicklungsprozesses nutzen können, und stellen spezifische Codebeispiele bereit. 1.Orakel
So gehen Sie mit Laravel-API-Fehlerproblemen um
Mar 06, 2024 pm 05:18 PM
Titel: Wie man mit Laravel-API-Fehlerproblemen umgeht, sind spezifische Codebeispiele erforderlich. Bei der Entwicklung von Laravel treten häufig API-Fehler auf. Diese Fehler können verschiedene Ursachen haben, z. B. Logikfehler im Programmcode, Probleme bei Datenbankabfragen oder Fehler bei externen API-Anfragen. Der Umgang mit diesen Fehlerberichten ist ein zentrales Thema. In diesem Artikel wird anhand spezifischer Codebeispiele gezeigt, wie Laravel-API-Fehlerberichte effektiv verarbeitet werden. 1. Fehlerbehandlung in Laravel
RESTful API-Entwicklung mit Laravel: Aufbau moderner Webdienste
Aug 13, 2023 pm 01:00 PM
RESTful API-Entwicklung mit Laravel: Aufbau moderner Webdienste Mit der rasanten Entwicklung des Internets steigt die Nachfrage nach Webdiensten von Tag zu Tag. Als moderne Webdienstarchitektur ist RESTfulAPI leichtgewichtig, flexibel und leicht erweiterbar und wird daher häufig in der Webentwicklung eingesetzt. In diesem Artikel stellen wir vor, wie Sie mit dem Laravel-Framework eine moderne RESTful-API erstellen. Laravel ist eine PHP-Sprache
