HBuilderX

HBuilderX

极客开发工具
uni-app

uni-app

开发一次,多端覆盖
uniCloud

uniCloud

云开发平台
HTML5+

HTML5+

增强HTML5的功能体验
MUI

MUI

上万Star的前端框架

uniapp app内微信支付和支付宝支付 前端部分

支付

由于文档中写的不清楚,所以走了些弯路,记录下来
前端所要做的就是

  1. 请求后端接口,获取到orderinfo

  2. 调用支付API uni.requestPayment

  3. 处理回调

主要就是orderinfo格式文档写的不够清楚,这里进行说明orderinfo完全是后端返回的,前端不做任何处理,所以orderinfo有问题推给后端,前端不用浪费时间, app的支付不管ios还是android都是string类型

微信orderinfo格式   
 "{\"appid\":\"xxxxxxxx\",\"partnerid\":\"xxxxxxx\",\"prepayid\":\"xxxxxxxxxxxxxxxx\",\"timestamp\":\"1579779903\",\"noncestr\":\"xxxxxxx\",\"package\":\"Sign": "WXPay\",\"sign\":\"xxxxxxxxxxxxxxxxxxxx\"}"  

支付宝orderinfo格式  
app_id=xxxxxxxxx&method=xxxxxxxxxx&format=JSON&charset=UTF-8&sign_type=RSA2&version=1.0&return_url=xxxxxxxxxxxxxxxxxxxxxxxxxxxxx&notify_url=xxxxx&timestamp=xxxxxx&sign=xxxxxxx&biz_content=xxxxxxxxxx
uni.requestPayment({  
    provider: 'alipay',  
    orderInfo: '后端返回的orderinfo字符串',  
    success: res => {  
        // 进入此回调说明支付成功  
    },  
    fail: err => {  
        const message = err.errMsg || '';  
        if (message.indexOf('[payment支付宝:62001]') !== -1) {  
            uni.showModal({  
                content: '您已取消支付。如有需要,您可在我的订单里重新付款。30分钟内有效。',  
                showCancel: false  
            });  
        } else {  
            uni.showModal({  
                content: '支付失败,原因为: ' + message,  
                showCancel: false  
            });  
        }  
    },  
    complete: () => {  
        this.submitting = false;  
        }  
    });
继续阅读 »

由于文档中写的不清楚,所以走了些弯路,记录下来
前端所要做的就是

  1. 请求后端接口,获取到orderinfo

  2. 调用支付API uni.requestPayment

  3. 处理回调

主要就是orderinfo格式文档写的不够清楚,这里进行说明orderinfo完全是后端返回的,前端不做任何处理,所以orderinfo有问题推给后端,前端不用浪费时间, app的支付不管ios还是android都是string类型

微信orderinfo格式   
 "{\"appid\":\"xxxxxxxx\",\"partnerid\":\"xxxxxxx\",\"prepayid\":\"xxxxxxxxxxxxxxxx\",\"timestamp\":\"1579779903\",\"noncestr\":\"xxxxxxx\",\"package\":\"Sign": "WXPay\",\"sign\":\"xxxxxxxxxxxxxxxxxxxx\"}"  

支付宝orderinfo格式  
app_id=xxxxxxxxx&method=xxxxxxxxxx&format=JSON&charset=UTF-8&sign_type=RSA2&version=1.0&return_url=xxxxxxxxxxxxxxxxxxxxxxxxxxxxx&notify_url=xxxxx&timestamp=xxxxxx&sign=xxxxxxx&biz_content=xxxxxxxxxx
uni.requestPayment({  
    provider: 'alipay',  
    orderInfo: '后端返回的orderinfo字符串',  
    success: res => {  
        // 进入此回调说明支付成功  
    },  
    fail: err => {  
        const message = err.errMsg || '';  
        if (message.indexOf('[payment支付宝:62001]') !== -1) {  
            uni.showModal({  
                content: '您已取消支付。如有需要,您可在我的订单里重新付款。30分钟内有效。',  
                showCancel: false  
            });  
        } else {  
            uni.showModal({  
                content: '支付失败,原因为: ' + message,  
                showCancel: false  
            });  
        }  
    },  
    complete: () => {  
        this.submitting = false;  
        }  
    });
