如何设置简单的 firebase ajax 请求？答案

【问题标题】：How do I setup simple firebase ajax request?如何设置简单的 firebase ajax 请求？
【发布时间】：2016-07-09 23:38:14
【问题描述】：

我知道我可以使用 set 来访问 Firebase，但我想改用 AJAX，所以我尝试了以下代码。当我在浏览器中加载 test.html 时，控制台显示 -

XMLHttpRequest 无法加载 https://jleiphonebook.firebaseio.com/json。请求的资源上不存在“Access-Control-Allow-Origin”标头。因此，Origin 'null' 不允许访问。响应的 HTTP 状态代码为 405。

//text.html

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Firebase Test</title>
    <script src='https://cdn.firebase.com/js/client/2.2.1/firebase.js'></script>
  </head>
  <body>
    <div id="hi"></div>
    <script   src="https://code.jquery.com/jquery-1.12.2.min.js"   integrity="sha256-lZFHibXzMHo3GGeehn1hudTAP3Sc0uKXBXAzHX1sjtk="   crossorigin="anonymous"></script>
    <script>
      $(document).ready(function () {
        var param = {lastName: "Doe", firstName: "John"};
        $.ajax({
          url: 'https://jleiphonebook.firebaseio.com/json',
          type: "POST",
          data: param,
          success: function () {
            alert("success");
          }
        });
      });
    </script>
  </body>
</html>

//firebase 规则

{
    "rules": {
        ".read": true,
        ".write": true
    }
}

【问题讨论】：

您在json 之前缺少.，所以https://jleiphonebook.firebaseio.com/.json。
鉴于您正在加载 JSON 数据，您可能希望使用 $.getJSON():
@FrankvanPuffelen 我添加了 .它得到了一个糟糕的请求反馈。我正在发出 POST 请求，你能解释一下为什么我应该使用 getJSON 吗？那也没用
啊，我错过了您正在尝试添加数据。在这种情况下，确实不能使用getJSON()。不过，您仍然需要.。有关如何使用 curl 进行 POST 的示例，请参阅 firebase.com/docs/rest/guide/saving-data.html#section-post，您需要在 jQuery 中执行等效操作。

标签： javascript jquery ajax post firebase

【解决方案1】：

Firebase 期望正文是 JSON 字符串，因此您需要对其进行字符串化：

$(document).ready(function () {
   var param = {lastName: "Doe", firstName: "John"};

   $.ajax({
     url: 'https://jleiphonebook.firebaseio.com/.json',
     type: "POST",
     data: JSON.stringify(param),
     success: function () {
       alert("success");
     },
     error: function(error) {
       alert("error: "+error);
     }
   });
 });

顺便说一句，这将实现同样的效果：

$.post('https://jleiphonebook.firebaseio.com/.json',
  JSON.stringify(param),
  function () {
    alert("success");
  }
);

【讨论】：

非常感谢！我在任何文档中都没有看到这一点，你能参考他们在哪里说的吗？我想了解当我得到信息时如何取消字符串化