微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦！

MongDB&&Ajax

分类：Ajax作者：编程之家原文地址AI导航网

MongDB

快速开发互联网Web项目
先进行环境变量配置
net start mongodb //启动系统的服务
mongod //启动服务器

命令

在这里插入图片描述

show databases 或 show dbs          //展示所有数据库
db                            //表示自己所在的库
use    +    库名称                  //使用哪个库
show    collections              //显示数据库中所有的集合

crud

db.集合.insert(文档)
db.集合.find()，可以传一个对象，比如｛_id：01｝ 返回的是数组
db.集合.findOne（） 返回的是对象

在这里插入图片描述

update

默认会用新对象替换旧对象

在这里插入图片描述

db.stus.update({age:11},{$set:{address:“海边”}}); //增加一个新的属性
如果属性相同会对属性修改

在这里插入图片描述

消除address属性

在这里插入图片描述


update默认改第一个，红线是筛选条件

db.stus.updateMany（） 这个可以一次性改多个

db.stus.deleteOne({_id:"oneOnly"})

删除一个

db.stus.deleteMany({_id:"oneOnly"})

删除多个

db.集合.remove({}，true) 可以一个也可以多个      //写true的话就只删除一个，不写默认删多个

显示集合 show collections
删除集合 db.stus.drop()
删除所在的库 db.dropDatabase()

在这里插入图片描述

db.stus.update(
    {name:"arrays"},
    {$push:
            {arr:"m" }
    }
    )

在这里插入图片描述


在这里插入图片描述


有元素为hero的就可以

$push：向数组中添加一个新的元素，可以重复，但

$addToset

不能重复，重复则添加失败，类似java中的set

db.stus.find({name:{$gt:500}})
寻找大于500的，如果gte则寻找大于等于500的

在这里插入图片描述

分页

db.stus.find().limit（数字）
db.stus.find().skip(10).limit(10)
skip跳过的行数，limit显示的行数

在这里插入图片描述


or表示或

在这里插入图片描述


逗号代表和

在这里插入图片描述

原有基础变动，可以填负数

在这里插入图片描述


1表示升序，-1降序

Mongoose

cnpm i mongoose --save
安装mongoose

var mongoose=require("mongoose");
mongoose.connect("mongodb://localhost/mytext",{useNewUrlParser: true});
mongoose.disconnect();  断开连接
mongoose.connection.once("open",function () {
     console.log("sucess");
});
mongoose.connection.once("close",function () {
   console.log("close");
});

两个监听函数，disconnect断开

在这里插入图片描述


在这里插入图片描述


在这里插入图片描述


collection的名字会变复数，stu变stus

在这里插入图片描述


在这里插入图片描述

findOne和find用法一样，不过返回不是数组是对象
doc是Model的实例

在这里插入图片描述


在这里插入图片描述

封装

var mongoose=require("mongoose");
mongoose.connect("mongodb://localhost/practise");
mongoose.connection.once("open",function () {
    console.log("sucess");
});
mongoose.connection.once("close",function () {
    console.log("close");
});

var mongoose = require("mongoose");
var schema = mongoose.Schema;
var stuSchema = new schema({
    name:String,
    age:Number,
    gender: {
        type:String,
        default:"female"
    }
});
var documentModel = mongoose.model("student",stuSchema);
model.exports=documentModel;

require("./connectionMongo");
var Student=require("./students");

Ajax

在这里插入图片描述


爬虫爬不到
客户端发送浏览器请求叫请求报文
请求方式，url，http协议版本

在这里插入图片描述


在这里插入图片描述

express框架

npm i express
1.const定义的变量不可以修改，而且必须初始化。
2.var定义的变量可以修改，如果不初始化会输出undefined，不会报错。
3.let是块级作用域，函数内部使用let定义后，对函数外部无影响。

var express = require("express");
var app=express();
app.get("/first",function (request,response) { 
    response.setHeader("Access-Control-Allow-Origin","*"); // 设置允许跨域
    response.send("hello");
});
app.listen(8000,function () {
        console.log("服务监听")
})

localhost:8000可以看到发送的信息

在这里插入图片描述