收起阅读 »

wkwebview下彻底解决ajax跨域问题

ajax WKWebview 跨域

尽管官方提供plus.net.XMLHttpRequest口口声声说是支持跨域,但实际上本地跨域却不支持,很是扯蛋。

本地跨域是指加载本地file://开头(即file协议)文件,比如用ajax请求本地html或json文件,在ios的uiwebview没问题,但在wkwebview下,即使用plus.net.XMLHttpRequest也不行,这里想到方法是自己写一个XMLHttpRequest,核心是利用plus.io.resolveLocalFileSystemURL来实现。修改一下你的程序启动代码,引入这个自定义的XMLHttpRequest文件,然后在plus初始化相关代码里加入以下代码:

    var oxhr = jQuery.ajaxSettings.xhr;  
    var plusXhr = function() {  
         try {  
            return new plus.net.XMLHttpRequest();  
        } catch ( e ) {}  
    };  

    var myXhr = function() {  
        try {  
            return new MyXmlHttpRequest();  
        } catch ( e ) {}  
    };  

    jQuery.ajaxSettings.xhr = plusXhr; //默认使用plus的XMLHttpRequest  

    var _ajax = $.ajax;  
    $.ajax = function(url, options) {//重写ajax方法  
        var urlx = url;  
        if (typeof url === 'object' && url !== null) {  
            urlx = url.url;  
        }  

        if (urlx.indexOf('http') !== 0) {  
            jQuery.ajaxSettings.xhr = myXhr; //本地文件,file协议或相对路径时使用本地xhr  
        } else {  
           jQuery.ajaxSettings.xhr = plusXhr; //还原成plus自带的  
       }  
        return _ajax(url, options);  
    }

【注】以上是jquery示例,如果是mui、uni-app请根据具体情况参照修改。

附件更新:2020.02.05

继续阅读 »

尽管官方提供plus.net.XMLHttpRequest口口声声说是支持跨域,但实际上本地跨域却不支持,很是扯蛋。

本地跨域是指加载本地file://开头(即file协议)文件,比如用ajax请求本地html或json文件,在ios的uiwebview没问题,但在wkwebview下,即使用plus.net.XMLHttpRequest也不行,这里想到方法是自己写一个XMLHttpRequest,核心是利用plus.io.resolveLocalFileSystemURL来实现。修改一下你的程序启动代码,引入这个自定义的XMLHttpRequest文件,然后在plus初始化相关代码里加入以下代码:

    var oxhr = jQuery.ajaxSettings.xhr;  
    var plusXhr = function() {  
         try {  
            return new plus.net.XMLHttpRequest();  
        } catch ( e ) {}  
    };  

    var myXhr = function() {  
        try {  
            return new MyXmlHttpRequest();  
        } catch ( e ) {}  
    };  

    jQuery.ajaxSettings.xhr = plusXhr; //默认使用plus的XMLHttpRequest  

    var _ajax = $.ajax;  
    $.ajax = function(url, options) {//重写ajax方法  
        var urlx = url;  
        if (typeof url === 'object' && url !== null) {  
            urlx = url.url;  
        }  

        if (urlx.indexOf('http') !== 0) {  
            jQuery.ajaxSettings.xhr = myXhr; //本地文件,file协议或相对路径时使用本地xhr  
        } else {  
           jQuery.ajaxSettings.xhr = plusXhr; //还原成plus自带的  
       }  
        return _ajax(url, options);  
    }

【注】以上是jquery示例,如果是mui、uni-app请根据具体情况参照修改。

附件更新:2020.02.05

收起阅读 »

多级联动发布

自定义组件

uniapp实现多级联动组件

picker实现多级联动:

  1. 1.可以实现多级联动
  2. 2.每一级联动选择一项,后边的都要重新选择

uniapp实现多级联动组件

picker实现多级联动:

  1. 1.可以实现多级联动
  2. 2.每一级联动选择一项,后边的都要重新选择

for循环生成的元素无法获取到ref

