Pixi.js: "WebGL wird in diesem Browser nicht unterstützt" bei Verwendung von Chrome 74 mit GTX 780

Wenn WebGL in diesem Browser nicht unterstützt wird, verwenden Sie pixi.js-legacy für die Fallback-Canvas2d-Unterstützung.

Das ist ein anderes Bündel in npm. Ihre Konfiguration verwendet pixi.js

Wenn WebGL in diesem Browser nicht unterstützt wird, verwenden Sie pixi.js-legacy für die Fallback-Canvas2d-Unterstützung.

Das ist ein anderes Bündel in npm. Ihre Konfiguration verwendet pixi.js

Aber der von mir verwendete Browser unterstützt eindeutig WebGL

Funktionieren die v5-Beispiele unter https://pixijs.io/examples/ für Sie? Diese Seite, die Sie gezeigt haben, ist einfaches Webgl, ja oder nein. Wenn wir jedoch einen Webgl-Kontext erstellen, fordern wir ihn mit ein paar zusätzlichen Parametern an, z. B. der Anforderung von Schablonenunterstützung.

Das ist aber sowieso der Fehler, und deshalb versuchen wir auf diese Weise zu helfen. Wir haben noch nie einen Fehler außerhalb des Geräts gesehen, das Webgl nicht unterstützt oder die Webgl-Parameter, die pixijs erfordert

Funktionieren die v5-Beispiele unter https://pixijs.io/examples/ für Sie? Diese Seite, die Sie gezeigt haben, ist einfaches Webgl, ja oder nein. Wenn wir jedoch einen Webgl-Kontext erstellen, fordern wir ihn mit ein paar zusätzlichen Parametern an, z. B. der Anforderung von Schablonenunterstützung.

Das ist aber sowieso der Fehler, und deshalb versuchen wir auf diese Weise zu helfen. Wir haben noch nie einen Fehler außerhalb des Geräts gesehen, das Webgl nicht unterstützt oder die Webgl-Parameter, die pixijs erfordert

Diese Beispiele funktionieren nicht (v4 funktioniert, aber nicht v5) und geben auch den gleichen Fehler aus. Das kommt mir wirklich komisch vor, ich bin mir nicht sicher, warum mein Browser das nicht unterstützt.

Ich habe auch meine funktionierende pixi.js-App überprüft und sie verwendet 5.0.0-rc.2, weshalb sie möglicherweise funktioniert?

Danke nochmal für die Hilfe

v4 funktioniert, weil es auf den Canvas-Renderer zurückgreift. In der offiziellen Version für v5 nicht, es sei denn, Sie verwenden das Legacy-Paket.

Vielleicht unterstützt Ihre gfx-Karte Webgl, hat aber keine Schablonenunterstützung, die wir zum Maskieren benötigen, also lehnen wir den Versuch ab, sie zu verwenden?

Nur für den Fall, dass es sich um eine Schablone handelt, versuchen Sie, Ihren Grafiktreiber zu aktualisieren.

Es wird jedoch sehr lustig, wenn sich herausstellt, dass Webpack die Dinge wirklich beeinflusst :)

Okay, das ist super seltsam, mein Desktop (i7 7700k, gtx 780) läuft nicht, aber es funktioniert auf meinem Surface Book 1, meinem iPhone XS und meinem Macbook Pro 2015 von Freunden. Meine GPU ist irgendwie alt, aber ich habe es nicht getan. Ich glaube nicht, dass es das Problem sein würde.

Wenn ich nichts anderes versuchen sollte, werde ich wohl einfach das Legacy-Paket verwenden, da ich maximale Kompatibilität möchte (und ich auch nicht wirklich etwas entwickeln kann, das ich nicht ausführen kann).

Installieren Sie den Grafiktreiber neu, Version vorwärts oder rückwärts. GPU ist kein Problem, aber Opengl-Teil des Treibers ist.

Warten Sie eine Sekunde, ich fühle mich wirklich dumm, ich denke, es ist ein Chrome-Problem, es funktioniert in Microsoft Edge ... obwohl ich Chrome sowohl auf meinem Laptop als auch auf meinem Telefon verwendet habe, war das seltsam.

Browser haben eine Blacklist für unterschiedliche Hardware... manchmal ist es einfach Webgl komplett zu deaktivieren, manchmal aber auch um bestimmte Features auf bestimmten Hardware-/Treiberversionen auf die Blacklist zu setzen, wenn bekannte Probleme vorliegen.

Ich habe den Titel dieses Problems aktualisiert (kein Webpack + PixiJS-Problem) und als "Wird nicht behoben" markiert, da es sich sehr wahrscheinlich um ein Hardware-/Treiberproblem handelt.

