Blazor in 2020 - Teil 4 - Misc.

1. Einführung: Hallo und willkommen in der vierten Klasse aus dem Siri off Blazer im Jahr 2000 und 20 jetzt in diesem letzten. Eigentlich werden wir alles abdecken, was nicht in die vorherige Brille passte. Beispiel ZumBeispiel JavaScript-Interaktionen oder das Zurücklaufen sehr wichtige Dinge geworfen, aber nicht grundlegende Dinge , nicht etwas, das in die Navigation gehört, nicht etwas, das in irgendeiner von der vorherigen Klassen. Also werden wir jetzt mehr abdecken, und damit wirst du Blazer ziemlich wahrscheinlich verwenden können, damit wir loslegen. 2. Web Sockets: Hallo. In dieser Vorlesung werde ich Ihnen zeigen, wie Sie einen Web-Socket einrichten. Ein reines Netz. Fußball gehen von Meer Shop Shop zu sehen, die Seite Blazer liegend ist. Siehe Shop auf der Serviceseite. Siehe Sharper in diesem Fall, ein P I Dr. Corey P I C. Sharp. Richtig. Es ist also kein Javascript involviert? Keiner überhaupt. Und ah, unten Beispiel. Wir hatten einfach Staaten mit Staat aus der Steckdose. A k wird in diesem Fall offensichtlich geöffnet. Und was passiert dann auf dem Server? Wir haben tatsächlich eine kleine Liste, die die Duftnachrichten speichert und dann alle paar Sekunden sendet es eine Nachricht zurück, die besagt, wie viel oder besser gesagt, wie viele Nachrichten empfangen wurden. Siehst du, verlor Check bei 47. 17 jetzt. Und ah, jetzt 20 HOK ist es alle drei Sekunden. Ah, Freizeit. Niedriger Test am besten rechts. Schicken wir es. Okay, also haben wir ein kleines Debuggen vor sich. Lass uns das einfach überspringen. Es kam so und wir haben jetzt geschickt. Und wie Sie sehen können, hat es sich geändert. A kam es hat sich geändert. Sehen wir uns jetzt an, wie das Ganze funktioniert. Eigentlich ist es ziemlich interessant. Okay, also in der Lösung. Explorer im Projektmappen-Explorer haben wir zwei Projekte zu verschiedenen Projekten. Wir haben eine Webanwendung, eine, die das A-I-Projekt ist. Und dann haben wir Blazer Ramp eins, das ist die Blazer-Client-Seite. Nun, für die Blazer-Client-Seite, wir kümmern uns nur um Index Dot Razor auf für die Anwendung. Das ap on Projekt, das uns wirklich wichtig ist, begann nicht zu spüren. Wenn wir also darauf hineingehen, können Sie sehen, dass wir Ah haben. Ah, ein ziemlich kniffliges Arrangement. Haar OK, Grundsätzlich, um diese Steckdosen zu etablieren, die Sie in der a p haben müssen. Ich benutze Web-Sockets und dann kommt die eigentliche Handhabung in Haar, die Sie verwenden. Okay, du hast so benutzt und dann überprüfst du, ob der Web-Socket offen ist, okay? Oder besser gesagt, es sind Web-Socket-Anfragen für jetzt. OK, wir haben Wir müssen dafür überprüfen und dann überprüfen wir für die Partybüros, aber Pfad, Dann wird es die Steckdose akzeptieren, und deshalb wird es geöffnet werden. Nun, der eigentliche Web-Socket, den wir im Programm halten, sieht es nicht in Ordnung, es ist im Programm Punkt CS Wenn wir gehen, rechtes Haar haben wir dot CS programmiert. Okay, wir haben den Web-Socket , der von System Dot Net Dot Web Sockets Dot Web Socket kommt, den wir WB nennen und es ist nicht durch das Fort. Nun, diese Web Saunders Jäger schwer einzurichten, aber sie sind sehr schwierig, um die Verwendung von rund vielen ein normalerweise geht mit ihnen und noch wichtiger, wir sind ziemlich schwierig, in diesen kleinen Namen Räume einen Fall zu finden dass wir zurück an den Anfang von don't CS. Jetzt können Sie sehen, dass wir es akzeptieren und dann müssen wir ein paar Dinge tun. Also im Grunde müssen wir ein paar Aufgaben ausführen, aber was Sie auch in dieser App tun müssen, müssen Sie es nicht vollständig entkommen lassen. Also schaffen wir uns oft leere Schleife und es verhindert, dass ich entkommen kann, während der Zustand offen ist . Okay, wenn es sich schließt, entkommt es offensichtlich und alles wird heruntergefahren. Aber in der ersten Aufgabe in der ersten beginnt curl, wir natürlich, dass tun, während ein k wir tun, während Und das ist, wo wir abrufen. Aber wir rufen das Ergebnis ab. So erhalten wir eine Spüle. Wir erhalten Abita re. Okay, wir bekommen mein Weingut. Wir nehmen es in Ryan Haar in unserem kleinen Botha. Und dann haben wir zur Liste der empfangenen Nachrichten direkt hier hinzugefügt. Wir haben Nachrichten, Listenzeichenfolge, Liste der Strings erhalten Listenzeichenfolge, , und wir erhalten einfach den Text von diesen Punkten aus einem Bind-Array. Und wir haben in der Nachricht hinzugefügt ist jetzt für das Senden einer Nachricht. Wir führen wieder eine andere Aufgabe aus, weil sie offensichtlich nicht zusammenarbeiten würden. Nun, da wir eine Antwort erhalten müssen, müssen wir die ganze Zeit darauf warten. Und das würde anders sein, richtig? Eso im Grunde, was wir hier haben, ist wir weg kostenlos 1000. Okay, Millisekunden. Das sind mehr als drei Sekunden und dann senden wir eine Nachricht an den Kunden. Wir senden eine Nachricht an einen Client und sehen empfangene Nachrichten, die wiederzählen und verloren gehen. Überprüfte viel Check Toe Bedeutung überprüft auf der weiter Mit, dass wir den Typ hinzufügen und dann das wahre bedeutet das Ende einer Nachricht. Wenn es bis zum Ende einer Nachricht ist, warten wir noch darauf. Dies ist im Grunde die Service-Zeichen-Anordnung. Es gibt viele Optionen, um wirklich aus vielen Möglichkeiten zu wählen, um diese verschiedenen Fehler zu behandeln. Das ist ein primitiver Weg. Aber ich gebe Ihnen einen guten Ausgangspunkt, von dem Sie verschiedene Fehler erweitern und behandeln können . Und Sie immer es von den Dingen. Nun, wenn wir zum Index Dot Razor gehen , der mit Pornos mit eigentlich interessant für uns hat, richtig, richtig, wir haben unseren Client, unseren Web-Socket-Client und der eigentlich Client Web-Socket ist. Also dieser kommt von System Dot Net Web Sockets Client Web Socket Web Socket. Wir nennen es C l Web-Sockel, in diesem Fall, oder? Und wir konstruieren es. Wir haben nur so eine normale Variable konstruiert. Okay, damit haben wir eine neue Nachricht Wearable, die mit der Eingabe gesinnt ist. Und dann haben wir auch Message-Anzeige erhalten, die wir anzeigen. Dies ist die Meldung Thema wird angezeigt. Okay, also, wie man es dann erhält? Das ist ein bisschen kniffliger Teil. Percival auf initialisieren die denken, die wir brauchen, um tatsächlich eine Verbindung herzustellen. Und um das zu tun, er dio erwarten CEO bis Steckdose. Ok. Und verwenden Sie eine Spüle in, verbinden Sie eine Spüle. Sie stellen die u. R I Ok, Sie stellen die Ihre Augen rechte Haare, das ist im Grunde Ihr Domain-Name, Ihr lokaler Host und die Route der s, die wir am Anfang von Punkt CS erklärt haben Aber tun bemerken, Merkst du? Sehr wichtig, wir haben Ah w s. Also ist es nicht Http, es ist nicht HCP s. Es ist w s. Also es ist ein anderes Protokoll, richtig? Du musst das benutzen. Dies ist für sichere Sockelschichten. Und wenn Sie das nicht haben, wenn es keine sichere Verbindung ist, würden Sie doppelte U. S.machen S. Okay, also ist es ziemlich wichtig, sich daran zu erinnern, dass es leicht ist zu verpassen, was Sie den Fehler sehen würden ganz deutlich im Konsul angezeigt. Und dann haben wir einen Stornierungstoken , der keiner ist. Wir wissen es im Grunde. Haben Sie jetzt einen, um einen zu erhalten. Um eine zu erhalten, müssen Sie eine Aufgabe vom Kurs ausführen, richtig. Sie müssen eine Aufgabe ausführen und dann haben wir ah wow Lippen, die wir empfangen, während die Verbindung offen ist. Wir empfangen. Wir erhalten erhalten Empfang, dass wir dio durch genau wie wir in dem Server empfangen Recht haben . Und dann haben wir Nachricht empfangen erwarten und um es zu erhalten, müssen Sie eine Spüle erhalten, die die Vita Ray ist. Es geht vorbei, um eine Nachricht zu schwärmen und dann protestieren wir, und wir setzen das in die empfangene Nachricht, die eine Sache zu beachten ist. Natürlich müssen wir sie benutzen Estate hat sich geändert. Sonst wird nichts wirklich funktionieren. Ich kam, also ist das sehr wichtig, sich in dieser Hinsicht zu erinnern. Jetzt haben Sie diese empfangenen Nachrichtendinge gesehen und ich implementiere sie jetzt nicht weil es Dinge durcheinander bringen würde. Aber wenn wir gehen in sie empfangene Nachricht so, Sie können sehen, dass wir ah sagen, zum Beispiel, schließen Status. Wir haben eine enge Statusbeschreibung. Wir haben Zählung. Wir haben das Ende der Nachricht gebilligt. Also beschreibt es im Grunde in diesem Fall, wo es ein Ende der Nachricht ist, oder wir können immer noch ah, warten auf eine andere Nachricht für eine andere Forderung, um diese Nachricht mit vier Nachrichten zu vervollständigen . Du brauchst dir keine Sorgen um das Zeug zu machen. Es sollte funktionieren, genau wie Radha zu finden. Dies ist mehr für eine Art größeres Arrangement wieder und dann den Schließstatus. Sie können tatsächlich eine enge Nachricht senden und mir dann eine schließende Sache empfangen und das Schließen und die Nachricht behandeln . Art des Nachrichtentyps haben wir zwei Mal für. Haben Sie eine Steuer. Kombinieren Sie eine Wieder. Normalerweise werden Sie dort Steuern verwenden. Aber wieder, ich gebe gibt grundlegende Sachen, aus denen Sie aufbauen können. Nun ist das Absenden auch ganz einfach. Es ist genau wie auf der Serviceseite. Ziemlich richtig. Oder in der a p r. In diesem Fall kein Service. Ich wirklich haben wir eine Wartezeit cl Web-Sockel warten, oder? Ich werde Web-Sockel. Und dann schickst du eine Spüle und benutzt dann all das Zeug, das du im A P I Teil gesehen hast. Okay, wir bekommen die Bisse aus dem Text. Dann haben wir einen Nachrichtentyp deklariert und wir haben eine wahre und eine Nachricht, richtig? Es sendet eine Nachricht und dann haben wir Stornierungs-Token, die wir nicht haben. Also tun wir keines. Und das war's. So funktioniert es. Es läuft schon eine ganze Weile, oder? Okay, nun, wir haben es am Laufen. Richtig. Habe das ist V a p i Teil läuft jetzt. Dies wäre die Client-Seite, die rechte Hälfte läuft. Senden Sie eine weitere Nachricht. Es hat Käfer. Okay, es ist eine Art Klammer an diesem Punkt und Sie können sehen, dass wir die Bind-Dienste erhalten. Unser Botha, es braucht nicht die volle Bata. Wir haben die Bisse bekommen. Also einfach so können wir weitermachen, richtig? Und es wird uns geben. Siehst du, wir haben jetzt zwei Nachrichten. So funktioniert es also. So läuft es. Vergessen Sie nicht, dass Sie Teoh zuerst das A P I-Projekt ausführen, wenn Sie d clientseitige Projekt ausführen . Offensichtlich, Phoebe, werde ich nicht rennen. Es wird nichts haben, mit dem Sie sich verbinden oder einfach die Client-Seite ausführen können. Sie ein Projekt starten Sie VP I und aktualisieren Sie dann das Recline Side Projekt. Und bevor das gesagt wird, werden wir mit einem Vortrag abschließen. 3. Hintergrundfragen: Hallo In diesem Vortrag wird einen Blick auf einige Hintergrundaufgabe laufen, laufen von ihnen, initiieren sie und all das Zeug im Grunde das wichtigste. Aber Sie haben wirklich schon in der Sache gesehen. Aber ich möchte nur hervorheben, nicht weil es sehr, sehr wichtig ist . Und Sie werden das tatsächlich verwenden. Also in unserem Beispiel, rechtes Haar, wir haben nur ah, spielen ein kleines Ding. Grundsätzlichhaben wir, haben wir, Ah, Zufallszahlen ändern sich alle paar Sekunden oder alle paar Millisekunden. Vielmehr. Okay, Sie können sehen, wie es sich in der Bankrunde ändert und es in den Vordergrund bringt. Zeigt es an, und das war's. Okay, also werfen wir einen Blick darauf, wie es tatsächlich funktioniert. Und wir schauen nur auf den Index Punkt Heben Sie die rechte Hand. Nichts Leckeres an Match. Ich kam schon. Wir haben eine Zeichenfolge für die Anzeige aufgerufen. Wir haben angezeigt, wenn Haare haben wir etwas Fremdgröße hinzugefügt, um es ein wenig größer zu machen. Okay, und dann haben wir diese Hintergrundaufgabe. Also, was wir hier haben, ist aus. Unbestimmte Schleife sagte zu wahr. Es wird für immer laufen. Im Grunde. Und dann haben wir ein Gewicht. Also wartet es eine Sekunde und es erzeugt so ein neues Zufallsprinzip. Und von dort erzeugt es eine neue Zufallszahl. Okay, also wäre es ein sehr nutzloses Beispiel, wenn es kein Blazer wäre. Wenn du es nicht im Vordergrund zeigen musstest, in das Du I Fred. Okay, was passiert also? Dies ist eine Hintergrundaufgabe und der Grund, warum es eine Hintergrundgespräche ist, weil wir nicht erwarten. Wir lassen es einfach im Hintergrund laufen und das Set Also sollte man einstellen, dass es sich nicht ändern würde, es sei denn, du hättest das. Siehst du, wir haben ah, der Staat hat sich geändert. Also unterschreiben wir es. Und bei einer normalen Methode würde es unsere Art des Onedio verändern. Sie müssten zusätzliche Arbeit benötigen. Aber wenn Sie es im Hintergrund haben, müssen Sie mit Zustand initiieren hat sich geändert, sonst ändert sich nichts. Wenn Sie also an diesen Hintergrundwerfen arbeiten, wenn etwas angezeigt wird, obwohl es sollte, ist dies wahrscheinlich das Problem, zuerst zu betrachten. Okay, also mit allem, was gesagt hat, werden wir mit einem Vortrag abschließen 4. JavaScript ausführen: Hallo, Invest Vortrag. Ich möchte Ihnen zeigen, wie Sie JavaScript vom C-Shop ausführen, wie Sie auf eine Kelchgrifffunktion zugreifen und von C scharf ausgeführt werden und dann eine Rückkehr davon erhalten . Nun, in diesem niedrigen Beispiel, haben wir, ah, einige grundlegende Dinge. Grundsätzlich einige Dinge, die Sie einfach nicht Zugang Grippe-Blazer. Und eines dieser Dinge wäre der Speicher, der wieder lokale Speichersitzungsspeicher ist. Also diese Dinge, auf die Sie nicht zugreifen können, also ist es eine gute Möglichkeit, tatsächlich über diese Art von Interrupt-Funktion darauf zuzugreifen, okay? Und dann können Sie auch Ihren benutzerdefinierten GS-Code ausführen. Vielleicht haben Sie einen alten Code. Sie integrieren es mit Blazern, die zu komplex sind. Oder vielleicht haben Sie eine Bibliothek, die Sie verwenden möchten. Das ist E G Bibliothek, Kelch, Drehbuch, Bibliothek. Also, wenn ich darauf klicke, es läuft, es gibt die Nummer zurück, zeigt Ihre Funktion, und dann haben wir einfügen in den Speicher. Also fügen wir etwas richtig ein, und dann holen wir Sie ab. Siehst du, wir haben Testwert. So funktioniert das Beispiel. Es z ganz einfach. Sie müssen wirklich nur den Code sehen. Okay. Und, ah, der Code Zunächst muss ich die Struktur erklären. Okay, also gehen wir Teoh Ah, Blazer App und dann gehen wir zu w Route. Hier möchten Sie Ihre Javascript-Dateien haben. Und hier möchten Sie auch Ihre CSS-Dateien haben. Wie eine und W W Route. Nun, das ist unsere JS-Datei, die gekommen ist. Wir haben unsere JS-Datei und die Art, wie Sie es deklarieren, können Sie nicht in Reza tun. Du kannst es nicht in Daughtry tun, eine Datei, die du brauchst, kann Teoh es deklarieren. Ah Fatchett eher in der HTML-Datei in der ursprünglichen HTML-Datei. Richtiges Haar. Siehst du, wir haben ein Drehbuch. Hat Gs eingereicht oder Gs, wie sie sah. Es funktioniert jetzt perfekt für die Serviceseite. Wenn Sie so etwas tun müssen, würden Sie es im Meer als Punkt-HTML-Datei in dieser Host-Datei deklarieren. In dieser Anfangsdatei ist das so ziemlich ein Thema, oder? Und die eigentliche Akte. Siehst du, was wir haben, hat ein bisschen eine Struktur vor sich. Zunächst einmal wickeln wir alles in diesen Variablentest G s Okay, also haben Sie irgendwie diesen vordefinierten Namensraum, den wir in diesem Test einwickeln, sie s und dann haben wir unseren Funktionsnamen. Wir haben Testfunktion, und dann haben wir ein paar Argumente, okay? Kann Argumente liefern. Und dann haben wir eine Rückkehr gemacht. Sie müssen nicht wirklich eine Rückkehr übernehmen. Sie können vermeiden. Okay, also musst du das nicht tun. Sie müssen keine Argumente dafür angeben, dass ich Ihnen alle Möglichkeiten zeigen möchte, die es gibt. Nun, wenn wir zum Index Doc Razor gehen. Okay, zuerst haben wir die erste Methode, richtig? Run, Testfunktion jetzt für alles, was in Bezug auf gs JavaScript-Interaktionen funktioniert. Wir brauchen diese Injektion. Wir injizieren i j s Laufzeit, und in diesem Fall nennen wir es J s nie ein bisschen nach unten gehen. Genau so. Wir sind gelaufen. Wir haben Testfunktion ausgeführt. Okay, Wir haben Testfunktion ausgeführt, und dann haben wir doppelt, was für Display eins verschiebt. Das ist das Ergebnis. Wie Sie gesehen haben, wenn Sie nicht sehen, dass wir eindeutig ein paar Argumente haben und dann fügen wir sie einfach zusammen in dieser Javascript-Funktion und wir geben sie jetzt in der Methode zurück, wir warten und von Maggie als Injektion verwenden wir in buchen Sie eine Spüle Methode in Buch eine Spüle. Okay. Und dann deklarieren Sie den Rückgabetyp. Du bist zu clever. Rückgabezeit wurde, und dann wird es zurückgegeben und zugewiesen. Nun, was Sie bereitstellen müssen, ist im Grunde der Name einer Funktion, oder besser gesagt, der vollständige Namensraum für die gesamte Funktion. Okay? Sie schreiben nicht in einer vollständigen Funktion, wie Sie sehen können, aber Sie geben Argumente in dieser Liste aus Argumenten an, so dass Sie keine Klammer haben, ist nichts dergleichen. Okay, gib sie einfach rein. In irgendeiner Weise, damit man Saiten haben kann. Sie können Ah, Zahlen haben . Aber seien Sie vorsichtig? Denn JavaScript, natürlich, wie Sie wahrscheinlich wissen, hat einen ziemlich Fisch weg von der Handhabung verschiedener Typen. Okay, also können wir eine Spüle aufrufen, einen Typ deklarieren, oder wir können einfach ein leeres tun oder vermeiden So würden Sie leere, ein Waschbecken aufrufen , und das hätte keine Rückkehr. Im Grunde. Jetzt werden wir das nicht tun, aber wir können einen Blick auf eine andere Option werfen. Ah, diese weichen nativen ah, Funktionen von und Javascript bietet solch einen Satz Artikel für den lokalen Speicher. Sie müssen es in keiner Weise definieren. Sie können sie einfach auf deklarieren. Führen Sie sie aus. Okay, in diesem Fall haben wir aus dem lokalen Lagerset Artikel. Es gibt im Grunde fügt den neuen Wert ein. Okay, also haben wir Ah, den Schlüssel dafür. Du und die Werteprüfwerte dort, legen Sie in die Lagerung ein. Du hast es verkauft, aber in Aktion. Und dann die 2. 1 sehr viel das gleiche, was wir haben, ah, lokale Lagerung. Artikel abrufen. In diesem Fall bieten wir nur ein erträgliches Recht? Und das ist Gelübde. Also holen wir es ab. Und genau hier weisen wir eine fremde Anzeige zu Also so funktioniert es im Grunde wieder. Es ist ziemlich einfach zu bedienen. Da gibt es keine echten Tricks und Tricks. Nur eine einfache Möglichkeit, auf Javascript zuzugreifen. Und bevor das sagte, wir werden diese Wahl zu schließen