window.onload=function () {
    var bAjax = document.getElementById("b-ajax");
    var ajaxReturn = document.getElementById("return-Me");
    bAjax.onclick=function () {
           var xhr = new XMLHttpRequest();
           xhr.open("post","http://localhost:8000/first");
           xhr.send();
           xhr.onreadystatechange=function () {
                    if (xhr.readyState==4){
                        if (xhr.status>=200&&xhr.status<300){
                            ajaxReturn.innerHTML=xhr.response;
                        }
                    }
           }
    }
}

Post请求

var express = require("express");
var app=express();
app.post("/first",function (request,response) {
    response.setHeader("Access-Control-Allow-Origin","*"); // 设置允许跨域
    response.send("hello");
});
app.listen(8000,function () {
        console.log("服务监听")
})

window.onload=function () {
    var bAjax = document.getElementById("b-ajax");
    var ajaxReturn = document.getElementById("return-Me");
    bAjax.onclick=function () {
           var xhr = new XMLHttpRequest();
           xhr.open("post","http://localhost:8000/first");
           xhr.send();
           xhr.onreadystatechange=function () {
                    if (xhr.readyState==4){
                        if (xhr.status>=200&&xhr.status<300){
                            ajaxReturn.innerHTML=xhr.response;
                        }
                    }
           }
    }
}

post和get区别

get 在url后用？string&拼接的方式传，post在send()中传
设置头信息

在这里插入图片描述


自定义请求头要加
express中

在这里插入图片描述


将post改为all

服务端响应JSON数据

在这里插入图片描述


var jObj = JSON.stringify(obj);
response.send(jObj);
可以传Json数据

在这里插入图片描述

服务器自动更新

cnpm install -g nodemon
cls清屏

