Evangun

Bonsoir à tous, je pense que 1&1 ne changera pas sa politique d'avoir des CNAME en moins de 30 caractères d'après ce que j'ai lu sur des forums anglais ! Donc j'ai opté pour la solution n°2, et j'ai désormais un CNAME de type xxx.cloudfront.net, qui est suffisamment court. Tout marche parfaitement. Merci Jacques pour l'info, je ne connaissais pas CloudFront, c'est puissant et ça devrait même me faire faire des économies par rapport à S3 seul. Bonne soirée à tous.

Bonsoir Jacques et merci pour ta réponse. Je crois que tu m'as mis sur la piste pour trouver ma réponse. Le bucket a été créé il y a deux jours déjà, je pense que ce n'est pas exactement le problème. Mais la redirection vient effectivement d'Amazon parce que mon CNAME est static.monsite.s3.amazonaws.com alors qu'il faudrait que ce soit : static.monsite.com.s3-external-3.amazonaws.com Mais c'est là que les problèmes commencent ! car cette dernière url est trop longue pour 1&1 qui la refuse comme CNAME. Même a.monsite.com.s3-externalxxxxx est trop long. Et quand on veut faire une redirection d'un sous-domaine par CNAME, c'est Amazon qui oblige à ce que le nom de domaine soit présent dans le nom du bucket (bucketname.monsite.com), donc je ne peux pas m'en sortir en faisant un nom de bucket plus court. Conclusion: si je veux faire sauter cette redirection 307, voici les différentes options : - 1&1 doit accepter des CNAME plus long (je vais leur envoyer un mail) - je trouve un CNAME valide plus court à leur envoyer (je vais voir si CloudFront fournit des url plus courtes, merci pour le tuyau Jacques) - je me trouve un serveur DNS quelque part qui me permettra de faire l'intermédiaire entre 1&1 et S3, mais cela fera une boucle DNS supplémentaire pour les visiteurs Si vous pensez que j'ai loupé quelque chose, n'hésitez pas. Je reviendrai dire si je trouve mon bonheur avec CloudFront. Merci !

Bonjour à tous, je reviens poser des questions associées au CNAME car je ne trouve pas les réponses ailleurs... Ce qui se passe pour l'instant c'est que static.monsite.com est censé être un CNAME d'un "bucket" Amazon S3. Or, quand mon navigateur va chercher une image sur static.monsite.com, il tombe sur une redirection temporaire 307, et ensuite il va chercher l'image à l'url réelle du "bucket". Donc les questions: - est-ce le comportement normal d'un CNAME ? - les headers http renvoyés par static.monsite.com avant la redirection ne mentionnent pas de Cache-control, donc les requêtes sont refaites à chaque fois sur les DNS. Une fois que le navigateur sait qu'il est redirigé vers le fichier du bucket, il voit qu'il a le fichier et le sert à partir du cache. Donc dans l'histoire, il y a une requête à static.monsite.com qui ne sert à rien. Peut-on éviter ça ? - Y a-t-il un impact au niveau du SEO à n'utiliser que des images qui sont sur un CDN, derrière une redirection temporaire 307 ? - Si je choisis de changer les liens des images pour le faire pointer directement vers le CDN, cela a-t-il un impact pour le référencement ? Ci-dessous le relevé de Firebug. Merci beaucoup !

Ah très bien, merci pour ta réponse, cela me rassure Bonne journée !

Bonjour à tous, j'ai fait une redirection de static.monsite.com vers un CDN (Amazon S3) qui héberge mes images etc, pour ne pas que le serveur de mon site (mutualisé) soit surchargé (juste au cas où). Mais une question me vient... est-ce qu'un appel au sous-domaine static.monsite.com est considéré comme un hit par l'hébergeur ? Car après tout cela passe quand même par le serveur DNS de l'hébergeur avant d'être redirigé. Je suis chez 1&1. Merci !

