iron-request не делает более одного запроса

Я работаю с библиотекой Polymer 2. Всякий раз, когда я пытаюсь сделать несколько запросов, используя iron-request, кажется, что код делает запрос POST только при первом запуске. Любые последующие запросы, похоже, игнорируются, даже если данные, настроенные для отправки на сервер, отличаются от исходного запроса.

Я написал небольшой пример в этом плункере: ?p=предварительный просмотр

Я создал железный запрос и элемент кнопки, чтобы инициировать запрос следующим образом:

<paper-button on-click="save" class="green">Send</paper-button>
...
<iron-request id="xhr"></iron-request>

Функция сохранения настроена на получение текста из текстовой области и отправку его на сервер.

save() {
    var response = this.$.xhr.send({
      url: "https://httpbin.org/post",
      headers: {
        'content-type': 'application/x-www-form-urlencoded'
      },
      body: {
        content: this.inputdata
      },
      method: "POST"
    });
    var poly = this;
    this.$.xhr.completes.then(function(data) {
      console.log("finished");
      poly.$.responsetext.innerHTML = data.response;
    })

Рассматриваемый код находится в файле element1.html. Если вы попытаетесь отправить разные текстовые полезные данные, будет отправлен только первый запрос. (Вы можете видеть в поле ответа, что поле «контент» формы остается прежним.)

Есть идеи, что происходит? Я думаю, что мне придется создавать новые элементы iron-request каждый раз, когда мне нужно сделать новый запрос... но это не похоже на очень элегантное решение.


javascript ajax polymer polymer-2.x
person chaseme    schedule 29.06.2017    source источник

Ответы (1)


arrow_upward
2
arrow_downward

Как вы подозревали, iron-request был создан для отправки одного HTTP-запроса. Я быстро взглянул на его реализацию. Метод send на самом деле просто вернет null и ничего не сделает, если статус запроса больше 0, что будет иметь место, если вы использовали его раньше.

Хотя вы можете создать новый элемент iron-request для каждого запроса, это не элегантно (как вы сами сказали). Вместо этого вы можете работать с iron-ajax. Некоторые инструкции можно найти на его странице документации.

Ваше <iron-request> можно переписать так.

<iron-ajax id="xhr" url="https://httpbin.org/post" content-type="application/x-www-form-urlencoded" method="POST" body="[[inputdata]]" on-response="onXhrSuccess"></iron-ajax>

Ваша функция сохранения,

save() {
    this.$.xhr.generateRequest();
}

onXhrSuccess(event, request) {
    console.log("finished");
    poly.$.responsetext.innerHTML = event.detail.response;
}
person Maria    schedule 30.06.2017
comment
Спасибо. <iron-ajax>, похоже, делает несколько запросов... Но у меня возникли проблемы с реализацией этих изменений в предоставленной мной ссылке на плункер. Может ли кто-нибудь из вас привести полностью рабочий пример? Вот что у меня есть на данный момент: plnkr.co/edit/nCZg3wch99WOtr8OdbLY?p=preview Текстовое поле не обновляет отправляемые данные. Может проблема с привязкой данных? - person chaseme; 06.07.2017
comment
@chaseme Это вызвано другой проблемой с привязкой данных к текстовым областям. Решение можно найти здесь. А вот и обновленный плункер. - person Maria; 06.07.2017
comment
Идеальный. Это работает. Раньше я видел это решение относительно текстовой области, однако я не знал, что оно применимо и к Polymer 2.x. - person chaseme; 06.07.2017