web-dev-qa-db-fra.com

Comment recharger / rafraîchir une page Web sans quitter mon IDE de développement Web?

Création de sites Web

Lorsque je crée des sites Web, j'utilise 2 moniteurs. J'ai mon développement IDE sur le moniteur principal et la page Web ouverte sur l'écran secondaire.

Je m'énerve à chaque fois que je dois rafraîchir la page Web, je dois aller sur ma souris, passer à l'autre écran et cliquer sur Rafraîchir.

J'aimerais avoir une touche de raccourci mappée pour recharger la page Web chaque fois que j'en ai besoin. D'une manière similaire à la façon dont Winamp mappe les touches aux fonctions courantes telles que lecture/pause, etc.

Mes recherches actuelles:

Firefox via la ligne de commande

J'ai découvert qu'un processus FireFox existant peut être contrôlé à partir de la ligne de commande, mais le mieux qu'il puisse faire est de créer une nouvelle fenêtre avec une URL spécifique.

firefox -remote "openURL(www.mozilla.org, new-tab)"

La documentation est ici: https://developer.mozilla.org/en/Command_Line_Options

Recharger chaque

Il existe également une extension firefox qui actualisera périodiquement la page Web. Cependant, cela se traduit par un scintillement constant de la page et sera également un gaspillage de ressources.

https://addons.mozilla.org/en-US/firefox/addon/115/

Cependant, ce dont j'ai vraiment besoin, c'est soit ...

  • Un raccourci clavier global personnalisable pour Firefox/Chrome pour recharger l'onglet actuellement sélectionné
  • Une extension de navigateur pouvant être déclenchée à partir d'un raccourci clavier global
  • Une commande pour recharger l'onglet actuellement sélectionné à partir de la ligne de commande que je pourrais ensuite mapper à un raccourci clavier (est-il possible d'ajouter une commande à distance supplémentaire avec une extension?)

Quelqu'un sait-il comment je pourrais faire cela? Merci!

28
Jon Winstanley

Dans Windows XP, cela devrait fonctionner:

  • Créez un fichier VBS appelé refresh.vbs:

    Set WshShell = WScript.CreateObject("WScript.Shell") 
    WshShell.AppActivate("Firefox")
    WshShell.SendKeys "{F5}"
    WshShell.AppActivate("TextPad")
    
  • Créez un raccourci vers ce fichier sur votre bureau.

  • Cliquez avec le bouton droit sur l'icône de raccourci et accédez à Properties.

    • Dans l'onglet General, cliquez sur le bouton Modifier à côté de "Ouvre avec". Accédez à C:\WINDOWS\system32\cscript.exe Sélectionnez Hôte de script basé sur la console Microsoft.

    • Dans l'onglet Shortcut, entrez une touche de raccourci, par exemple CTRL + ALT + R. Dans la liste déroulante Exécuter, sélectionnez Minimised.

Maintenant, lorsque vous appuyez sur CTRL + ALT + R, il actualisera l'onglet actuel dans Firefox.

19
dogbane

J'ai créé un simple applescript que j'ai configuré en tant que raccourci clavier global en utilisant Alfred .

Voici l'applescript

tell application "Firefox"
    activate
    tell application "System Events"
        tell process "Firefox"
            keystroke "r" using {command down, shift down}
        end tell
    end tell
end tell

Si vous voulez vous assurer que le focus reste dans votre éditeur, vous pouvez ajouter ces lignes. N'oubliez pas de remplacer Coda (mon éditeur de choix) par tout ce que vous utilisez

tell application "Coda"
    activate
end tell
12
snowmonkey.no

Voici ma doublure bash préférée:

while /bin/true ; do inotifywait --recursive --event modify ./ ; echo "reload" | nc -c localhost 32000 ; done

Il utilise Firefox Remote Control AddOn , qu'il notifie des changements dans et en dessous des fichiers de répertoires actuels. Donc, tout ce dont vous avez besoin est d'enregistrer n'importe quel fichier dans le projet et au même moment où l'onglet Firefox actuel est rechargé. Celui-ci est unix-ish, devrait fonctionner sur Linux + Mac si vous avez inotify, ne fonctionnera pas sur Windows sans adaptations.

11
Ludwig

Il existe un outil pour Windows appelé Autohotkey qui vous permet d'automatiser presque tout en envoyant des codes clés et des clics de souris. Vous pouvez écrire un script qui localise la fenêtre de votre navigateur et envoyer le code clé pour F5. Attribuez ce script à un raccourci clavier global et vous avez terminé.

