как опубликовать данные формы и загрузить файл с помощью API извлечения JS - PullRequest
0 голосов
/ 10 апреля 2020

Я пытаюсь опубликовать данные формы, используя JS API выборки, также я успешно отправляю данные и получаю ответ, но получил ошибку в загруженном файле, мой файл не загружен, а также не получил сохраненное имя файла в базу данных.

<form id="signup">
    <label for="myName">Send me your name:</label>
    <input type="text" id="myName" name="name" value="abc">
    <br>
    <label for="userId">your id:</label>
    <input type="text" id="userId" name="id" value="123">
    <br>
    <label for="pic">your photo:</label>
    <input id="profile" name="profile" id="profile" type="file">
    <br>
    <input id="postSubmit" type="submit" value="Send Me!">
</form>

А javascript код

const thisForm = document.getElementById('signup');
    const profile = document.getElementById('profile');
    thisForm.addEventListener('submit', async function (e) {
    e.preventDefault();
    const formData = new FormData(thisForm).entries()
    formdata.append("profile",profile.files[0]);
        const response = await fetch('<?php echo base_url() . 'api/get_subscription' ?>', {
            method: 'POST',
            headers: { 'Content-Type': 'multipart/form-data' },
            body: JSON.stringify(Object.fromEntries(formData))
        });

        const result = await response.json();
        console.log(result);

Ответы [ 2 ]

0 голосов
/ 10 апреля 2020

Нет необходимости преобразовывать в JSON и не нужно использовать entries() в FormData. Также проверьте орфографию, которую вы написали formdata, которая отличается от formData.

const thisForm = document.getElementById('signup');
var formData = new FormData(thisForm);
const profile = document.getElementById('profile');
formData.append("profile", profile.files[0]);
const response = await fetch('<?php echo base_url() . 'api/get_subscription' ?>', {
  method: 'POST',
  headers: { 'Content-Type': 'multipart/form-data' },
  body: formData
});
0 голосов
/ 10 апреля 2020

Для загрузки файла необходим тип контента multipart/form-data. Или просто не указывайте Content-type, потому что ваш браузер, вероятно, автоматически установит это.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...