Okay, die Verwendung von pixi.js-legacy und das Ändern aller Elemente, um auf pixi.js-legacy zu verweisen, führt immer noch zu demselben Fehler.

Ich habe meine Arbeitsversion mit 5.0.0-rc.2 überprüft und sie _funktioniert_ mit webgl2:

Aber die Verwendung von 5.0.0-rc.2 gibt mir diesen Fehler: "Uncaught TypeError: Cannot read property 'performMixins' of undefined" in meiner Webpack-Version.

Jede Hilfe wäre dankbar, danke!

Bitte verwenden Sie nicht 5.0.0-rc.2. Verwenden Sie die neueste Version: 5.0.3

Ich habe gerade 5.0.3 ausprobiert, "Nicht abgefangener Fehler: WebGL wird in diesem Browser nicht unterstützt. Verwenden Sie "pixi.js-legacy" für den Fallback-Canvas2d-Support." wie vorher. Ich habe eine laufende Version mit PixiJS 5.0.0-rc.2, die besagt, dass sie mit WebGl 2 läuft. Gibt es einige neue Funktionen, die zu 5.0.1+ hinzugefügt wurden, die dazu führen würden, dass es nicht funktioniert?

Ein bisschen mehr Tests zeigen einige potenzielle Seltsamkeiten

1. Am Rand
   V5- Beispiele laufen, aber mit _WebGL 1?_
   
   V4- Beispiele laufen wieder mit _WebGL 1_
   
   Mein Arbeitsspiel (https://ascension.azurewebsites.net/game.html) läuft Pixi.js 5.0.0-rc.2 läuft mit _Webgl 1_
   
   Mein Webpack-Spiel lädt mit Pixi.js 5.0.3 mit _WebGL 1_, funktioniert aber nicht richtig
   
2. Auf Chrome
   V5 funktioniert nicht
   
   V4 funktioniert, aber mit _canvas_
   
   Mein Arbeitsspiel läuft mit 5.0.0-rc.2 mit _webgl 2_
   
   Mein Webpack-Spiel hat den Fehler wie im Beitrag mit 5.0.3 erklärt
   

Ich bin mir nicht sicher, ob das überhaupt hilft, kommt mir aber komisch vor

Ich sage voraus, dass der einzig gute Weg darin besteht, eine Funktion zu erstellen, die den Kontext auf die gleiche Weise wie pixi erstellt (fragt nach " stencil: true " und testet es ohne pixi, nur eine einfache html + js.

Dann können Sie Ihren Bericht mit Spezifikationen und Demo an Chromium-Entwickler im Chromium-Bugtracker weitergeben.

Ich verstehe, dass es ein sehr langer Weg ist, aber im Vergleich zu Mozilla sind sie schneller und es gibt eine Hoffnung :)

Ich frage noch einmal: Haben Sie versucht, den Treiber zu aktualisieren?

Ich sage voraus, dass der einzig gute Weg darin besteht, eine Funktion zu erstellen, die den Kontext auf die gleiche Weise wie pixi erstellt (fragt nach " stencil: true " und testet es ohne pixi, nur eine einfache html + js.

Dann können Sie Ihren Bericht mit Spezifikationen und Demo an Chromium-Entwickler im Chromium-Bugtracker weitergeben.

Ich verstehe, dass es ein sehr langer Weg ist, aber im Vergleich zu Mozilla sind sie schneller und es gibt eine Hoffnung :)

Ich frage noch einmal: Haben Sie versucht, den Treiber zu aktualisieren?

Ja, ich habe meine Treiber aktualisiert, ich habe auch WebGL 2.0 Compute in Chrome://flags aktiviert.

Sie vermuten also, dass es sich um ein Problem bei Chrome handelt? Ich werde deinen Vorschlag ausprobieren und sehen, was passiert.

Zufälligerweise traten bei der gtx 780 und 780ti auch beim Spielen des Spiels "Nier Automata" Absturzprobleme auf, möglicherweise sind nur die Treiber für diese Karte in irgendeiner Weise defekt.

Okay, ich habe dieses schnelle Test-Javascript geschrieben:

    var canvas = document.createElement("canvas");
    // Get WebGLRenderingContext from canvas element.
    console.log("Context (no args):");
    var a = canvas.getContext("webgl");
    console.dirxml(a.getContextAttributes());
    console.log("Context (stencil):" );
    var b = canvas.getContext("webgl",{ stencil: true});
    console.dirxml( b.getContextAttributes());
    console.log("Context (failIfMajorPerformanceCaveat):" );
    var c = canvas.getContext("webgl",{ failIfMajorPerformanceCaveat: true});
    console.dirxml( c.getContextAttributes());
    console.log("Context (Both):" );
    var d = canvas.getContext("webgl",{ stencil: true, failIfMajorPerformanceCaveat: true });
    console.dirxml( d.getContextAttributes());
    console.log("Context (Alias):" );
    var e = canvas.getContext("webgl",{ antialias: false});
    console.dirxml( e.getContextAttributes());

Und es scheint, egal was ich versuche, ich bekomme die Schablone nicht wahr. Ich habe dies sowohl auf meinem PC als auch auf meinem Laptop ausprobiert (Laptop funktioniert mit v5). Ich bin mir nicht sicher, was ich an dieser Stelle tun soll.

Machen Sie einen Hack für pixi, der es deaktiviert, entfernen Sie den standardmäßig für RenderTexture-Framebuffer erstellten Schablonenanhang und versuchen Sie, keine Masken zu verwenden;)

