Je reçois des URL d'image d'une API qui ressemble à ceci:
http://www.example.com/image.jpg {? largeur, hauteur} < P> Et je veux faire une fonction soignée dans JavaScript pouvant traduire cela en une source d'image utilisable. C'est comme ça que je fais des choses comme ça plus tôt, mais ce n'est pas si très joli (exemple grossière): https://jsfiddle.net/nhxa5t02/ Comment résoudriez-vous cela d'une autre manière?
5 Réponses :
Vous pouvez utiliser Couverts de modèles à construire la chaîne, donc et peut peut-être la mettre à une fonction de réutilisation p > largeur code> et hauteur code> sera interpolée const getImageUrl = (width, height) => {
return `http://www.example.com/image.jpg{?${width},${height}}`
}
Vous pouvez créer une telle fonction utilitaire à l'aide de Couverts de modèle < / a>: et l'utiliser comme ceci:
Merci. Mais alors j'ai besoin d'analyser l'URL pour correspondre à celle que vous utilisez dans votre exemple?
Pourriez-vous s'il vous plaît clarifier votre question? Pourquoi avez-vous besoin d'analyser l'URL assemblée?
Pardon. Mais si vous regardez votre URL, ce n'est pas la même chose que le mien.
Veuillez jeter un oeil à la fin de l'URL est exactement comme la vôtre ici jsfiddle.net/nhxa5t02 : "< I>? Largeur = 1024 & Hauteur = 768 "- La partie de l'URL avec des paramètres semble être la même. Vous utilisez des crochets "{}" autour d'une pièce que vous devez remplacer, dans les littéraux de gabarits Ces supports indiquent un endroit où incorporer une expression.
La 2e approche est qu'il existe des valeurs par défaut si vous ne spécifiez aucun parsedurl (256, 512)
Si vous recevez l'URL comme "http://www.example.com/image.jpg (?widthheight}" code>, supprimez d'abord le {? Largeur, Hauteur} code>, puis ajoutez la hauteur et la largeur à l'aide des littéraux de gabarits. const width = 1024;
const height = 768;
const parsedUrl = `${url.replace(/{.+}/,"")}?width=${width}&height=${height}`
Créer une variable pour la largeur et la hauteur dans l'URL elle-même a du sens. Vous pouvez soit directement remplacer les variables et enregistrer l'URL analysée dans une variable ou créer une méthode pour remplacer ces variables.
p>
const url = "http://www.example.com/image.jpg?width={width}&height={height}";
const width = 1024;
const height = 768;
const parsedUrl = url.replace("{width}", width).replace("{height}", height);
console.log(parsedUrl);
Peut-être que vous aimerez cette expression plus
parsederl = url.replace ('{? largeur, hauteur}', () => `? largeur = $ {largeur}`)Oui en effet. Peut-être que je devrais faire cela avant de faire autre chose. Merci!