本人最近使用bindingX写动画,需要使用ref来绑定元素。
本来普通的view里ref='aaa'这样在使用时候很顺手,this.$refs.name.ref就可以拿到;
后来意识到需要数据渲染,for循环后突然报错了,undefined,最后找到问题竟然在this.$refs.name拿到的竟然是类似html的标签,this.$refs里对应的name下与打印出来的东西不一致,导致我很困惑,为什么如此之不一致。
就在我蒙了三天之后,我就想打印一下this.$refs.name的字符串,this.$refs.name[0]竟然不报错,
最后,完美解决。this.$refs.name[0].ref就可以拿到之前的东西。

后来,偶然看到了这个,当然会vue的大神们不要嘲笑,这篇就是为了分享给那些同我一样,没有vue开发经验硬写app的彩笔们。

继续阅读 »

本人最近使用bindingX写动画,需要使用ref来绑定元素。
本来普通的view里ref='aaa'这样在使用时候很顺手,this.$refs.name.ref就可以拿到;
后来意识到需要数据渲染,for循环后突然报错了,undefined,最后找到问题竟然在this.$refs.name拿到的竟然是类似html的标签,this.$refs里对应的name下与打印出来的东西不一致,导致我很困惑,为什么如此之不一致。
就在我蒙了三天之后,我就想打印一下this.$refs.name的字符串,this.$refs.name[0]竟然不报错,
最后,完美解决。this.$refs.name[0].ref就可以拿到之前的东西。

后来,偶然看到了这个,当然会vue的大神们不要嘲笑,这篇就是为了分享给那些同我一样,没有vue开发经验硬写app的彩笔们。

收起阅读 »

请教一个技术支持(外包)的问题

外包

各位开发者大神,我使用标准H5开发网站,并使用HBUILDER进行了打包,安卓APP是没有问题,用的挺好。
之前注册了苹果的开发者,使用证书打包,上传平台,苹果审核4.2,APP太简单,没有原生功能,没有通过审核。
现在我想请教
1.基于我现有的网站构架,加一些原生功能,适当丰富一下APP(其实主要是为了IOS过审)。

  1. 有没有相关的外包机构可以帮忙做,大约多少钱
    谢谢各位了
继续阅读 »

各位开发者大神,我使用标准H5开发网站,并使用HBUILDER进行了打包,安卓APP是没有问题,用的挺好。
之前注册了苹果的开发者,使用证书打包,上传平台,苹果审核4.2,APP太简单,没有原生功能,没有通过审核。
现在我想请教
1.基于我现有的网站构架,加一些原生功能,适当丰富一下APP(其实主要是为了IOS过审)。

  1. 有没有相关的外包机构可以帮忙做,大约多少钱
    谢谢各位了
收起阅读 »

android 插件 新增 activity

因需要自定义UI界面,在此记录,供遇到同样问题的伙伴作参考:

第1步:MyModule extends WXSDKEngine.DestroyableModule

第2步:Intent intent = new Intent(this.mWXSDKInstance.getContext(), MyActivity.class); mActivity.startActivityForResult(intent, 100);

第3步:MyActivity extends Activity;此处切记继承Activity,不能继承其它扩展的activity,否则会导致界面不展示,程序异常

第4步:在androidmanifest.xml添加权限,添加MyActivity节点

第5步:打成aar包发布

继续阅读 »

因需要自定义UI界面,在此记录,供遇到同样问题的伙伴作参考:

第1步:MyModule extends WXSDKEngine.DestroyableModule

第2步:Intent intent = new Intent(this.mWXSDKInstance.getContext(), MyActivity.class); mActivity.startActivityForResult(intent, 100);

第3步:MyActivity extends Activity;此处切记继承Activity,不能继承其它扩展的activity,否则会导致界面不展示,程序异常

第4步:在androidmanifest.xml添加权限,添加MyActivity节点

第5步:打成aar包发布

收起阅读 »

建议功能 alt + 单击‘自定义组件’标签。可以直接打开自定义组件的页面;

建议功能 alt + 单击‘自定义组件’标签。可以直接打开自定义组件的页面;类似PhpStorm alt +单击 类名称 时跳转到类的页面方便编辑

补充录屏 https://bug666.oss-cn-hangzhou.aliyuncs.com/%E6%9E%97%E4%B8%BE%EF%BD%9E%E5%85%A8%E6%A0%88APP%E8%BD%AF%E4%BB%B6%E5%B7%A5%E7%A8%8B%E5%B8%88%202020-01-01%2019.51.16.mp4