Je vais suivre vos conseils de mettre le CSS en ligne dans les balises. Par contre, étant donné que les propriétés sont changeantes (je veux pouvoir appliquer un "thème" en particulier sur le texte affiché), il y aura un tout petit peu de JS pour choisir tel ou tel jeu de CSS à injecter dans le code. Ce n'est pas plus mal, ça permet de centraliser le CSS au début de mon script dans un tableau javascript. Le résultat sera dispo dans mon webservice dans quelques jours Merci encore pour vos idées.

D'accord, merci pour vos réponses !

La manière propre d'utiliser le CSS, c'est de le mettre dans le header car sinon, une modification d'une propriété entraîne la modification de chaque balise qui la porte... enfin ce n'est pas moi qui vais t'apprendre l'intérêt de séparer le contenu de la mise en forme n'est-ce pas Mais bon, avec une fonction maison getElementsByClassName ça doit être faisable plus ou moins proprement. Je vais considérer cette option, merci.

Merci pour ta réponse Dadou ! Je n'écris que des règles qui sont préfixées qz_ donc il y a peu de chances que j'écrase les règles du site distant, si ? Ca me paraît crade de revenir à l'affichage en ligne au lieu du CSS... ou alors il me faudrait une fonction javascript qui irait le rajouter inline à ma place... tu connais une telle fonction ? Merci !

Bonjour, personne n'a essayé ou réussi à le faire ? J'ai vu une technique qui permet de modifier directement la définition d'une règle CSS (pas juste la redéclarer) en passant par le document.stylesheets mais je ne sais pas encore si ça marche sur un site distant... Je vais essayer et je vous dirai ce que ça donne. Par contre, si c'est le cas, ça laisse présager la nécessité de créer une classe qui parsera du CSS normal pour injecter chaque propriété via une commande javascript... trop galère quoi... Si vous avez d'autres idées n'hésitez pas !! Merci

Bonjour à tous, je suis en train de construire un fichier javascript qui pourra être appelé depuis n'importe quel site distant et qui y écrira un texte et des images. Le souci c'est que le texte en question, je veux le mettre en forme. Je me suis dit que j'allais éviter de faire en sorte que le JS appelle à son tour un fichier CSS, histoire de ne pas provoquer un hit supplémentaire sur mon site. J'ai donc mis le CSS et le JS dans le même fichier, et le JS est chargé de créer une balise style (createElement), de lui faire un innerHTML avec le CSS, et de la mettre dans le <head>. Avec Firefox et Opéra, c'est nickel, mais pour IE et Safari, c'est le drame ! J'imagine qu'ils ne laissent pas le JS accéder directement au feuilles de style... enfin je ne sais pas trop. Savez-vous comment résoudre le problème en gardant 1 seul fichier qui inclut JS et CSS ? Merci beaucoup !

Ha mais ça c'est parce que j'ai simplifié le code, toutes ces choses ont une utilité en réalité

Extraordinaire ! on dirait que tu as trouvé sans forcer en plus, bravo ! Je ne sais pas comment te remercier je vais devoir faire des modifs dans plusieurs de mes pages pour m'adapter à ce que tu as trouvé Je ne sais pas ce que tu trouves bizarre, j'ai essayé de rester simple et logique pourtant ? Si c'est le fait de cloner l'image qui te trouble, en fait je fais ça pour avoir la véritable taille de l'image et non celle qui lui est donnée par CSS (offsetheight me renvoie aussi cette taille CSS). Merci encore!

Bonsoir ! Voilà je n'ai pas eu le temps de la faire aujourd'hui mais ça y est : />http://quizity.com/webhub/test.html Si tu appuies sur le bouton 2 avant que l'image 1 soit en noir et blanc, ça l'empêchera de fonctionner. Merci !

