小白如何给网站加个数据库

时间 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>

后语

固然你也能够把TextObject 改为你本身的命名好比Message
你须要早你的应用里面建立新的class
此方法适用于小型业务或者我的业务，好比个人留言板。不要用在大型业务，或者你也能够考虑交钱