小白如何給網站加個數據庫

時間 2019-12-07

標籤白如網站數據庫欄目網站開發简体版

原文原文鏈接

需求

我想給個人網站加個留言板html

最終效果

瀏覽效果git

實現

leancloud.cn

在https://leancloud.cn/註冊一下！
登陸後到控制檯，建立應用的服務器
開發版的就好，再填個名字，建立
獲得咱們建立的一個應用點進入如圖所示

js的配置

詳細幫助文檔es6

這裏使用的是js配置請別忘了勾選js
github

因爲是一個我的網站的項目，直接在index.html中引入

<script src="//cdn1.lncld.net/static/js/3.5.0/av-min.js"></script>

初始化
幫助文檔提供了三種形式的屬性規則，分別是es五、es六、服務器
api
爲了保證可以成功存取數據，確保可以ping到服務器

ping uziwpzsm.api.lncld.net

加入測試的代碼

var TestObject = AV.Object.extend('TestObject');  // TestObject 爲對應的圖3的TestObject
var testObject = new TestObject()
testObject.save({
  words: 'Hello World!'   // 存入一個key爲words 指爲Hello World
}).then(function(object) {
  alert('LeanCloud Rocks!')  // 當存入成功 返回
})

總體js代碼服務器

const appId = 'XXXXX';  // 你的appId
const appKey = 'XXX'; // 你的appKey
AV.init({ appId, appKey });

const TestObject = AV.Object.extend('TestObject');  // TestObject 爲對應的圖3的TestObject
const testObject = new TestObject()
testObject.save({
  words: 'Hello World!'   // 存入一個key爲words 指爲Hello World
}).then((object) => {
  alert('LeanCloud Rocks!')  // 當存入成功 返回
})

<body>
<section id="message" class="message" >
      <h2>Message</h2>
      <ul>
      </ul>
      <form>
        <label class="name">
          <input type="text" name="name" placeholder="NAME">
          <i class="iconfont icon-user"></i>
        </label>
        <label class="content">
          <input type="text" name="content" placeholder="MESSAGE">
          <i class="iconfont icon-message"></i>
        </label>
        <input class="send" type="submit" value="SEND >">
      </form>
    </section>
  </div>
  <script src="//cdn1.lncld.net/static/js/3.5.0/av-min.js"></script>
</body>