terminal控制台`   nodemon express.js
Ie浏览器对ajax会有缓存

在这里插入图片描述


express 延时响应

在这里插入图片描述


请求超时的操作

在这里插入图片描述

xhr.οnerrοr=function(){
alert(“断网了”)
}
上面是自动取消

xhr的abort可以取消请求，一般写在事件的回调函数中
为了防止多次相同的请求

var express = require("express");
var app=express();
app.post("/first",function (request,response) {
    response.setHeader("Access-Control-Allow-Origin","*"); // 设置允许跨域
    var obj={name:"你好ma ",age:11};
    var jObj = JSON.stringify(obj);
    setTimeout(function () {
        response.send(jObj);
    },1000)

});
app.listen(8000,function () {
        console.log("服务监听")
})

window.onload=function () {
    var bAjax = document.getElementById("b-ajax");
    var ajaxReturn = document.getElementById("return-Me");
    var xhr;var isSend=false;
    bAjax.onclick=function () {
        if (isSend){
            xhr.abort();
        }
          xhr = new XMLHttpRequest();
        isSend=true;
           xhr.open("post","http://localhost:8000/first?t="+Date.Now());
           xhr.send();
           xhr.onreadystatechange=function () {
                    if (xhr.readyState==4){
                        isSend=false;
                        if (xhr.status>=200&&xhr.status<300){
                           var jObj=xhr.response;
                       var obj=JSON.parse(jObj);
                       ajaxReturn.innerHTML=obj.name;
                        }
                    }
           }
    }
}

jQuery发送ajax

在这里插入图片描述


将data当作“”json”解析

$(function () {
        $("#b-ajax").click(function () {
            $.get("http://localhost:8000/first",{name:"你好ma ",age:11},
            function (data) {         //data是响应体
                var obj = JSON.parse(data);
                $("#return-Me").html(obj.name);
            })
        });

})

在这里插入图片描述

axios发送ajax

get方式

  axios.get("http://localhost:8000",{
              params:{                         //请求参数
                  username:"123",
                  password:456
              },
              header:{
                  head:"请求头信息"
              }

post

 bAjax.onclick=function () {
        axios({
           url:"http://localhost:8000/first",
           method:"Get",
           params:{id:10},
           headers:{head:"头信息"},
            data:{username:"123",password:456}

        }).then(function (response) {
            response.status;
            response.statusText;
            response.headers;
            response.data;
        });
    }

fetch

     fetch("http://localhost:8000/first",{
            method:"post",
            headers:{"Access-Control-Allow-Origin":"*"},
            body:{username:"123",password:456},  //请求体
        }).then(function (response) {
                  
        })

同源策略：来源有相同的域名端口号
跨域解决方案：JSONP
只支持get请求，利用script标签实现跨域
express：

在这里插入图片描述


html：

在这里插入图片描述

在这里插入图片描述


jQuery发送jsonp

bAjax.onclick=function () {
          $.getJSON("http://127.0.0.1:8000/first?callback=?",function (data) {
           
          });
    }

express

const express = require("express");
const app=express();
app.all("/first",function (request,response) {   //创建路由规则
    // response.setHeader("Access-Control-Allow-Origin","*"); // 设置允许跨域
    var obj={name:"zhangsan"};
    var jo = JSON.stringify(obj);
    var back = request.query.callback;
    response.end("${back}(${obj})");
});
app.listen(8000,function () {
    console.log("服务监听")
})

cors：
跨域资源共享
response.setHeader(“Access-Control-Allow-Origin”,""); // 设置允许跨域
response.setHeader(“Access-Control-Allow-Headers”,""); // 允许用户自己设置请求头信息
response.setHeader(“Access-Control-Allow-Method”,"*"); // 允许所有请求方式访问

版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 dio@foxmail.com 举报，一经查实，本站将立刻删除。

相关推荐

ajax 上传文件项目下载
IE6是一个非常老旧的网页浏览器，虽然现在很少人再使用它，但是在某些特殊情况下，我们可能还需要使用IE6来访问网页。而在IE6中，我们通常会使用JavaScript来提交表单，来看一下具体操作。
ajax .post()
PHP中的count()函数是用来计算数组或容器中元素的个数。这个函数十分方便，在编写代码时使用频率也非常高。无论你是要统计数组的长度、统计字符串中字符出现的次数还是统计对象中属性的个数，count()都可以帮助你轻松
ajax 不返回值 写法
使用 AJAX（Asynchronous JavaScript and XML）技术可以在不刷新整个页面的情况下，向服务器发送请求并接收响应。通常来说，我们使用 AJAX 请求是为了获取后台数据，并将其展示在前端页面上。然而，有时候我们只需要
ajax 下载文件 blob
Ajax（Asynchronous JavaScript and XML）是一种用于改进网页用户体验的技术，通过与服务器进行异步通信，实现在网页上局部刷新数据而不必整个页面刷新的功能。在实际开发中，我们经常需要从服务器端下载文件，而传统
ajax 下载excel文件流
本文将介绍如何通过AJAX下载Excel文件流。通过AJAX，我们可以在不刷新整个页面的情况下，向服务器发送请求并获取响应数据。在某些场景下，我们需要通过AJAX下载Excel文件流，以便于在前端使用或保存到本地。本文将详
ajax .get .post
Ajax是一种用于客户端和服务器之间的异步通信技术。通过Ajax，我们可以在不刷新整个页面的情况下向服务器发送请求并获得响应数据。而在Ajax的基础上，.get和.post是两种常用的请求方法，它们分别用于发送GET和POST请
ajax 上传 excel
AJAX（Asynchronous JavaScript and XML）是一种在网页上实现异步数据传输的技术。通过AJAX，网页可以在不刷新整个页面的情况下与服务器进行数据交互，提升用户体验和页面性能。在实际应用中，AJAX广泛用于表单提交、
ajax 下拉 360取不到值
在使用Ajax下拉加载数据的过程中，有时候会出现无法取到360度的问题。这个问题可能是由于代码逻辑的问题导致的，也有可能是网络延迟引起的。为了解决这个问题，我们需要对代码进行仔细排查，并且在合适的地方添加适当
ajax 与 .post 区别
本文将介绍Ajax和.post之间的区别。Ajax是一种用于在网页上进行异步通信的技术，能够在不刷新整个页面的情况下更新部分页面内容。.post是jQuery中的一个方法，用于向服务器发送POST请求。虽然它们都可以用于发送异步
ajax 上传文件 目录权限
AJAX（Asynchronous JavaScript and XML）是一种在Web页面上进行异步数据请求和交互的技术。它的出现使得页面在后台与服务器进行数据交互的同时，不需要重新加载整个页面。在网页开发中，常常需要实现文件上传功能，
苹果市值2025年有望达4万亿美元
pythonJavaScriptjavaHTMLreactjsC#AndroidCSSNode.jssqlrpython-3.xMysqLjQueryc++pandasFlutterangularIOSdjangolinuxswifttypescript路由器JSON路由器设置无线路由器h3c华三华三路由器设置华三路由器电脑软件教程arraysdocker软件图文教程Cvue.jslaravelspring-bootreact-native