精华内容
下载资源
问答
  • 哈尔滨洛弘科技 -代码分享 -uniapp请求封装实例 -支持携带加密token
    var server = '请求地址';
    const session_id = '后台提供';
    const code = '后台提供';
    import md5 from 'js-md5';
    //请求接口
    export const request = (url, data, method) => {
    	return new Promise((resolve, reject) => {
    		let sign = get_sign(data, code, session_id);
    		var access_token = uni.getStorageSync('access_token');
    		var header = {
    			'content-type': 'application/x-www-form-urlencoded',
    			sign: sign,
    			accesstoken: access_token
    		};
    		uni.request({
    			url: server + url,
    			method: method || 'POST',
    			data: data || {},
    			header: header,
    			success: (res) => {
    				if (res.data.status !== 0) {}
    				resolve(res.data)
    			},
    			fail: (err) => {
    				console.log(err);
    				uni.showToast({
    					title: '嘤嘤嘤!!!网络出错了哦',
    					icon: 'none'
    				})
    				reject(err)
    			}
    
    		})
    	})
    }
    //文件上传
    export const uploadFile = (url, file, data) => {
    	return new Promise((resolve, reject) => {
    		let sign = get_sign(data, code, session_id);
    		var access_token = uni.getStorageSync('access_token');
    		var header = {
    			'Content-Type': 'multipart/form-data',
    			sign: sign,
    			accesstoken: access_token
    		};
    		uni.uploadFile({
    			url: server + url,
    			method: "POST",
    			filePath: file['value'],
    			name: file['field'],
    			success: (res) => {
    				resolve(JSON.parse(res.data))
    			},
    			fail: (err) => {
    				console.log(err);
    				uni.showToast({
    					title: '嘤嘤嘤!!!网络出错了哦',
    					icon: 'none'
    				})
    				reject(err)
    			}
    		})
    	})
    }
    //微信登录
    export const wxLogin = () => {
    
    	return new Promise((resolve, reject) => {
    			let _this = this;
    			uni.showLoading({
    				title: '微信授权中...'
    			});
    			uni.getUserProfile({
    				lang: 'zh_CN',
    				desc: '用于完善会员信息',
    				success: (infoRes) => {
    					var code = uni.getStorageSync('weixin_login');
    					var share_token = uni.getStorageSync('share_token');
    					request('info/wechat_login', {
    						code: code,
    						iv: infoRes.iv,
    						encryptedData: infoRes
    							.encryptedData,
    						share_token: share_token
    					}).then(result => {
    						uni.hideLoading();
    						if (result.code == 1) uni.setStorageSync('access_token', result.data
    							.user_token);
    						resolve(result.code);
    				
    					})
    				},
    				fail: (err) => {
    					uni.hideLoading();
    				}
    			})
    		})
    }
    
    function get_sign(data, code, session_id) {
    	var str = '';
    	for (var a in data) {
    		str += a + '=' + data[a] + '&';
    	}
    	str += 'code=' + code;
    	var sign = md5(str);
    	return session_id + '&' + sign;
    }
    

    md5类库位 uniapp的 js-md5

    展开全文
  • uniapp请求方法封装

    2020-12-18 10:45:37
    封装uni.request方法(第一次,写可能写的不好。) request.js文件 //接口地址 const comUrl = ""//公共路由地址 //get封装 function getRequest(url, data) { var promise = new Promise((resolve, reject) =&...

    封装uni.request方法(第一次,写可能写的不好。)

    request.js文件
    
    
    //接口地址
    const comUrl = ""//公共路由地址
    
    //get封装
    function getRequest(url, data) {
    	var promise = new Promise((resolve, reject) => {
    		uni.request({
    			url: comUrl + url,
    			method: "GET",
    			data: data,
    			dataType: "json",
    			//可以在这加上请求头
    			success: (res) => {
    				resolve(res);
    			},
    			fail: (res) => {
    				reject(res, "网络出错");
    			}
    		})
    	})
    	return promise
    }
    
    //post封装
    function postRequest(url, data) {
    	var promise = new Promise((resolve, reject) => {
    		uni.request({
    			url: comUrl + url,
    			method: "POST",
    			data: data,
    			//可以在这加上请求头
    			success: (res) => {
    				resolve(res);
    			},
    			fail: (res) => {
    				reject(res, "网络出错");
    			}
    		})
    	})
    	return promise;
    }
    
    module.exports = {
        post: postRequest,
        get: getRequest
    };
    
    main.js
    
    import {get,post} from "xx"//路径地址
    Vue.prototype.$get = get
    Vue.prototype.$post = post
    
    页面引用
    //get引用
    this.$get(url,data)
    //post引用
    this.$post(url,data)
    
    展开全文
  • uniapp 请求方式嵌套一层Promise用async和await的形式去写代码,错误请求统一处理,类同步方式写代码告别回调地狱
  • uniApp 请求接口封装

    千次阅读 2020-06-05 17:49:47
    }, // post 方法 post(url,data,options={}){ this.config.header.Authorization = uni.getStorageSync('token'); options.url = url; options.data = data; options.method = 'POST'; return this....

    commons目录下加 request.js

     

    // 引入配置文件
    import config from "./config.js";
    import User from "./user.js";
    export default{
    	config:{
    		baseUrl:config.webUrl,
    		header:{
    			'Content-Type':'application/json;charset=UTF-8',
    			'Content-Type':'application/x-www-form-urlencoded',
    			'Authorization':uni.getStorageSync('token'),
    		},
    		data: {},
    		method: "GET",
    		dataType: "json",
    		withCredentials: true
    	},
    	request(options = {}){
    		// options.header || 
    		options.header = this.config.header;
    		options.method = options.method || this.config.method;
    		options.dataType = options.dataType || this.config.dataType;
    		options.url = this.config.baseUrl+options.url;
    		// TODO:token增加等操作
    		if (options.Authorization) {
    			// 验证用户是否登录
    			if (!this.checkToken(options.checkToken)) return;
    			// 验证用户操作权限(验证是否绑定手机号码)
    			if (!this.checkAuth(options.checkAuth)) return;
    			options.header.Authorization = User.token;
    		}
    		return uni.request(options);
    	},
    	// get 方法
    	get(url,data,options={}){
    		options.url = url;
    		options.data = data;
    		options.method = 'GET';
    		return this.request(options);
    	},
    	// post 方法
    	post(url,data,options={}){
    		this.config.header.Authorization = uni.getStorageSync('token');
    		options.url = url;
    		options.data = data;
    		options.method = 'POST';
    		return this.request(options);
    	},
    	// 错误处理
    	errorCheck(err,res,errfun = false,resfun = false){
    		console.log(err)
    		if (err) {
    			typeof errfun === 'function' && errfun();
    			uni.showToast({ title: 'fail to load',icon:"none" });
    			return false;
    		}
    		
    		if (res.data.code) {
    			typeof errfun === 'function' && resfun();
    			uni.showToast({ title: res.data.errorMessage,icon:"none" });
    			return false;
    		}
    		return true;
    	},
    }

     

    main.js

    import request from "./commons/request.js";
    Vue.prototype.$http = request;

    引入示例

    async register(data) {
        let [err, res] = await this.$http.post('/userCt/login', {
    				   //请求账号密码登录接口
    				password: this.password,
    				userName: this.mobile
    			});
    // 这里是错误的回调,如果请求的接口错误,或者需要自定义返回的日志,可以在这里处理
    			if (!this.$http.errorCheck(err, res)) return;
    			if (res.data.code == 0) {
    				//这里这里是成功的回调
    			}
    }

     

    展开全文
  • uniapp请求接口封装

    2021-01-25 16:50:40
    最近做了一个uniapp的项目(引入了uView样式),前端请求接口封装: 在App.vue同级目录创建utils文件夹,文件夹内新建request.js 代码如下: //请求接口地址 // const baseUrl = '...

    最近做了一个uniapp的项目(引入了uView样式),前端请求接口封装:

    在App.vue同级目录创建utils文件夹,文件夹内新建request.js

    代码如下:

    //请求接口地址
    // const baseUrl = 'http://xxx.xxx.x.xxx:8080/api'
    //self
    // const baseUrl = 'http://xxx.xxx.x.xxx:8080/api'
    //product
    const baseUrl = 'http://xxx.xxx.x.xxx:8080/api'
    // const uri = 'http://xxx.xxx.x.xxx:8080';
    
    /**
     * 普通请求数据
     */
    const httpRequest = (url, method, data = {}, needToken = false) => {
    	let header =  {
    		'content-type': 'application/x-www-form-urlencoded'
    	};
    	if(needToken){
    		let token = uni.getStorageSync('token');
    		if(token){
    			header['token'] = token;
    		}else{
    			uni.reLaunch({
    				url:"/pages/login/login"
    			})
    		}
    	}
        let httpDefaultOpts = {
            url: baseUrl + url,
            data: data,
            method: method.toUpperCase(),
    		header: header,
    
    展开全文
  • uniapp 公共方法封装 公共请求封装

    千次阅读 2020-11-17 16:49:58
    常见的的方法,手机号验证,邮箱验证等方法我都会写到util下的util.js里 目录: util.js代码 -------------------------完整的验证封装代码-------------------------- //校验邮箱格式 function checkEmail...
  • 所以就打算在uniapp封装一个返回Promise对象的get和post请求。 HttpUrl 就是固定前缀和axios.defaults.baseURL一样的 第三个参数正常来说应该传个header对象,但是项目需求没这么大,所以就直接传了个属性 下面两...
  • 自己根据公司同事留下的代码改的,uniapp请求封装 import { BASE_URL } from './config.js' // 公共的请求方法 function request ({ url, method, // 不填为不需要token,为true为需要token isAuth, data, //...
  • uniapp 数据请求封装以及通用使用

    万次阅读 2019-01-28 15:16:02
    // 参数: url:请求地址 param:请求参数 way:请求方式 res:回调函数 function urlRequest(url, param, way, res) { let deviceId = '' uni.getStorage({ key: 'deviceIds', success: function(res) ...
  • uniapp接口请求封装api(超简单)

    千次阅读 2021-06-03 14:02:00
    最下面有使用方法 ... //公共路径 const userId = uni....//post请求封装 function postRequest(url,data,type){ var promise = new Promise((resolve,reject) => { var postData = data; uni.reques
  • uniapp请求封装

    2021-01-17 14:35:37
    代码如下我们开始封装吧!!!!1、在你文件夹下面创建一个Api文件夹2、创建一个index.js 文件夹代码如下: 直接可以复制到你的index.js 文件夹里面const httpServer = (opts, data) => {let httpDefaultOpts = {...
  • vue.js、uniapp两种封装接口请求方法

    千次阅读 2020-11-25 11:49:12
    前言:分别有两种封装方法适用于vue.js和uniapp;第一种:全局注册,通过this调用,不需要import引入js文件。第二种:需要请求接口的页面还要import一下。 ps:下面代码示例是uniapp项目 目录结构 第一种封装 1:...
  • 1.正常使用uni.request()发送请求(未封装) get() { uni.request({ url: 'http://192.168.1.191/abc//main/jiekouming/abclist?workType=2', data: {}, header: { Token: 'b042b36fwq909qwe9iiidsai2323sd232dw3...
  • 全局请求封装:request.js // 全局请求封装 const token = uni.getStorageSync('token'); import service from "./service.js"; // 请求字典 export default (url, method, params) => { uni.showLoading({ ...
  • => { // 请求超时执行方法 overtime = true // 将状态标记为超时,不会被 fail 中的 onerror 重复执行 requestTask.abort() // 执行取消请求方法 await this.onerror(method, url, data, '网络...
  • uniapp封装好的request
  • uniapp 请求request 封装

    2022-01-06 13:47:33
    ... httpRequest:function(options={}){ // console.log(options,'options') // 设置请求头信息 options.header={ 'Content-Type': 'application/json;charset=UTF-8', } //请求地址 var url=baseUrl+
  • uniapp缓存方法封装

    2021-06-29 15:31:14
    //获取缓存 sync true 异步 false 同步 function get(key,sync = true) { try { if(sync){ return uni.getStorageSync(key); }else{ let data = ''; uni.getStorage({ key:key, success: function ...
  • uniapp请求接口封装(接口写在单独js文件夹内)第一步第二步第三步以上就是uniapp的请求接口封装了 第一步 1、在项目根目录下新建app目录; 2、在app目录下新建http.js文件用于封装request请求,代码如下: /* @...
  • uniapp接口请求方法封装 1、具体页面代码 (main.js) const that = Vue.prototype; //实例Vue.prototype //get请求方法 //url 路径 //params 入参 //isLoading 是否显示加载中的动画 //loadText加载中… 动画提示...
  • uniapp请求高级封装

    2020-09-15 19:38:12
    1.根目录下创建api api/errdata.js // 提示 const errdata = { errlist(err) { uni.showToast({ icon: 'none', ...// 封装请求:get post // 引进提示 import {errdata} from 'api/errdata.js' // GET le
  • uniapp封装请求示例完整项目,接口都写在一个脚本里,通过参数传入uni.request进行请求,缩小代码重复量,在request文件请求中通过promise封装进行结果和错误捕获,
  • return new Promise((resolve,reject)=>{ uni.request({ url: requestUrl, method: method, header: header, data: data, }) .then(res=>{ // 判断请求是否成功;并做相对于的处理 if...
  • uniapp请求后端接口封装 1、首先在根目录下创建以下文件 2、在api.js中写入 const baseUrl = 'http://xxxxxxxx'; //请求后端服务接口地址 const myRequest=(options)=>{ //传入的options是一个json对象 uni....

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 1,968
精华内容 787
关键字:

uniapp请求方法的封装