继续阅读 »

建议功能 alt + 单击‘自定义组件’标签。可以直接打开自定义组件的页面;类似PhpStorm alt +单击 类名称 时跳转到类的页面方便编辑

补充录屏 https://bug666.oss-cn-hangzhou.aliyuncs.com/%E6%9E%97%E4%B8%BE%EF%BD%9E%E5%85%A8%E6%A0%88APP%E8%BD%AF%E4%BB%B6%E5%B7%A5%E7%A8%8B%E5%B8%88%202020-01-01%2019.51.16.mp4

收起阅读 »

uni.navigateBack()返回时传递参数,最简单的办法!

页面传值

假如从B页面返回A页面:
var pages = getCurrentPages();
var prevPage = pages[pages.length - 2]; //上一个页面
prevPage.setData({
mdata:1
})
经过测试,在uni.app中使用B页面使用setData设置A页面参数无法实现(应该是被更改为常量属性了)。
打印console.log(prevPage)前一页面对象可得:

方法1:我们可以使用A页面原有方法
onHide: ƒ ()
onLoad: ƒ ()
onReady: ƒ ()
onResize: ƒ ()
onRouteEnd: ƒ ()
onShow: ƒ ()
onUnload: ƒ ()
options
......等传递参数。
B页面传递:
var object={
sx1:"参数1",
sx2:"参数2",
}
prevPage.onShow(object);
uni.navigateBack();
A页面接收参数:
onShow(object){
if(!!object){
console.log(object)
}
}

方法2:A页面自定义方法接收参数
B页面传递:
var object={
sx1:"参数1",
sx2:"参数2",
}
prevPage.$vm.otherFun(object);//重点$vm
uni.navigateBack();
A页面接收参数:
otherFun(object){
if(!!object){
console.log(object)
}
}

继续阅读 »

假如从B页面返回A页面:
var pages = getCurrentPages();
var prevPage = pages[pages.length - 2]; //上一个页面
prevPage.setData({
mdata:1
})
经过测试,在uni.app中使用B页面使用setData设置A页面参数无法实现(应该是被更改为常量属性了)。
打印console.log(prevPage)前一页面对象可得:

方法1:我们可以使用A页面原有方法
onHide: ƒ ()
onLoad: ƒ ()
onReady: ƒ ()
onResize: ƒ ()
onRouteEnd: ƒ ()
onShow: ƒ ()
onUnload: ƒ ()
options
......等传递参数。
B页面传递:
var object={
sx1:"参数1",
sx2:"参数2",
}
prevPage.onShow(object);
uni.navigateBack();
A页面接收参数:
onShow(object){
if(!!object){
console.log(object)
}
}

方法2:A页面自定义方法接收参数
B页面传递:
var object={
sx1:"参数1",
sx2:"参数2",
}
prevPage.$vm.otherFun(object);//重点$vm
uni.navigateBack();
A页面接收参数:
otherFun(object){
if(!!object){
console.log(object)
}
}

收起阅读 »

UNI利用vue-cli安装的项目sass报错的问题

sass vue_cli uniapp

UNI利用vue-cli安装的项目sass报错的问题,可以手动修改sass-loader的版本为"sass-loader": "^7.3.0",;cli安装的是最新版的会报错SassError: Invalid argument(s): Unsupported output style "nested".

继续阅读 »

UNI利用vue-cli安装的项目sass报错的问题,可以手动修改sass-loader的版本为"sass-loader": "^7.3.0",;cli安装的是最新版的会报错SassError: Invalid argument(s): Unsupported output style "nested".

收起阅读 »

2020年最新vuejs实战开发抖音app【百度盘免费分享】

Vue


获取方法:

1/首先麻烦您再此贴下留言

2/联系qq2119521240

3/视频说明:https://pan.baidu.com/s/1m_SNUCi98W7kKLgUQUaKBA

继续阅读 »


获取方法:

1/首先麻烦您再此贴下留言

2/联系qq2119521240

3/视频说明:https://pan.baidu.com/s/1m_SNUCi98W7kKLgUQUaKBA

收起阅读 »

unipush个推通道和华为通道的详细图文说明(上)

unipush

