HTML封装AJAX请求，在请求里面写登录的逻辑 ajax 网络请求 post

调用方法：先引用config.js，然后调用封装网络请求。

里面三个参数 1.url， 2.请求需要提交的数据, 3.请求类型


// 获取二维码、背景图片接口
getScheduleInfo() {var url = '/v1/basketball/getQRCode.do';var params = {phone: '13977284414'}config.RequestData(url, params,'get').then(res => {console.log('获取二维码、背景图片接口', res.module);}).catch(error => {console.log(error);})
},

config.js代码：

这里根据我代码的实际情况，在封装的网络请求里面做了登录的判断，如果没有登录，就先调登录接口，然后再重新请求。

这里我把用户唯一标识（session）和活动id（activityId）也放到 data 中,并且根据不同的情况用不同的域名进行网络请求。可以根据你自己的需求做修改。

const config = {USERhttpURL: 'https://aaa.cn', // 测试环境1httpURL: 'https://bbb.cn', //测试环境2// 授权登录接口 toLoginOk: (url, data = {}, method = 'post', resolve) => {console.log('调用登录接口，获取session')var login_url;var login_params = {auth_user: config.getUrlkey(location.href).auth_user ? config.getUrlkey(location.href).auth_user : ''}if (config.getUrlkey(location.href).activityId) {login_url = config.httpURL + '/actcenter/v1/user/login.do';login_params.activityId = config.getUrlkey(location.href).activityId;} else {login_url = config.USERhttpURL + '/v1/user/login.do';console.log('是个人中心接口---toLoginOk', login_url)}$.ajax({type: 'post',url: login_url,contentType: 'application/x-www-form-urlencoded;charset=utf-8',data: login_params,dataType: "json",complete: res => {res = res.responseJSONif (res.success) {var session = res.module; // session if (session) {if(config.getUrlkey(location.href).activityId){localStorage.setItem('session', session); // 设置缓存}else{localStorage.setItem('userSession', session); // 设置缓存}config.ajaxIng(url, data, method, resolve);}} else {}}})},// 网络请求中ajaxIng(url, data, method, resolve) {if (config.getUrlkey(location.href).activityId) {url = config.httpURL + url;data.activityId = config.getUrlkey(location.href).activityId;data.session = localStorage.getItem('session');} else {url = config.USERhttpURL + url;data.session = localStorage.getItem('userSession');console.log('是个人中心接口---ajaxIng', url)}$.ajax({type: method,url: url,contentType: 'application/x-www-form-urlencoded;charset=utf-8',data: data,dataType: "json",complete: res => {if (res.success) {resolve(res); // 成功} else {reject(res); // 失败}}})},// 封装数据请求/*** url   请求的api               必传* data  请求参数{}              非必传* method  请求方法  get、post   非必传*/RequestData: (url, data = {}, method = 'post') => {return new Promise((resolve, reject) => {//如果是篮球活动，就会有 configActivityId  篮球活动用的是 session  个人中心用的是 userSessionif (config.getUrlkey(location.href).activityId) {if (localStorage.getItem('session')) {config.ajaxIng(url, data, method, resolve);} else {config.toLoginOk(url, data, method, resolve)}} else {if (localStorage.getItem('userSession')) {config.ajaxIng(url, data, method, resolve);} else {config.toLoginOk(url, data, method, resolve)}}})},// url参数解析getUrlkey: function(url) {var params = {};try {var urls = url.split("?");var arr = urls[1].split("&");for (var i = 0, l = arr.length; i < l; i++) {var a = arr[i].split("=");params[a[0]] = a[1];}} catch (e) {//TODO handle the exception}return params;}
}

HTML封装AJAX请求，在请求里面写登录的逻辑 ajax 网络请求 post相关推荐

android post请求添加公共参数_XHttp2 一个功能强悍的网络请求库
XHttp2 一个功能强悍的网络请求库,使用RxJava2 + Retrofit2 + OKHttp组合进行封装.还不赶紧点击使用说明文档,体验一下吧! 项目地址关于我 https://github ...
超简单-用协程简化你的网络请求吧,兼容你的老项目和旧的网络请求方式
前言在Kotlin协程(后简称协程)出来之后,颠覆了我们很多工具类的封装方式,大大简化了我们很多api的调用,并且使异步操作逻辑更清晰了其中一个很标志性的地方就属网络请求了,以前的网络请求方式声明 ...
android 请求方式有哪些,Android中的几种网络请求方式详解
Android应用经常会和服务器端交互,这就需要手机客户端发送网络请求,下面整理四种常用网络请求方式. java.net包中的HttpURLConnection类 Get方式: // Get方式请求 ...
android多个网络请求如何依次执行,Android 并发和串行网络请求
需求假如有上面的需求,我们从MVC模型上考虑,View层可以使用ListView的多Type,Model层可以考虑串行和并行处理数据,下面分别给出两种不同的处理思路串行思路这里直接给出一般的串行 ...
微信小程序网络请求异常怎么办_解决·微信小程序开发-网络请求报Invalid request 400错误...
今天学习了一下微信小程序的入门开发,在使用网络请求时,发现根据微信官方的API的方法进行操作出现Invalid request 400错误,到底怎么回事呢? 首先我们来看微信API网络请求示例代码: ...
安卓HttpURLConnection 进行http请求（传递数据获取数据主线程禁止网络请求）以get方式为例
注意: 1.安卓主线程禁止联网操作,如果在主线程中使用HttpURLConnection需通过new Thread()在新的线程中使用. 2.使用HttpURLConnection时必须设计异常处理. ...
Anroid-async-http封装网络请求框架源码分析
Android-async-http开源项目可以是我们轻松的获取网络数据或者向服务器发送数据,使用起来非常简单, 这个网络请求库是基于Apache HttpClient库之上的一个异步网络请求处理库, ...
xUtils3.x的网络请求封装和请求https之单向SSL验证
很久没写博客了, 自己定的路已经走歪,菜鸟的进阶之路上我只是走了一步,自从发了一篇博客之后在没有来过这里,已经有一年了吧,今天再次回到这里. 言归正传,今天要写的是xUtils3.x网络请求的封装和请 ...
基于OkHttp3封装网络请求框架
前言网络请求可以说是开发一款移动APP最核心的基础功能了,通过实际工作中以及浏览了许多网络框架之后,本篇在这里分享慕课一位老师基于OkHttp封装的一个轻量的网络框架,至于为什么说它轻量,因为代码少 ...

HTML封装AJAX请求，在请求里面写登录的逻辑 ajax 网络请求 post

HTML封装AJAX请求，在请求里面写登录的逻辑 ajax 网络请求 post相关推荐

最新文章

热门文章