js对WebApi请求的基本操作

  在WebAPI对外提供的,大概有4种接口,get,post,delete,put,现在,我就简单的来说一下js请求webApi的方式和大概的作用;

  get:在webApi中,get方法通常是用来获取数据的,前端请求的方法通常是$.get(url,function(d){})(或者 $.ajax(url:url,success:function(d){//....}))的方式,传递的参数包含在url中;如 url+ "?id=1"(http://localhost/webapi/get?id=1);有多个值也可以多个传递,就不多说了;

  post:在一般情况下post是想服务器传递数据用的,通过jq的$.post()方法足够请求到数据,在webApi中一般会加上 Public bool Post ([FromBody] Model model){};在一个controller中只能有一个[FromBody] ,也就是说,post请求中,只能传递一个model,但是里面的内容却没有限制;而jq的请求方式可以有$.post(url,data,function(){});还有就是$.ajax({type:"post"});pos请求具体的可以看我写的另外一个随笔,请点这里

 put:put在webapi中是更新操作用的,可以是public void Put(int id, [FromBody]Model model){};jq向webapi请求put方法的时候,只能是$.ajax()的方式调用;jq代码如下:

               var url= "localhost/webapi/post",
           data={name:1};
         $.ajax({ type:
"put", url:url+"?id=1", data:JSON.stringify(data), contentType: 'application/json', async:true, success:function(){ //..... } });

 

这样,复杂类型 model 数据通过json的格式传递,是标记一个contentType: 'application/json'传输类型为json,而简单类型 id 则通过 url 地址里面传递;这样更新数据就方便多了;

  delete:delete方法一看就知道是用来删除数据的,请求方式和 get 方法类似了,方法只能以 $.post() 方法请求了,代码如下:C#代码 public void Delete(int id){};

                $.ajax({
                    type:"delete",
                    url:"...?id=1",
                    async:true,
                    success:function(){
                        //....
                    }
                });

重点就在请求的类型 type 上,只能是  type:"delete" ,而传的值放到url上就可以了;

  jq 向 webapi请求的基本操作就在这儿了,如果有什么不对或者不好的地方,希望能够指出,谢谢;

  

 

转载于:https://www.cnblogs.com/xiaoxiaoqiye/p/6403821.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
展示 OPC UA 节点可以分为以下几个步骤: 1. 前端 JavaScript 通过 HTTP 请求调用 Web API。 2. Web API 从 OPC UA 服务器中获取节点数据,并将数据以 JSON 格式返回给前端。 3. 前端 JavaScript 接收到返回的 JSON 数据后,解析数据并将数据渲染到 TreeView 中。 具体实现方式可以参照以下步骤: 1. 在 Web API 中使用 OPC UA 客户端库,如 node-opcua,连接 OPC UA 服务器,并获取节点数据。 2. 将获取到的节点数据转换为 JSON 格式,并使用 HTTP 协议将 JSON 数据返回给前端。 3. 在前端 JavaScript 中,使用 jQuery 或原生的 XMLHttpRequest 对象发送 HTTP 请求,获取 Web API 返回的 JSON 数据。 4. 解析 JSON 数据,并将数据渲染到 TreeView 中显示。 下面是一个简单的代码示例: Web API 代码: ```javascript const opcua = require("node-opcua"); const express = require("express"); const app = express(); const serverEndpointUrl = "opc.tcp://localhost:4840"; const client = new opcua.OPCUAClient(); let session; // 连接 OPC UA 服务器 client.connect(serverEndpointUrl, function (err) { if (err) { console.log("Cannot connect to server: ", err); } else { console.log("Connected to OPC UA server"); client.createSession(function (err, sess) { if (err) { console.log("Cannot create session: ", err); } else { console.log("Session created"); session = sess; } }); } }); // 获取节点数据 app.get("/opcua/nodes", (req, res) => { const rootFolderId = opcua.resolveNodeId("RootFolder"); session.browse(rootFolderId, function (err, browseResult) { if (err) { console.log("Cannot browse nodes: ", err); res.status(500).send({ error: "Cannot browse nodes" }); } else { const nodes = browseResult.references.map((node) => { return { id: node.nodeId.toString(), name: node.browseName.name.toString(), }; }); res.send(nodes); } }); }); app.listen(3000, () => console.log("Web API listening on port 3000")); ``` 前端 JavaScript 代码: ```javascript // 发送 HTTP 请求 $.get("http://localhost:3000/opcua/nodes", function (data) { // 解析 JSON 数据 var nodes = JSON.parse(data); // 渲染节点数据到 TreeView 中 var treeView = $("#treeView").kendoTreeView({ dataSource: nodes, dataTextField: "name", dataValueField: "id", }).data("kendoTreeView"); }); ``` 以上示例中,Web API 使用了 node-opcua 库连接 OPC UA 服务器,并通过 Express 框架提供 HTTP 服务。前端 JavaScript 使用了 jQuery 库发送 HTTP 请求,并使用 kendoTreeView 插件将节点数据渲染到 TreeView 中。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值