详细图请下载附件,图太多了,就不一个一个传了。以下是摘要。
也不知道附件穿上没,如果下载不了,记得找我。

新建uniapp工程

生成keystore

制作自定义调试基座

生成图标

修改两处权限(离线打包之前)

配置unipush后台先配置才能打包

自定义基座运行,找到cid,并发送消息
运行,运行到手机或模拟器,运行基座选择,勾选自定义调试基座
基础的透传测试,没有问题

华为离线推送,离线推送无法收到

设备信息
华为Nova4
9.1.0.257
华为移动服务 4.0.0.331 管理空间 清理数据,重置推送服务 清空缓存 打开进入程序

uniapp程序已彻底退出

创建透传消息
intent:#Intent;action=android.intent.action.oppopush;launchFlags=0x14000000;component=io.yunhntech.push/io.dcloud.PandoraEntry;S.UP-OL-SU=true;S.title=ceshi0;S.content=654321;S.payload=test;end

得不到任何信息,如果把uniapp程序启动后就可以得到信息,但是显示的是走个推渠道。

补一个图这个要弄好啊才能发消息

最后解决了
https://note.youdao.com/ynoteshare1/index.html?id=ac2c52fe65c992fb59a4f8a21ad7f703&type=note
感谢个推团队的对应,态度也好,还不收费。

有一句话就是,必须是经过的包的apk安装才可以,自定义基座不行!!!云打包,删除自定义基座的程序,安装apk,重启手机。

确保apk的程序没有运行。我这个居然运行了。。。。
然后熄灭屏幕,把手机放远点,还不要插电。

发个消息。

哔。。。。。。
好了,客户端和配置到此为止,下面还有服务器端,和小米等第三方厂商的配置。

我跟你们讲,我都不敢多试,我怕不好使,不说了,再试试。

继续阅读 »

详细图请下载附件,图太多了,就不一个一个传了。以下是摘要。
也不知道附件穿上没,如果下载不了,记得找我。

新建uniapp工程

生成keystore

制作自定义调试基座

生成图标

修改两处权限(离线打包之前)

配置unipush后台先配置才能打包

自定义基座运行,找到cid,并发送消息
运行,运行到手机或模拟器,运行基座选择,勾选自定义调试基座
基础的透传测试,没有问题

华为离线推送,离线推送无法收到

设备信息
华为Nova4
9.1.0.257
华为移动服务 4.0.0.331 管理空间 清理数据,重置推送服务 清空缓存 打开进入程序

uniapp程序已彻底退出

创建透传消息
intent:#Intent;action=android.intent.action.oppopush;launchFlags=0x14000000;component=io.yunhntech.push/io.dcloud.PandoraEntry;S.UP-OL-SU=true;S.title=ceshi0;S.content=654321;S.payload=test;end

得不到任何信息,如果把uniapp程序启动后就可以得到信息,但是显示的是走个推渠道。

补一个图这个要弄好啊才能发消息

最后解决了
https://note.youdao.com/ynoteshare1/index.html?id=ac2c52fe65c992fb59a4f8a21ad7f703&type=note
感谢个推团队的对应,态度也好,还不收费。

有一句话就是,必须是经过的包的apk安装才可以,自定义基座不行!!!云打包,删除自定义基座的程序,安装apk,重启手机。

确保apk的程序没有运行。我这个居然运行了。。。。
然后熄灭屏幕,把手机放远点,还不要插电。

发个消息。

哔。。。。。。
好了,客户端和配置到此为止,下面还有服务器端,和小米等第三方厂商的配置。

我跟你们讲,我都不敢多试,我怕不好使,不说了,再试试。

收起阅读 »

uniapp+thinkphp6实战开发【简书】app+小程序

uniapp 教程

这个课程我买了确实不错,有前端开发和后台开发,讲解非常细致
关键是参加完活动基本就不用花钱了
而且在这个贴子下留言的还能多省20
uniapp+thinkphp6实战开发【简书】app+小程序

继续阅读 »

这个课程我买了确实不错,有前端开发和后台开发,讲解非常细致
关键是参加完活动基本就不用花钱了
而且在这个贴子下留言的还能多省20
uniapp+thinkphp6实战开发【简书】app+小程序

收起阅读 »