25

Chrome workspaces: Sagen wir, ich ordnet lokale CSS-Dateien denen zu, die von meinem lokalen http-Server bereitgestellt werden. Alles funktioniert gut und ich kann die Dateien im Browser ändern und bei Änderung der Seite bleiben meine Änderungen erhalten.Chrome-Arbeitsbereiche mit Fingerabdruck-Assets

Wir zufällig Fingerabdruck unserer Vermögenswerte, so dass sie über URLs wie styles.css?longuniquehash verwiesen werden. Große Übung - Auf diese Weise können wir aggressives Caching verwenden und sicherstellen, dass die neuesten Ressourcen vom Client verwendet werden.

Dies ist jedoch ein kleiner Rückschlag für Arbeitsbereiche, da die Zuordnungen verloren gehen, wenn die URL aktualisiert wird. Kurz zusammengefasst: Wir ordnen styles.css?123 der lokalen Ressource zu, wir ändern sie und auf der Seite aktualisieren sie wieder als styles.css?234, die erneut zugeordnet werden muss.

Wir verwenden cassette, aber das Problem kann bei jedem Setup mit Fingerabdruck reproduziert werden. Gibt es eine Einstellung oder einen Workaround, den ich vermisse?

+4

Sie können versuchen, jedoch um mit http://www.html5rocks.com/en/tutorials/developertools/sourcemaps/ spielen, ist es nicht von Kassette unterstützt wird - Das Problem ist immer noch offen. Auch könnte es sich lohnen, in Chrome-Erweiterung api - z. Umschreiben von URLs, bevor sie angefordert werden .. – bushed

+0

@bushed: hmm, guter Punkt, ich habe nicht gedacht, Sourcemaps für CSS in diesem Szenario (weniger/Sass vielleicht) zu verwenden! –

Antwort

-1

Ich nehme an, dass Sie nicht auf Ihrem Live-Server entwickeln (und wenn Sie tun bitte auf Ihrem lokalen Rechner oder zumindest auf einem Testserver zu stoppen und zu entwickeln), so aktivieren Sie den "Cache-Buster" nur in Ihrer Live-Umgebung. Wir haben immer eine schnelle Möglichkeit, die Umgebung zu überprüfen, die wir für alle unsere Projekte verwenden. Überprüfen Sie also, bevor Sie die Anfrage "? 123" anhängen. ich Ihnen nicht, was dies in Code lösen Sie diese auch hinzufügen können Ihre htacces in (wenn Sie Apache verwenden)

SetEnvIf Host 'local.domain.com' runenv=local 

RewriteCond %{ENV:runenv} ^local$ 
RewriteCond %{REQUEST_URI} .*\.css 
RewriteCond %{QUERY_STRING} !^$ 
RewriteRule ^(.*)$ /$1? [R=301,L] 
1

Nach Chromium, die Unterstützung für die Zuordnung von URLs mit Abfrage params (dh style.css?123) wurde nur teilweise bis Chrome 49 - wo es komplett entfernt wurde.

Wenn Sie die Parameter nicht manuell aus Ihrem Code entfernen können, entfernen Sie den Parameter ?123 aus der Stylesheet-Referenz im Chrome-Inspektor, sobald die Seite geladen wurde. Dann sollte Ihre Arbeitsbereich-Zuordnung und automatische Aktualisierung funktionieren, bis Sie die Seite erneut laden.

Sie können dieses Problem Stern und folgen hier: bugs.chromium.org

+0

Danke für den Link, das ist nützlich! Das Ändern der Link-href würde in diesem Szenario nicht funktionieren, da das Ändern der Ressource die Ressource von der neuen URL neu laden würde - und diese URL wird nicht im Cache-Speicher abgelegt. –