Alternativ kannst du auch den anderen Weg gehen und ALTE Treiber ausprobieren :) Übrigens haben Linux-Benutzer diese Art von Problemen häufig

Okay, ich schließe dieses Thema. Pixi.js scheint mit Firefox (webgl 2) richtig zu funktionieren, also werde ich das jetzt einfach verwenden. Ich denke, es könnte eine _spezifische_ Kombination von Treibern + Chrome sein, die dazu führt, dass es nicht funktioniert. Ich habe mehrere Beispiele v5 auf Computern ausprobiert, die von alten Mac-Büchern, alten Windows 7-Computern und meinem Windows 10-Laptop reichen. Es scheint nur, als ob mein PC ein seltsamer Ausreißer ist. Wenn Leute auf dieses Problem mit Firefox, Chrome und Edge stoßen, könnte es sich lohnen, dieses Ticket erneut zu öffnen.

Danke für all die Hilfe Jungs!

Okay, nicht wieder öffnen. Es war zu 100% meine Chrome-Installation, etwas hat es irgendwie durcheinander gebracht, der Wechsel zum Beta-Kanal schien es behoben zu haben.
(Das Herumspielen mit chrome://flags hat nicht geholfen, und das Entfernen aller Erweiterungen hat auch nichts gebracht).

Diese Art von Problem ist sehr nützlich für zukünftige Benutzer, die möglicherweise das gleiche Problem in einer ähnlichen Umgebung haben. Danke für die vielen Details.

Okay, nicht wieder öffnen. Es war zu 100% meine Chrome-Installation, etwas hat es irgendwie durcheinander gebracht, der Wechsel zum Beta-Kanal schien es behoben zu haben.
(Das Herumspielen mit chrome://flags hat nicht geholfen, und das Entfernen aller Erweiterungen hat auch nichts gebracht).

Ich kann bestätigen, dass dies auch bei mir funktioniert hat. Durch die Installation von Chrome Beta hat die App einwandfrei funktioniert. Danke.

Zufällige Entdeckung: Es ist nicht die Schuld von Chrome Beta:

Aus irgendeinem Grund war meine Hardwarebeschleunigung deaktiviert.

Das Aktivieren der Hardwarebeschleunigung hat es für mich getan.

Chrome -> Einstellungen (⌘,) -> Erweitert -> System -> 1. aktivieren

@ivanpopelyshev Könnte dies durch eine alternative Methode zum Maskieren in WebGL gelöst werden? Es gibt noch ein paar weitere Optionen mit Erklärungen zu diesem Stackoverflow-Thread

Ich denke, wenn wir es manuell aktivieren, wird es dem Benutzer nicht helfen. Der folgende Code hat bei mir funktioniert!
import * as PIXI from 'pixi.js-legacy'

Ich bin auch mit Chrome auf dieses Problem gestoßen, da meine Einstellung für die Hardwarebeschleunigung deaktiviert war. Ich muss es vor einiger Zeit deaktiviert haben, da es standardmäßig aktiviert sein soll.

Aber ich bin gespannt, warum das Pixi in diesem Fall nicht geladen wird, denn sollte es nicht auf den HTML 5-Canvas zurückgreifen?

@immanuelx2 Das Dokument, von dem Sie einen Screenshot gepostet haben, ist nicht aktuell. Der Canvas-Fallback wurde von v5.0.0 in den Legacy-Zweig verschoben. Siehe die Release-Ankündigung hier: https://medium.com/goodboy-digital/pixijs-v5-lands-5e112d84e510

Verwenden Sie pixi.js-legacy, wenn Sie weiterhin einen Canvas-Fallback benötigen. Der Master-Zweig bietet keine Unterstützung für Canvas mehr, er ist „nur“ WebGL und dafür schneller.

Ich stieß auf dieses Problem, als ich meine Anwendung in einem neuen Tab öffnete, nachdem ich den Fehler erhalten hatte: CONTEXT_LOST_WEBGL

Chrome schließen und dann neu starten hat es für mich gelöst

BEARBEITEN:
Ich habe versucht, gemäß meinen obigen Schritten zu reproduzieren, war aber nicht in der Lage, dies zu tun

Besonderheiten:
Chrom: 77.0.3865.90
OSX: 10.14.6
Grafik: Radeon Pro Vega 20 4 GB, Intel UHD Graphics 630 1536 MB

Ich habe also ein ähnliches Problem wie @winterNebs, aber für mich scheint Chrome in Version > 5.0.0-rc.2 in Ordnung zu sein und Firefox sagt mir, dass Webgl nicht unterstützt wird

Falls jemand anderes dieses Problem hat. Ich musste das Flag " Override software Rendering List " manuell aktivieren ://flags

Besonderheiten:
Chrom: 78.0.3904.97
OSX: 10.13.6

Danke @goodgecko - obwohl die Bibliothek noch repariert werden muss; Es ist nicht sinnvoll oder machbar, Endbenutzer zu bitten, diesen Schritt zur Umgehung des Problems durchzuführen. Auto-Fallback muss zuverlässig sein.

Ich habe genau dieses Problem sowohl unter Linux als auch unter Windows im Brave Browser 1.1.23 basierend auf Chromium 79.0.3945.88
Interessant ist, dass das übliche Chrome, das auf dem gleichen Chromium-Build basiert, einfach perfekt funktioniert.
Firefox 71.0 ist einfach ohne Probleme in Ordnung.

@goodgecko Tipp hat nicht geholfen

Überprüfen Sie den Status der Hardwarebeschleunigung (erweitert) in Ihren Chrome-Einstellungen? Das gleiche Problem trat auf, wenn ich diese Optionen in Chrome schließe.
Wünschte das hilft.

Überprüfen Sie den Status der Hardwarebeschleunigung (erweitert) in Ihren Chrome-Einstellungen? Das gleiche Problem trat auf, wenn ich diese Optionen in Chrome schließe.
Wünschte das hilft.

Das hat bei mir funktioniert. Musste die Hardwarebeschleunigung einschalten

Für mich noch seltsamer. Die https://get.webgl.org/ funktioniert. PIXI v5-Beispiele funktionieren gut, sogar das mit Masken

Aber wenn ich versuche, mein Spiel zu öffnen, wird angezeigt, dass WebGL nicht unterstützt wird.

Falls jemand anderes dieses Problem hat. Ich musste das Flag " Override software Rendering List " manuell aktivieren ://flags

Besonderheiten:
Chrom: 78.0.3904.97
OSX: 10.13.6

Das hat bei mir funktioniert, Danke!

Ich hatte das gleiche Problem auf Chrome stable 80.0.+, Ubuntu 18.04 mit dem Open-Source-X.Org X Server Nouveau-Treiber. Ich habe den WebGL-Test bestanden und festgestellt, dass es der Treiber sein muss. Nach der Installation eines proprietären Treibers (Nvidia) funktioniert jetzt alles einwandfrei.

Zufällige Entdeckung: Es ist nicht die Schuld von Chrome Beta:

Aus irgendeinem Grund war meine Hardwarebeschleunigung deaktiviert.

Hier gilt das gleiche. Ich hatte die Hardwarebeschleunigung deaktiviert. Ich hatte es zuvor deaktiviert, um den Browser in OBS aufzuzeichnen.

Gleiches Problem hier mit Chrome 83 | macos 10.13.6 | nVidia Geforce 210

PixiJS-Beispiele funktionieren gut mit Firefox:
Konsolenausgabe

PixiJS 5.3.0 - WebGL 1 - http://www.pixijs.com/

aber mit Chrome greift man auf Canvas zurück:
Ausgabekonsole

PixiJS 5.3.0 - Canvas - http://www.pixijs.com/

@Fxlr8- Beispiele funktionieren gut, da Chrome auf Canvas zurückgreift. Öffnen Sie die Webkonsole und überprüfen Sie sie.

Bei mir hat es funktioniert!

Können wir diesen Thread sperren? Hier ist nichts mehr beizutragen, es ging um die HW-Beschleunigung.

Wenn Sie immer noch ein Problem haben, ist es ein anderes Problem, also sollten Sie einen neuen Thread eröffnen, anstatt diesen zu vernichten.