Pour revenir à votre fenêtre précédente, votre script devrait se souvenir de la fenêtre actuellement sélectionnée, actualiser le navigateur et remettre le focus sur la fenêtre mémorisée.

6
speedball2001

Il existe bien sûr des raccourcis clavier, surtout si le IDE et le navigateur sont les seuls programmes entre lesquels vous basculez.

alt+tab f5 alt+tab

Bascule vers votre navigateur, le recharge et revient. Beaucoup plus rapide que la souris, et vous n'avez pas à vous soucier des raccourcis clavier globaux ou des logiciels supplémentaires à installer.

5
Josh Smeaton

Il existe une bien meilleure solution à cela, mais au prix d'une complexité considérablement accrue.

Selenium (seleniumhq.org) peut faire ce que vous demandez. Il s'agit d'un framework de test de navigateur Open Source qui, entre autres, vous permet de contrôler une fenêtre de navigateur à distance.

Si le sélénium sonne comme quelque chose que vous voudriez entrer dans votre cerveau de toute façon, vous pourriez aussi bien l'apprendre; sinon, je m'en tiendrai aux scripts WSH et à Autohotkey.

4
Undoware

Cela ne répond pas vraiment à votre question mais peut-être vous facilite un peu la vie;)

Je viens de trouver Stylebot . Bien qu'il n'ait pas de complétion automatique, il peut vous aider avec le CSS.

Voici une capture d'écran. La barre latérale est Stylebot. Vous avez un mode d'édition basique où vous pouvez éditer rapidement quelques propriétés simples, un mode avancé où vous pouvez éditer le CSS ordinaire pour l'élément sélectionné et avec "Editer CSS" vous pouvez éditer tout le CSS pour la page.

enter image description here

4
dAnjou

J'utilise le clavier ergonomique MS qui a une fonction de macro-clé. J'ai programmé la solution Joshs dedans et elle fonctionne bien, il suffit de s'assurer que le navigateur est la prochaine application lors du switsching avec alt-tab. Il existe un outil génial nommé XRefresh qui est à peu près tous les rêves des développeurs - ne fonctionne pas avec Firefox 4 cependant.

Edit: Mais il y a un addon "Auto Reload" qui fait exactement ce dont nous avons besoin: vous spécifiez un ou plusieurs dossiers (ou fichiers) et firefox s'actualise chaque fois qu'un des fichiers à l'intérieur change.

Edit (2013): PHPStorm a une fonction de rafraîchissement automatique pour Google-Chrome. C'est génial: vous voyez le changement de page Web lorsque vous tapez (!) Dans l'EDI. Ils ont une édition communautaire gratuite pour les développeurs de logiciels OpenSource.

4
Johanness

