小程序app.js小结
小程序app.js
app.js
import {
ApiUrl
} from 'utils/apiurl.js';
import {
httpReq
} from 'utils/http.js';
/*以上两个文件为封装的请求数据的接口,文件内容我会放在最后,不用这俩文件的可以安装wx.request(微信开发文档提供方法来请求),这两个文件也是在原方法上做了改动但效果一样的,
*/
App({
onLaunch: function () {
var logs = wx.getStorageSync('logs') || []//
logs.unshift(Date.now())
/*unshift() 方法将把它的参数插入 arrayObject 的头部,并将已经存在的元素顺次地移到较高的下标处,以便留出空间。该方法的第一个参数将成为数组的新元素 0,如果还有第二个参数,它将成为新的元素 1,以此类推。
*/
wx.setStorageSync('logs', logs)// 根据时间存储log // 登录
wx.login({
success: res => {
/* 发送 res.code 到后台换取 token,openId, sessionKey, unionId(都可以获取,和后端商议选择其中需要的获取并使用)
*/
if(res.code) {
//发起网络请求
httpReq({
header: {
//此处为示例header内容,写自己项目的即可
'Content-Type': 'application/json',
'Accept': 'application/json'
},
method: 'GET',
/* url: 'https://api.weixin.qq.com/sns/jscode2session?appid=wxf7a9fda47682a9a6&secret=cc74bba5adfa5e077038c5cb8baca13c&js_code='+ res.code+'&grant_type=authorization_code'
*/
url: ApiUrl.phplist + 'index/gettoken?code=' + res.code,
/*上面第一个url为前端直接绕过后端去微信请求拿到openid和session_key,主要是当时拿不到数据和后端争论故自己直接拿证明自己前端没有错,你们还是正常用下面的后端请求到的就可以了。
*/
}).then((res) =>{
wx.setStorageSync(res.data.lists.token)
/*此处后端要求我们拿token在其他页面使用说是为了安全,他的意思是说我刚刚自己绕过他去微信那边直接拿了openid和session_key不安全,我?????,只能现在按他的做了,其他页面需要openid时再传给他token换取。
*/
})
} else {
console.log('登录失败' + res.errMsg)
}
}
}) // 获取用户信息
wx.getSetting({
success: res => {
if (res.authSetting['scope.userInfo']) {
// 已经授权,可以直接调用 getUserInfo 获取头像昵称,不会弹框
wx.getUserInfo({
success: res => {
this.globalData.userInfo = res.userInfo /*此处是可以直接获取到你微信个人账号信息的,就是图像,昵称,性别,省份,城市等之类的,如果是电话,具体地址等私密信息是要额外授权才能获取的,由于 getUserInfo 是网络请求,可能会在 Page.onLoad 之后才返回.
所以此处加入 callback 以防止这种情况*/
if (this.userInfoReadyCallback) {
this.userInfoReadyCallback(res)
}
},
fail: function(res) {}
})
} else {
wx.showModal({
title: '警告通知',
content: '您点击了拒绝授权,将无法正常显示个人信息,在设置中确定重新获取授权。',
})
}
},
fail: function(res) {}
})
},
globalData: {
userInfo: null,
}
})
apiurl.js
let ApiUrl = {};
// php列表
ApiUrl.phplist = 'http://www.ylb.com/api/'; // 详细信息
ApiUrl.detail = ApiUrl.phplist+'/'; export {ApiUrl};
http.js
function httpReq(params = {}){
let url = params.url || 'http://www.ylb.com';
let data = params.data || '';
let header = params.header || {};
let method = params.method || 'GET'; // 使用Promise来解决异步问题
return new Promise((resolve, reject) => {
// 发起网络请求
wx.request({
url,
data,
header,
method, // 成功
success: resolve, // 失败
fail: reject
})
})
}
// 导出模块
export {httpReq};
以上仅为小女子做项目时的一些理解与记录,初次接触小程序,仅供大家参考,欢迎各位大佬指正,代码各种问题都可以留言联系我,你主动,我们才有故事。
小程序app.js小结的更多相关文章
- 微信小程序~App.js中登录
(1)初始化项目中App.js登录代码 // 登录 wx.login({ success: res => { // 发送 res.code 到后台换取 openId, sessionKey, u ...
- 微信小程序app.js中设置公有变量
初始化GlobalData 在App.js的最上方可以设置GlobalData的初始值. App({ globalData:{ appid: '1wqas2342dasaqwe232342xxxxxx ...
- 小程序App.js 传递数据给实例(app异步数据问题)
在最开始初始化的时候,都会触发app.js 这个里面的onload生命方法, 在这个方法里面我们可以获取之前的存储数据/异步请求等等操作, 但是这些操作一般都是需要稍许时间.也就是说在其他界面加载结束 ...
- 微信小程序 --- app.js文件
app.js文件是项目的入口文件: //app.js App({ onLaunch: function () { // 展示本地存储能力 var logs = wx.getStorageSync('l ...
- 微信小程序~App.js中获取用户信息
(1)代码:主要介绍下获取用户信息部分 onLaunch: function () { // 展示本地存储能力 var logs = wx.getStorageSync('logs') || [] l ...
- 微信小程序 app.js globalData 赋值报错
//success方法要用用success: res => {}的格式 success: res => { } //赋值报错 success:function(e){ } //报错内容: ...
- 在微信小程序的JS脚本中使用Promise来优化函数处理
在我们传统的Javascript开发函数编写中,我们习惯了回调函数的处理,不过随着回调函数的增多,以及异步处理的复杂性等原因,代码越来越难读,因此诞生了使用Promise来优化JS函数处理的需求,引入 ...
- 微信小程序APP生命周期
小程序APP生命周期需要先从app.js这个文件开始,App() 必须在 app.js 中调用,必须调用且只能调用一次,app.js中定义了一些应用的生命周期函数 onLaunch----当小程序初始 ...
- 微信小程序-APP生命周期与运行机制
QQ讨论群:785071190 开发微信小程序之前需要先了解微信小程序运行机制以及其生命周期,小程序APP生命周期需要先从app.js这个文件开始. 阅读过"微信小程序-代码构成" ...
随机推荐
- Flask框架(五) —— session源码分析
Flask框架(五) —— session源码分析 目录 session源码分析 1.请求来了,执行__call__方法 2.__call__方法 3.调用__call__方法 3.1.ctx = s ...
- django groupby 用法
- C#获取当前路径7中方法
//获取模块的完整路径. string path1 = System.Diagnostics.Process.GetCurrentProcess().MainModule.FileName; //获取 ...
- [转帖]socat使用笔记
socat使用笔记 https://blog.csdn.net/yangbingzhou/article/details/49783235 进行简单学习 centos 下面安装 yum install ...
- oracle_fdw安装及使用(无法访问oracle存储过程等对象)
通过oracle_fdw可以访问oracle中的一些表和视图,也可以进行修改,尤其是给比较复杂的系统使用非常方便. (但不能使用oracle_fdw来访问oracle的存储过程.包.函数.序列等对象) ...
- 逆序单词 HIhoCoder 1366 字典树
逆序单词 HIhoCoder 1366 字典序 题意 在英文中有很多逆序的单词,比如dog和god,evil和live等等. 现在给出一份包含N个单词的单词表,其中每个单词只出现一次,请你找出其中有多 ...
- glVertexAttribPointer 顶点数据解析方式
glVertexAttribPointer(0, 4, GL_FLOAT, GL_FALSE, 0, 0); 第一个参数指定从索引0开始取数据,与顶点着色器中layout(location=0)对应. ...
- Apache与Tomcat联系及区别??
Apache与Tomcat都是Apache开源组织开发的用于处理HTTP服务的项目,两者都是免费的,都可以做为独立的Web服务器运行.Apache是Web服务器而Tomcat是Java应用服务器. A ...
- leetcode第一题(easy)
第一题:题目内容 Given an array of integers, return indices of the two numbers such that they add up to a sp ...
- POI读取文件的最佳实践
POI是 Apache 旗下一款读写微软家文档声名显赫的类库.应该很多人在做报表的导出,或者创建 word 文档以及读取之类的都是用过 POI.POI 也的确对于这些操作带来很大的便利性.我最近做的一 ...