Вызов API AMP (ускоренные мобильные страницы) - PullRequest
0 голосов
/ 25 декабря 2018

У меня есть форма с полями имя, номер мобильного телефона, адрес электронной почты и город.при отправке формы я звоню одному api.Мне нужно вызвать один API для проверки, существует ли идентификатор электронной почты и существует ли номер для мобильного телефона.Я не понимаю, как вызвать API при изменении ввода.Какой лучший способ сделать это?Заранее спасибо

1 Ответ

0 голосов
/ 28 декабря 2018

Насколько я понимаю, лучше всего использовать атрибут verify-xhr -> проверить поля на сервере -> сервер отвечает на любые ошибки в формате JSON.https://www.ampproject.org/docs/reference/components/amp-form#verification

<form
  method="post"
  action-xhr="/form/verify-json/post"
  verify-xhr="/form/verify-json/post"
  target="_blank">
    <fieldset>
        <label>
            <span>Email</span>
            <input type="text" name="email" required>
        </label>
        <label>
            <span>Zip Code</span>
            <input type="tel" name="zip" required pattern="[0-9]{5}(-[0-9]{4})?">
        </label>
        <input type="submit" value="Submit">
    </fieldset>
    <div submit-success>
        <template type="amp-mustache">
            <p>Congratulations! You are registered with {{email}}</p>
        </template>
    </div>
    <div submit-error>
        <template type="amp-mustache">
            {{#verifyErrors}}
                <p>{{message}}</p>
            {{/verifyErrors}}
            {{^verifyErrors}}
                <p>Something went wrong. Try again later?</p>
            {{/verifyErrors}}
        </template>
    </div>
</form>

Ответ от сервера может быть таким:

{
  "verifyErrors": [
    {"name": "email", "message": "That email is already taken."},
    {"name": "zip", "message": "The city and zip do not match."}
  ]
}
...