La solution VBScript ne fonctionne pas avec Google Chrome dans Windows 7. Voici une solution qui fonctionne incroyablement bien avec n'importe quel navigateur (ajustez simplement la chaîne ititle) et Eclipse = IDE en utilisant un petit utilitaire de NirSoft ( http://www.nirsoft.net/ ).

  • Téléchargez NirCmd et extrayez 'nircmd.exe' quelque part dans votre projet (c'est KISS de cette façon).
  • Créez le fichier de commandes 'nircmd-chrome-focus + f5.bat' suivant quelque part dans votre projet:

    ECHO Off 
     REM Ce petit fichier batch appelle le super utilitaire nircmd pour se concentrer Chrome envoie un F5 et swtich 
     REM à Eclipse. Ce n'est plus possible avec VBScript dans WIN7 comme Chrome ne peut être focalisé que mais ne sera pas 
     REM accepter les envois de clés à moins qu'un clic ne soit fait. Faites un don sérieux au NirSoft pour avoir créé cet outil. 
     
    % ~ dp0nircmd.exe win activer ititle "- Google Chrome" 
    % ~ dp0nircmd.exe win max ititle "- Google Chrome" 
    % ~ dp0nircmd.exe sendkey f5 appuyez sur 
    % ~ dp0nircmd.exe gagner activer ititle "- Eclipse" 
    % ~ dp0nircmd.exe gagner max ititle "- Eclipse" 
     
    
  • Ajoutez le fichier de commandes en tant que générateur de projet "Projet> Propriétés> Générateur> Nouveau" et assurez-vous que "Projet> Générer automatiquement" et "Options de génération"> "Pendant les générations automatiques" est sélectionné. Voir la capture d'écran ci-dessous pour une idée.

2
Daniel Sokolowski

Sous Windows: appuyez simplement sur Alt + F5 et faites-le. Cette solution fonctionne avec plus d'un navigateur simultanément et probablement avec n'importe quel éditeur/IDE. Il a été testé avec (jEdit, Eclipse, Notepad ++)

Pour ce faire, installez AutoHotKey et exécutez le script ci-dessous (copiez-le dans un fichier texte et changez l'extension en .ahk). Il existe une version portable ici . Il a été testé avec la version AutoHotKey 1.0.48.05

Cette solution est assez flexible car vous pouvez changer les clés, les éditeurs, les navigateurs et tout le reste. Il est préconfiguré pour Firefox et IE navigateurs et jEdit, éditeurs Eclipse, mais vous pouvez facilement personnaliser cette liste.

VarTextEditor et varBrowsers ont été découverts à l'aide de l'utilitaire "WindowSpy" fourni avec AutoHotKey.

; ############################################ ################################### 
; Enregistrez tous les documents non enregistrés, actualisez tous les navigateurs ouverts et revenez à l'éditeur de texte 
; ############################## ################################################## 
! F5 :: 
; Vars de configuration. Modifiez ici les paramètres de ce script 
; jEdit Eclipse 
 varTextEditor = SunAwtFrame, SWT_Window0 
; varBrowsers = MozillaUIWindowClass, MozillaWindowClass, Chrome_WidgetWin_0, IEFrame, OpWindow, {1C03B488-D53B-4195-96195-96195 Firefox3 Firefox4 Chrome IEca Opera Safari 
 VarBrowsers = MozillaWindowClass, IEFrame 
; Fin des vars de configuration. 
 
 WinGetClass, thisWindowClass, A; Récupère la classe de fenêtre active 
 
 If (InStr (varTextEditor, thisWindowClass, true, 1)> 0) {; true = sensible à la casse 
 varTextEditorClass = ahk_class% thisWindowClass% 
 if (thisWindowClass = "SunAwtFrame") {
 OutputDebug, ... Tout sauvegarder 
; SetKeyDelay, 100, 100, Play 
 Envoyer ^ + s; Ctrl + Maj + S = Enregistrer tout 
} Sinon si (thisWindowClass = "SWT_Window0") {
 SendPlay ^ s; Ctrl + S = Enregistrer 
 } 
 Sleep, 500; Donnez un peu de temps aux données pour être enregistrées sur le disque dur 
} Else {
 MsgBox, 0, Ops !, Vous devez être sur ces éditeurs de texte: (% varTextEditor%) pour exécuter ce script, 5 
 return 
} 
 
; Actualise tous les navigateurs ouverts (et agrandis) 
 Boucle, analyse, varBrowsers, `, 
 {
 varClasseBrowser = ahk_class% A_LoopField% 
 si WinExist (varClasseBrowser) {
 WinGet, winState, MinMax,% varClasseBrowser%; obtenir l'état de la fenêtre. -1 = minimisé 
 Si (winState! = -1) {
 WinActivate,% varClasseBrowser% 
 OutputDebug, ... Actualiser le navigateur% A_LoopField% 
 Envoyer, {F5} 
} 
} 
} 
; Retour à l'éditeur de texte 
 WinActivate,% varTextEditorClass% 
 Retourne 
 
2
margenn

Merci dogbane et tous pour le partage.

Travailler avec Windows 7, vous pouvez actualiser votre navigateur

Créer un fichier .bat et exécuter

% windir%\SysWOW64\wscript.exe refresh.vbs

et exécutez .bat avec "Exécuter en tant qu'administrateur"

Impossible d'utiliser CreateObject à partir de VB sous Windows 7 x64

:)

2
Mean

http://www.livereload.com/

LiveReload surveille les modifications du système de fichiers. Dès que vous enregistrez un fichier, il est prétraité au besoin et le navigateur est actualisé.

Encore plus cool, lorsque vous modifiez un fichier CSS ou une image, le navigateur est mis à jour instantanément sans recharger la page.

0
datashaman

Il y a une autre solution à cela.

Installez le plugin FF-Remote-Control dans FireFox qui vous permettra d'envoyer des commandes au plugin depuis une autre machine via le réseau. Les instructions pour l'intégrer avec VIM sont dans la documentation qui peut également être utilisée comme modèle pour l'intégration avec d'autres éditeurs. Fonctionne uniquement avec FF cependant.

0
Hari Mahadevan