使用获取API发布JSON数据失败

时间:2018-07-16 11:06:37

标签: javascript html google-chrome fetch-api

是javascript的新功能,并且正在尝试使用API​​端点进行 POST 数据,但数据未发布,我已经在控制台中进行了打印,但在Google chrome中看到了Slow network is detected. See https://www.chromestatus.com/feature/5636954674692096 for more details. Fallback font will be used while loading: https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/fonts/fontawesome-webfont.woff2?v=4.7.0

但是互联网连接良好且稳定。

这是我用于发布数据的原始javascript:

function onSignUp() {
  signupform
  var email = document.signupform.email_edt.value;
  var driver_rb = document.getElementById("driver_rb").checked;
  var password_edt = document.signupform.password_edt.value;
  var r_password_edt = document.signupform.r_password_edt.value;
  var url = 'https://tuvuge-app.herokuapp.com/api/v1/signup';
  //var data = {username: 'example'};
  var data = {
    username: email,
    email: email,
    password: password_edt,
    isDriver: 'True'
  };

  fetch(url, {
      method: 'POST',
      body: JSON.stringify(data), // data can be `string` or {object}!
      headers: {
        'Content-Type': 'application/json'
      }
    }).then(res => res.json())
    .catch(error => console.error('Error:', error))
    .then(response => console.log('Success:', response));
}

然后我将onSignUp()函数附加到html中的按钮上,如下所示:

<form class="admin-modal-content" name="signupform" onSubmit="onSignUp();" action="index.html" method="post">
  <div class="container">
    <h4>Sign Up</h4>
    <p>Please fill in this form to create an account.</p>
    <hr>
    <label for="email">
      <b>Email</b>
    </label>
    <input type="email" placeholder="you@example.com" id="email_edt" name="email_edt" required>
    <label for="email">
      <b>Select an Option</b>
    </label>
    <p>
      <input type="radio" name="driver_rb" value="driver" id="driver_rb">
      <label>Driver</label>
    </p>
    <p>
      <input type="radio" name="passenger_rb" id="passenger_rb" value="passenger">
      <label>Passenger</label>
    </p>
    <label for="psw">
      <b>Password</b>
    </label>
    <input type="password" placeholder="Enter Password" id="password_edt" name="password_edt" required>
    <label for="psw-repeat">
      <b>Repeat Password</b>
    </label>
    <input type="password" placeholder="Repeat Password" id="r_password_edt" name="psw-r_password_edt" required>
    <div class="clearfix">
      <button type="submit" class="btn">Sign Up</button>
    </div>
</form>

我缺少什么,因为当数据发布成功或失败时,端点都会显示一条消息,但是我看到以上消息。

我想念什么?

0 个答案:

没有答案