Bonsoir SStephane et merci, ma fonction 1 (--> details) regarde si telle balise img existe déjà dans la page. Si ce n'est pas le cas, elle la crée et appelle la fonction 2 (--> qz_grayscale_test) en la lui passant en argument : var dzidx = 1; function details(creation_id){ logo = document.getElementById("im_"+creation_id); if(!logo){ di = document.getElementById("demoimg_"); di.innerHTML += "<img id=\"im_\"+creation_id+"" src=\"image_"+creation_id+".jpg\"/>"; logo = document.getElementById("im_"+creation_id); qz_grayscale_test(logo); } //put the current logo on top of the others logo.style.zIndex = dzidx; dzidx++; } Remarque: j'ai un peu simplifié les trucs pas importants, j'espère ne pas avoir laissé de petite incohérence La deuxième fonction regarde juste si l'image correspond à une valeur enregistrée dans un cookie et la passe à une troisième fonction si c'est le cas : function qz_grayscale_test(obj){ //see into the cookie if the logo should be black and white gs = obj.src; if(gs){ gs = gs.replace(/.*\\/images\\/([a-z]+)\\/[0-9]+\\/([0-9]+)\\/logo.jpg$/g, "$1:$2"); gs = gs.split(":"); if(gs[0]=="quiz") gs[0]=1; if(gs[0]=="test") gs[0]=2; if(gs[0]=="poll") gs[0]=3; gt = qz_cookie_read("qzci_"+gs[0]); if(gt) { gt = gt.split(":"); for(gti in gt){ //if we find it the cookie values if(gt[gti] === gs[1]){ qz_grayscale(obj); } } } } } la fonction 3 (--> qz_grayscale) crée un double de l'image et passe le relais à la fonction 4 (sous Firefox) qui s'exécutera quand ce double sera chargé (.onload) : //transform a picture into a black & white version (grayscaling) function qz_grayscale(oImg){ if(!oImg.grayscaled){ oImg.grayscaled = true; if(IE){ oImg.style.filter = "progid:DXImageTransform.Microsoft.BasicImage(grayScale=1)"; } else{ oImg.cloneImg = new Image; oImg.cloneImg.onload = function(){ qz_grayscale2(oImg); }; oImg.cloneImg.src = oImg.src; } } } pour finir, la fonction 4 calcule la version noir et blanc du double et doit la mettre dans l'attribut src de l'image d'origine : function qz_grayscale2(oImg){ var canvas = document.createElement("canvas"); var canvasContext = canvas.getContext("2d"); imgW = oImg.cloneImg.width; imgH = oImg.cloneImg.height; canvas.width = imgW; canvas.height = imgH; canvasContext.drawImage(oImg.cloneImg, 0, 0); var imgPixels = canvasContext.getImageData(0, 0, imgW, imgH); for(y = 0; y < imgPixels.height; y++){ for(x = 0; x < imgPixels.width; x++){ i = (y * 4) * imgPixels.width + x * 4; avg = (imgPixels.data[i] + imgPixels.data[i + 1] + imgPixels.data[i + 2]) / 3; imgPixels.data[i] = avg; imgPixels.data[i + 1] = avg; imgPixels.data[i + 2] = avg; } } canvasContext.putImageData(imgPixels, 0, 0, 0, 0, imgPixels.width, imgPixels.height); oImg.src = canvas.toDataURL(); } Mais je répète que ça foire **uniquement** quand les fonctions sont re-appelées avant que le onload qui déclenche la 4ème fonction se déclenche. Le timeout que j'ai évoqué avant m'a permis d'agrandir le délai avant l'éxécution de ce onload et constater que c'était bien ce laps de temps qui pose problème. Dernière chose : dans la 4ème fonction, la preuve qu'il connait l'objet sans pouvoir y accéder directement (uniquement quand les fonctions ont été rappelées) pour lui assigner une nouvelle src, c'est que si je remplace ceci : oImg.src = canvas.toDataURL(); par cela : document.getElementById(oImg.id).src = canvas.toDataURL(); là ça fonctionne bien ! Même un alert(oImg.src) dans la 4è fonction me renvoie toujours la valeur actuelle de src (donc ça marche pour "lire") alors que oImg.src = canvas.toDataURL() juste après ne fonctionne pas (donc ça foire pour "écrire"). Alors soit vous me dites que je n'ai pas tout compris au fonctionnement des objets dans les fonctions, soit vous me dites que c'est une histoire de fous et je vous fais une URL pour tester par vous-mêmes