接口的请求一般是比较固定的:主要考虑什么样的请求方式,url,需不需要传递参数等问题,这是你在写请求代码之前应该考虑的东西。但是因为js语法的不一样以及个人习惯不一样,会因人而异的产生差别。

XMLHttpRequest() 这个对象可以在不重新加载页面的情况下从后台获取数据,支持的浏览器有IE7+、Firefox、Chrome、Safari 以及 Opera。onreadystatechange事件 当readyState的值发生改变时触发此事件。

open() 这个方法有三个参数,open("提交方式 get/post","资源的地址",异步或者同步 true/false);

原生get如下:

var obj = { menu: 'Net'}; //要传的参数
var xhr = new XMLHttpRequest();  //这里没有考虑IE浏览器,如果需要择if判断加
xhr.open('GET', "接口",true);
xhr.send(JSON.stringify(obj));//这里要是没有参数传,就写null
xhr.onreadystatechange = function () {if (xhr.status === 200 && xhr.readyState === 4) {//js处理数据}
}

原生post如下:

var xmlHttp = new XMLHttpRequest;
xmlHttp.open('POST', 'http://192.168.0.109:80/dingding/hook/vbn');
xmlHttp.setRequestHeader('content-type', 'application/json');
xmlHttp.setRequestHeader('token', '701558c38f34c3e08e0ab305c84ecy0b');
let obj = {content: JSON.stringify(jsonObj),prjId: localStorage.getItem('prjId'),creator: localStorage.getItem('creator'),configName: name.split('.')[0]
}
var stringData = JSON.stringify(obj);
xmlHttp.send(stringData);
xmlHttp.onreadystatechange = function() {
//complete
if (xmlHttp.readyState == 4 && xmlHttp.status == 200) {mxUtils.confirm(mxResources.get('saveSuccess'), true);
} else {//请求失败的回调函数console.log('保存失败');}
}

vue中封装好的http的get请求:

export function checkGwsnAndPassword(parameter) {return axios({url: api.checkGwsnAndPassword,method: 'get',params: parameter})
}

http的post请求:

//this.$http为封装的挂在全局的
_this.$http.post('/state/frong/ready.do', {params: {gwn: _this.gwn,times: data.time,time_zone:"UTC+08:00"}
}).then((res) => {console.log(res);
}//或者
export function getAllDeviceList(parameter) {return axios({url: api.getAllDeviceList,method: "post",data: parameter})
}

JS接口请求的写法(原生post与get请求、http请求等)相关推荐

  1. js异步请求php数据,原生JS发送异步数据请求实例详解

    这篇文章主要为大家详细介绍了原生JS发送异步数据请求的相关资料,具有一定的参考价值,感兴趣的小伙伴们可以参考一下 在做项目的时候,有时候需要用到异步数据请求,但是如果这个时候没有框架的依赖,就需要用到 ...

  2. js原生ajax跨域请求,封装一个原生js的ajax请求,支持IE9CORS跨域请求

    前言 关于纯js的ajax请求,我之前有文章写过, https://www.haorooms.com/post/js_ajax_chun , 关于CORS跨域资源共享,我也有文章写过, https:/ ...

  3. 微信公众号开发 自定义分享 从前台到Java后台 调用微信JS接口分享朋友圈

    20180811写在前面的话 有很多人遇到问题之后问我,结果大多数是因为配置问题,所以请详细阅读前面的配置步骤. 20181016注意事项 收到反馈,之前写的接口即将废弃,源代码中的js接口需要修改, ...

  4. 微信开发-js接口的使用无法使用分享功能的一些说明

    微信里面的一些js接口会跟想要的有所出入,比如分享接口的调用,不能用onclick绑定自定义按钮调用,只能使用微信页面自带菜单里的分享功能进行分享,可以改变的是自定义分享内容,我测试的是分享到微信好友 ...

  5. 原生AJAX以及JQuery发送AJAX请求的几种方式

    JSON&AJAX 文章目录 JSON&AJAX 1. JSON 1.1 json概述 1.2 Json使用 3. 原生AJAX 4. JQuery的AJAX 4.1 GET请求方式 ...

  6. c# sha1签名 微信_C#微信公众号JS接口签名算法

    以下内容是微信官方开发文档,注意标红文字 附录1-JS-SDK使用权 限签名算法 jsapi_ticket 生成签名之前必须先了解一下jsapi_ticket,jsapi_ticket是公众号用于调用 ...

  7. 微赞dataconfig.php,php生成微信jssdk wx.config参数,调用js接口

    流程 : 服务端请求微信生成config相关参数 客户端ajax请求服务器获取参数 config.php $appid = 'wx8e66f8993d'; $appsecret = '42190267 ...

  8. 微信JS接口开发指南

    目录 概述 使用说明 接口调用说明 基础接口 判断当前客户端版本是否支持指定JS接口 分享接口 获取"分享到朋友圈"按钮点击状态及自定义分享内容接口 获取"分享给朋友&q ...

  9. 微信JS接口- 企业号开发者接口文档

    目录 1 概述 1.1 使用说明 1.1.1 步骤一:引入JS文件 1.1.2 步骤二:通过config接口注入权限验证配置 1.1.3 步骤三:通过ready接口处理成功验证 1.1.4 步骤四:通 ...

最新文章

  1. 不使用递归求全排列和组合数
  2. ajax jq 图片上传请求头_全面分析前端的网络请求方式:Ajax ,jQuery ,axios,fetch
  3. (一)javascript面向对象:(1)类
  4. 如何优化Jupyter Notebook
  5. 【kafka】kafka 消费报错 No entry found for connection
  6. java 拷贝大文件_java高效实现大文件拷贝功能
  7. 2022年考研计算机组成原理_2 数据表示和运算
  8. opencv项目案例_三菱PLC的光学玻璃热处理项目
  9. 计算机网络安全重要性
  10. javaweb开发后端常用技术_java后端开发需要掌握什么技术
  11. linux centos下安装R语言,Centos6下安装R语言教程
  12. Maya2018安装及激活教程
  13. golang mian函数和init函数
  14. 「现场参会攻略」| 2018AI in China之智能制造数据驱动产业变革高峰论坛
  15. mac电脑显示器分辨率显示异常
  16. 蒟蒻信安笔记4:CTF实践
  17. MQ如何快速实现流量削峰填谷
  18. python画图分析问卷(含多选题)
  19. 大数据技术_ 基础理论 之 大数据概念与应用
  20. 计算机毕业设计java+ssm酒店管理系统(源码+系统+mysql数据库+Lw文档)

热门文章

  1. 使用python中openpyxl模块操作excel文件,计算单元格分子式的相对分子质量(一)
  2. 中国乳酸菌制品市场销售状况及营销趋势预测报告(2022-2027年)
  3. Java 抽象工厂模式
  4. iBook文件的导出
  5. Transformer:注意力机制(attention)和自注意力机制(self-attention)的学习总结
  6. 1、《The tempotron : a neuron that learns spike timing based decisions》
  7. JS中是否一切皆对象 ?
  8. 汽车零部件行业能不能用IPD
  9. 微信收款助手消息不弹窗的解决办法
  10. SSL证书是什么?SSL运作方式?