使用MAMP

问题描述

我正在遵循一个教程,并尝试使用MAMP以表单的形式发送信息,因为我需要模拟客户端-服务器的行为,并且它不起作用。我已经从教程中复制了代码,因此代码中应该没有错误,但是仍然无法正常工作。

会发生什么:您在代码中键入的联系信息应发送到服务器。

实际发生的情况:信息被添加到URL。另外,即使我使用了preventDefault页面也会刷新。

这是代码
js:

   const forms = document.querySelectorAll('form');
        const message = {
            loading: 'img/form/spinner.svg',success: 'Спасибо! Скоро мы с вами свяжемся',failure: 'Что-то пошло не так...'
        };
    
        forms.forEach(item => {
            postData(item);
        });
    
        function postData(form) {
            form.addEventListener('submit',function (event){
                event.preventDefault();
                event.stopPropagation();
    
                let statusMessage = document.createElement('img');
                statusMessage.src = message.loading;
                statusMessage.style.csstext = `
                    display: block;
                    margin: 0 auto;
                `;
                form.insertAdjacentElement('afterend',statusMessage);
            
                const formData = new FormData(form);
    
                const object = {};
                formData.forEach(function(value,key){
                    object[key] = value;
                });
    
                fetch('server.PHP',{
                    method: 'POST',headers: {
                        'Content-Type': 'application/json'
                    },body: JSON.stringify(object)
                }).then(data => {
                    console.log(data);
                    showThanksModal(message.success);
                    statusMessage.remove();
                }).catch(() => {
                    showThanksModal(message.failure);
                }).finally(() => {
                    form.reset();
                });
            });
        }
    
        function showThanksModal(message) {
            const prevModalDialog = document.querySelector('.modal__dialog');
    
            prevModalDialog.classList.add('hide');
            openModal();
    
            const thanksModal = document.createElement('div');
            thanksModal.classList.add('modal__dialog');
            thanksModal.innerHTML = `
                <div class="modal__content">
                    <div class="modal__close" data-close>×</div>
                    <div class="modal__title">${message}</div>
                </div>
            `;
            document.querySelector('.modal').append(thanksModal);
            setTimeout(() => {
                thanksModal.remove();
                prevModalDialog.classList.add('show');
                prevModalDialog.classList.remove('hide');
                closeModal();
            },4000);
        }

PHP

<?PHP
$_POST = json_decode( file_get_contents("PHP://input"),true );
echo var_dump($_POST);

有人可以告诉我问题出在哪里吗?

解决方法

暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!

如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@)

相关问答

Selenium Web驱动程序和Java。元素在(x,y)点处不可单击。其...
Python-如何使用点“。” 访问字典成员?
Java 字符串是不可变的。到底是什么意思?
Java中的“ final”关键字如何工作?(我仍然可以修改对象。...
“loop:”在Java代码中。这是什么,为什么要编译?
java.lang.ClassNotFoundException:sun.jdbc.odbc.JdbcOdbc...