Remarque
L’accès à cette page nécessite une autorisation. Vous pouvez essayer de vous connecter ou de modifier des répertoires.
L’accès à cette page nécessite une autorisation. Vous pouvez essayer de modifier des répertoires.
Une page de ressources web (HTML) ne peut accepter qu’un seul paramètre de requête appelé data. Pour transmettre plusieurs valeurs dans le paramètre de données, vous devez encoder les paramètres et les décoder dans votre page.
L’exemple de ressource web HTML illustre une technique permettant de transmettre les valeurs supplémentaires dans un paramètre unique, puis de les traiter dans votre ressource web.
Note
Seuls les caractères alphanumériques sont pris en charge comme paramètres des ressources Web. Tous les caractères inclus dans la chaîne de requête passent par la validation pour garantir la validité des paramètres passés. Si le processus de validation trouve des paramètres non valides, la requête échoue. Par exemple, la transmission de valeurs de texte entre crochets angulaires est considérée comme un type de paramètre non valide.
Exemple de ressource web HTML
Le code HTML suivant représente une ressource web (HTML) qui inclut un script qui définit quatre fonctions :
displayDataParameters : appelée lorsque le DOM est prêt, cette fonction utilise l’API URLSearchParams pour extraire et analyser le
dataparamètre à partir de la chaîne de requête, puis affiche les résultats.showMessage : crée et affiche des messages d’information à l’utilisateur, tels que des messages d’erreur ou des mises à jour d’état.
createParametersTable : reçoit des paramètres analysés et génère une table HTML à l’aide de littéraux de modèle et de méthodes de tableau modernes pour afficher les paires nom-valeur de paramètre.
escapeHtml : fonction d’assistance de sécurité qui empêche les attaques XSS en échappant de manière sécurisée le contenu HTML dans les valeurs des paramètres avant de les présenter dans la table.
Note
Tous les caractères inclus dans la chaîne de requête sont encodés à l’aide de la fonction encodeURIComponent. Cette fonction utilise JavaScript fonction decodeURIComponent pour décoder les valeurs transmises.
<!DOCTYPE html>
<html lang="en-us">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Show Data Parameters Page</title>
<style>
body {
font-family: 'Segoe UI', Tahoma, Arial, sans-serif;
background-color: #d6e8ff;
margin: 20px;
}
table {
width: 100%;
max-width: 600px;
border-collapse: collapse;
margin-top: 20px;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}
th, td {
padding: 12px;
text-align: left;
border: 1px solid #ddd;
}
th {
background-color: #333;
color: white;
font-weight: 600;
}
tbody tr {
background-color: white;
}
tbody tr:hover {
background-color: #f5f5f5;
}
.message {
font-size: 16px;
margin-bottom: 10px;
}
</style>
</head>
<body>
<script>
// Wait for DOM to be ready
document.addEventListener('DOMContentLoaded', () => {
displayDataParameters();
});
function displayDataParameters() {
// Use URLSearchParams API for modern query string parsing
const urlParams = new URLSearchParams(window.location.search);
const dataParam = urlParams.get('data');
if (!dataParam) {
showMessage("No data parameter was passed to this page");
return;
}
try {
// Parse the data parameter
const decodedData = decodeURIComponent(dataParam);
const params = new URLSearchParams(decodedData);
if (params.size === 0) {
showMessage("No data parameter was passed to this page");
return;
}
showMessage("These are the data parameter values that were passed to this page:");
createParametersTable(params);
} catch (error) {
showMessage("Error parsing data parameter: " + error.message);
}
}
function showMessage(text) {
const message = document.createElement('p');
message.className = 'message';
message.textContent = text;
document.body.appendChild(message);
}
function createParametersTable(params) {
// Create table using template literals for cleaner HTML generation
const tableHTML = `
<table>
<thead>
<tr>
<th>Parameter</th>
<th>Value</th>
</tr>
</thead>
<tbody>
${Array.from(params.entries())
.map(([key, value]) => `
<tr>
<td>${escapeHtml(key)}</td>
<td>${escapeHtml(value)}</td>
</tr>
`).join('')}
</tbody>
</table>
`;
document.body.insertAdjacentHTML('beforeend', tableHTML);
}
// Helper function to prevent XSS by escaping HTML
function escapeHtml(text) {
const div = document.createElement('div');
div.textContent = text;
return div.innerHTML;
}
</script>
</body>
</html>
Utilisation de cette page
Créez une ressource web nommée
new_/ShowDataParams.htmen utilisant le code d'exemple.Les paramètres à transmettre sont :
first=First Value&second=Second Value&third=Third ValueNote
Si vous ajoutez des paramètres statiques à l’aide de la boîte de dialogue Propriétés des ressources web à partir de l’éditeur de formulaire, vous pouvez simplement coller les paramètres sans les encoder dans la colonne Custom Parameter(data). Le portail encode ces valeurs pour vous, mais vous devez toujours les décoder et extraire les valeurs de votre page.
Pour les valeurs dynamiques générées dans le code, utilisez la méthode
encodeURIComponentsur les paramètres. Les valeurs encodées sont les suivantes :first%3DFirst%20Value%26second%3DSecond%20Value%26third%3DThird%20ValueOuvrez la page en transmettant les paramètres encodés en tant que valeur du paramètre de données :
https://<server name>/WebResources/new_/ShowDataParams.htm?data=first%3DFirst%20Value%26second%3DSecond%20Value%26third%3DThird%20ValueNote
Si vous ajoutez la ressource web à un formulaire et collez les paramètres non codés dans la colonne Paramètres personnalisés (données), vous pouvez simplement afficher un aperçu du formulaire.
Le tableau
new_/ShowDataParams.htmaffiche une table générée dynamiquement :Paramètre Valeur Premier Première valeur Deuxième Deuxième valeur Troisième Troisième valeur
Fonctionnement
Pour accéder aux valeurs incorporées dans la valeur du paramètre de chaîne de requête de données, dans votre ressource web web, extrayez la valeur du data paramètre. Utilisez ensuite du code pour analyser la chaîne afin de pouvoir accéder à chaque paire nom-valeur individuellement.
Lorsque le DOM est prêt, la fonction displayDataParameters est appelée à l'aide de l'écouteur d'événement DOMContentLoaded. Cette fonction utilise l’API URLSearchParams pour extraire le data paramètre de la chaîne de requête. Si la fonction trouve un paramètre de données, elle décode la valeur en utilisant decodeURIComponent et l’analyse en tant que paramètres codés par URL. Si aucun paramètre de données n’est trouvé, la showMessage fonction affiche un message informatif.
La createParametersTable fonction génère une table HTML à l’aide de littéraux de modèle et de méthodes de tableau modernes pour afficher les paires nom-valeur de paramètre. La escapeHtml fonction d’assistance empêche les attaques XSS en évitant en toute sécurité tout contenu HTML dans les valeurs de paramètre avant de les rendre dans la table.