Google Apps Script WebApp表单提交Chrome失效，Firefox正常

问题根源 #

Chrome严格执行Google Apps Script的内容安全策略（CSP），禁止内联事件处理属性（如onsubmit='handleSubmit(this)'），而Firefox的CSP执行规则相对宽松，这就是导致跨浏览器兼容性问题的核心原因。

修复方案 #

移除内联onsubmit属性，改用事件监听的方式绑定表单提交事件，同时阻止默认表单提交行为避免页面刷新，确保脚本执行完成。

修改后的核心代码（JavaScript.html） #

重点调整afficherFormulaireSectionElectrique函数，同时优化handleSubmit逻辑：

function afficherFormulaireSectionElectrique(){
    var postes = ["Poste 1", "Poste 2", "Poste 3", "Poste 4", "Poste 5"];
    let html = "<h1>Section Electrique</h1>";
    html += "<br> <br>";

    // 移除内联onsubmit属性
    html += "<form>";

    html += "<label for='intervenant'>Intervenant</label>";
    html += "<input type='text' name='intervenant' id='intervenant'>";
    html += "<br> <br>";
    html += "<label for='poste'>Poste</label>";
    html += "<select name='poste' id='poste'>";
    for (var i = 0; i < postes.length; i++) {
        html += "<option value='" + postes[i] + "'>" + postes[i] + "</option>";
    }
    html += "</select>";
    html += "<br> <br>";
    html += "<label for='commentaire'>Commentaire</label>";
    html += "<textarea name='commentaire' id='commentaire'></textarea>";
    html += "<br> <br>";
    html += "<br> <br>";
    html += "<input type='submit' value='Envoyer'>";
    html += "</form>";
    
    const formulaireContainer = document.getElementById("formulaire");
    formulaireContainer.innerHTML = html;
    
    // 为动态创建的表单绑定submit事件
    const form = formulaireContainer.querySelector('form');
    form.addEventListener('submit', function(e) {
        e.preventDefault(); // 阻止默认表单提交，避免页面刷新
        handleSubmit(this);
    });
}

function handleSubmit(formulaire){
    console.log(formulaire);
    // 添加成功/失败回调，提升用户反馈
    google.script.run
        .withSuccessHandler(() => {
            alert("Formulaire envoyé avec succès !");
            formulaire.reset();
        })
        .withFailureHandler(error => {
            alert(`Erreur lors de l'envoi : ${error.message}`);
        })
        .processForm(formulaire);
}

额外优化点 #

• 给html变量添加let声明，避免污染全局作用域
• 为google.script.run添加成功/失败回调，提供更友好的用户反馈
• 提交成功后重置表单，方便重复提交

内容的提问来源于stack exchange，提问作者BigBenne