L'objet XMLHttpRequest, description et utilisation Description basée sur la spécification du W3C avec un mode d'emploi Cet objet s'utilise en JavaScript pour échanger des données avec le serveur au format texte, XML ou JSON. Les fichiers XML sont automatiquement parsés par l'objet et accessibles par les méthodes du DOM. Les fichiers JSON sont parsés par la commande eval() de JavaScript. Court historique XMLHttpRequest, a été d'abord implémenté dans Internet Explorer depuis la version 4.0. Description XHR est une classe qui est reconnue par tous les navigateurs actuels et par le langage de programmation fonctionnant coté client JavaScript. Attributs Le rôle des attributs de la classe est de se voir assigner l'état de la connexion, et les données reçues. Méthodes Outre le constructeur, la classe a deux méthodes principales, open pour créer la session et désigner le fichier distant, et send pour tranférer les données sur le serveur. Comment utiliser XMLHttpRequest Le problème de mémoire cache L'anté-mémoire fonctionne mal avec l'objet. par: Demos <!
HTML5 Web Workers L'objet XMLHttpRequest De nouvelles applications web ont vu le jour récemment : recherche avec complétion automatique, sauvegarde instantanée d’informations, interface mail hyperdynamique, cartographie, etc. mais aucune ne fait appel à des plugins tiers comme Flash ou Java. On parle alors souvent de méthode AJAX qui s’articule essentiellement autour de Javascript et d’un objet (dans le sens de la programmation orientée objets) en particulier : XMLHttpRequest. Créé par Microsoft pour Internet Explorer, l'objet XMLHttpRequest a été adopté par les navigateurs Mozilla, Konqueror, Safari et récemment Opéra. Bien que largement implémentée dans les navigateurs récents, cette technologie n'est pas un standard du W3C , lequel propose des fonctionnalités similaires à travers la recommandation Document Object Model (DOM) Level 3 Load and Save Specification. Cet objet permet de faire des requêtes HTTP afin de récupérer des données au format XML qui pourront être intégrées à un document. Les avantages possibles : <! <?
Tutoriel Ajax en exemples Asynchronous Javascript + XMLLa création de pages web dynamiques coté client Ajax est seulement un nom donné à un ensemble de techniques préexistantes. Il dépend essentiellement de XMLHttpRequest, un objet coté client utilisable en JavaScript, qui est apparu avec Internet Explorer 4.0. Pourquoi utiliser Ajax? Ajax permet de modifier partiellement la page affichée par le navigateur pour la mettre à jour sans avoir à recharger la page entière. Ajax est une technique qui fait usage des éléments suivants: HTML pour l'interface. Le terme "Asynchronous", asynchrone en français, signifie que l'exécution de JavaScript continue sans attendre la réponse du serveur qui sera traitée quand elle arrivera. Dynamic HTML est aussi un ensemble de techniques, qui comprend: HTML, CSS, JavaScript. Comment cela fonctionne? Pour recueillir des informations sur le serveur l'objet XHR dispose de deux méthodes: open: établit une connexion. L'objet XMLHttpRequest Attributs Méthodes Construire une requête, pas à pas
Un premier projet - Créez des applications pour Windows 8 en HTML et JavaScript Nous avons notre IDE de prêt, il est lancé, notre compte de développeur nous permet de créer et tester une application sur notre machine. Alors allons-y, démarrons notre premier projet ! Nouveau projet Une fois Visual Studio lancé, il présente une page de démarrage classique avec quelques liens d'aide et des ressources d'apprentissage (voir figure suivante). Pour créer notre projet, cliquez sur Nouveau projet… dans la colonne de gauche, sous Démarrer. Nous allons choisir dans la colonne de gauche la catégorie des Modèles, puis le langage qui nous concerne : JavaScript. Cliquez sur OK pour lancer la création de ce nouveau projet. L'interface de Visual Studio 2012 L'explorateur de solutions Dans la partie droite de votre interface se trouve l'Explorateur de solutions, représenté à la figure suivante. L'éditeur de code La figure suivante vous est forcément familière si vous avez déjà développé en HTML/JavaScript. Les propriétés Un peu de code Maintenant, exécutons notre code. L'explorateur DOM
"remote scripting" : appeler du code sans rechargement Les principes du "remote scripting"Au lieu de recharger la page web à chaque intéraction avec le serveur, il est possible d'effectuer des appels de scripts "distants" au sein, par exemple, d'un élément IFRAME. Introduction à la technique du "remote scripting". L'un des principaux défauts du protocole HTTP est la nécessité, en cas d'intéractions complexes (le paiement en ligne, par exemple, ou un processus d'identification) entre le client (le navigateur) et le serveur, de créer une série de pages web séparées, chaque page étant dédiée au traitement d'une requête envoyée au serveur. Dans la suite de cet article, nous allons tirer profit de l'élément IFRAME, partie intégrante des spécifications HTML depuis la version 4 du langage, et correctement implémenté par la plupart des navigateurs récents. La technique est la suivante: nous allons définir un élément IFRAME "invisible", faisant appel à un fichier HTML "fantôme", de la manière suivante: Où intervient le Javascript?
Introduction à AJAX et interaction avec PHP I-A. Remerciements▲ Un grand merci à Denis Cabasson et Guillaume Rossolini pour leurs conseils avisés, leur rapidité et leur patience pendant la relecture. I-B. On parle beaucoup d'AJAX en ce moment dans le buzzword Web 2.0. Ce modèle de fonctionnement est fiable car existant depuis très longtemps mais il pose aussi des problèmes d'interaction homme machine et de performances. D'un point de vue utilisateur, le rafraîchissement de toute la page au moindre clic est synonyme de temps d'attente et de scintillement qui n'est pas toujours du meilleur effet dans une application professionnelle. Du point de vue des performances, à la moindre modification, vous rechargez une page entière avec toutes ses balises HTML, ce qui génère un trafic important. La technologie AJAX n'est pas nouvelle en soi. Les puristes ne vont sûrement pas aimer ce que je vais dire, mais on peut tout à fait faire de l'AJAX au sens large sans forcément faire de l'asynchrone ni du XML. I-C. II-A. L'exemple se trouve ici II-B.
JSON Sqlog - Sqoot + Blog Web 2.0, allez plus loin avec AJAX et XMLHttpRequest Qu'est ce qu'AJAX ? Vous trouverez certainement plusieurs définitions différentes à cet acronyme. En voici une : Asynchronous JavaScript And XML. AJAX n'est donc pas une technologie mais plutôt un concept qui permet donc de faire des appels asynchrones au serveur depuis le client. Lors de ces appels, le serveur retournera du XML qui sera "récupéré" par javascript et traité. Vous saisissez une adresse dans votre navigateur. Donc, quand vous cliquez sur un lien, vous recommencez ce processus en entier avec une nouvelle page. Ajouter des éléments a la page Modifier le contenu d'un "bout de la page" Insérer des données dans une base. Les applications sont donc très nombreuses : Champs qui s'auto-complètent (comme google suggest). Mais comment faire pour l'utiliser ? AJAX se base sur l'utilisation d'un composant embarqué dans presque tous les navigateurs récents. Création de l'objet XmlHttpRequest Sélectionnez Comme vous pouvez le constater, Internet Explorer se démarque des autres. IV-A. <?
Sublime Text 2 pour le dev web : config, trucs et astuces • JS Attitude : formations JavaScript qualitatives et sympathiques Pourquoi cet article ? J'écris cet article parce qu'autant ST peut être extrêmement puissant et confortable, autant son installation par défaut (ST « nu », si vous voulez) n'en laisse pas paraître grand chose… La sidebar est totalement dénuée d'options utiles au clic droit, on n'a pas de transpose, etc. Et même ses fonctions natives puissantes, comme le Go To Anything, la Command Palette ou les Layouts, sont souvent bien peu utilisés, ou sous-employés. L'idée est donc de mettre en place ici une config « musclée », et de vous fournir également des liens vers des ressources externes de qualité sur ST lui-même, au travers notamment de screencasts, qui constituent toujours une des meilleures approches pour découvrir un éditeur, car l'aspect visuel et animé est important ici. À partir de zéro Note importante : si vous avez déjà ST d'installé et de personnalisé, il peut être préférable de sauvegarder vos réglages et paquets. Installation Vous pouvez télécharger ST depuis son site officiel.
Backbone.js Creating MySQL Backups With AutoMySQLBackup On Ubuntu 9.10 Version 1.0 Author: Falko Timme <ft [at] falkotimme [dot] com> Follow me on Twitter Last edited 01/27/2010 AutoMySQLBackup is a shell script that lets you take daily, weekly and monthly backups of your MySQL databases using mysqldump. It can back up multiple databases, compress the backups, back up remote databases, and email the logs. This tutorial explains how to install and use it on an Ubuntu 9.10 server. I do not issue any guarantee that this will work for you! 1 Preliminary Note AutoMySQLBackup uses mysqldump to create SQL dumps of your databases. This script will not help in the event of a hard drive crash. I'm running all the steps in this tutorial with root privileges, so make sure you're logged in as root: sudo su 2 Using AutoMySQLBackup You can install AutoMySQLBackup as follows: aptitude install automysqlbackup Then open /etc/default/automysqlbackup and take a look at the configuration options. vi /etc/default/automysqlbackup Now you can run automysqlbackup: automysqlbackup ... 3 Links
Diagramming for JavaScript and HTML, by Northwoods Software GoJS is a feature-rich JavaScript library for implementing custom interactive diagrams and complex visualizations across modern web browsers and platforms. GoJS makes constructing JavaScript diagrams of complex nodes, links, and groups easy with customizable templates and layouts. GoJS offers many advanced features for user interactivity such as drag-and-drop, copy-and-paste, in-place text editing, tooltips, context menus, automatic layouts, templates, data binding and models, transactional state and undo management, palettes, overviews, event handlers, commands, and an extensible tool system for custom operations. GoJS is pure JavaScript, so users get interactivity without requiring round-trips to servers and without plugins. Build custom modeling environments and domain-specific visual languages using the powerful features of GoJS. Yet GoJS is remarkably simple for such a powerful and flexible system. Explore Run Interactive Samples Learn Learn with GoJS Tutorials