HBuilderX

HBuilderX

极客开发工具
uni-app

uni-app

开发一次,多端覆盖
uniCloud

uniCloud

云开发平台
HTML5+

HTML5+

增强HTML5的功能体验
MUI

MUI

上万Star的前端框架

uni-app 支付宝小程序如何使用 mqtt

uniapp

uni-app 支付宝小程序如何使用 mqtt

uni-app 支付宝小程序如何使用 mqtt

团队开发APP、APP定制开发

App 移动APP

app开发

  1. 需求整理
  2. 预算评估
  3. 原型设计
  4. UI设计
  5. 开发
  6. 测试调试
  7. 发布到应用市场
  8. 运营迭代
  9. 日常维护

app开发

  1. 需求整理
  2. 预算评估
  3. 原型设计
  4. UI设计
  5. 开发
  6. 测试调试
  7. 发布到应用市场
  8. 运营迭代
  9. 日常维护

HBuilderX报错【插件xx下载错误,请检查网络是否正常!】的解决方法,可自己手动安装

HBuilderX报错【插件xx下载错误,请检查网络是否正常!】的解决方法,可自己手动安装 我写了一个教程,我自己摸索出来的,
你们可以看下:
https://www.jianshu.com/p/f084d1ff5302

HBuilderX报错【插件xx下载错误,请检查网络是否正常!】的解决方法,可自己手动安装 我写了一个教程,我自己摸索出来的,
你们可以看下:
https://www.jianshu.com/p/f084d1ff5302

【分享】uniapp打包后html文件里标签不要移除引号

uniapp

在项目根目录新建vue.config.js,添加如下代码。

 chainWebpack: config => {  
        //通过运行 vue inspect plugins 的值html插件别名。。  
        config.plugin('html-index').tap(args => {  
            args[0].minify = {  
                removeAttributeQuotes: false  
            }  
            return args  
        })  
    },

之前按照vue官方文档查的说添加
有的说添加

config.plugin('html').tap

报错说

TypeError: Cannot set property 'minify' of undefined

通过运行

vue inspect plugins

看到插件列表,htmlWebpackPlugin别名改成了html-index

继续阅读 »

在项目根目录新建vue.config.js,添加如下代码。

 chainWebpack: config => {  
        //通过运行 vue inspect plugins 的值html插件别名。。  
        config.plugin('html-index').tap(args => {  
            args[0].minify = {  
                removeAttributeQuotes: false  
            }  
            return args  
        })  
    },

之前按照vue官方文档查的说添加
有的说添加

config.plugin('html').tap

报错说

TypeError: Cannot set property 'minify' of undefined

通过运行

vue inspect plugins

看到插件列表,htmlWebpackPlugin别名改成了html-index

收起阅读 »

动态设置原生导航栏搜索框中的placeholder的提示内容

导航栏 App入门

为什么要动态设置原生导航栏搜索框中placeholder的提示内容呢?

一般原生导航栏搜索框中placeholder的提示内容是在pages.json中app-plus中设置,就相当于默认值,偶尔业务需求可能要改变值

需求:
大多数商城商品搜索框placeholder中都会自动显示一些热搜商品名称,
点击搜索后这些热搜商品可以直接进行搜索,可以有效提高用户对某一系列产品的搜索率

实现方法:

       //这个操作一般放在 onLoad 函数中  

       uni.request({ //发起网络请求  
                url: 'https://xxx.xxx.com,   //要显示的文字数据接口  
                success: (res) => {  
                 console.log(res.data);  
                    this.value = res.data.title   //将请求结果赋值data函数中定义的vlaue值中  
                    var _this=this   //这个我知道你懂的  
                    let webview = this.$mp.page.$getAppWebview();  //获取当前窗口实例  
                            webview.setStyle({'titleNView':{"searchInput": { //修改当前窗口search样式  
                                                                      "placeholder": _this.value,  
                                     }    
                    }})   
                } //成功回调结束  
            });

我也是uni-app小白一枚,有不对的地方各位多多指教

想学吗,我教你呀!保你会

继续阅读 »

为什么要动态设置原生导航栏搜索框中placeholder的提示内容呢?

一般原生导航栏搜索框中placeholder的提示内容是在pages.json中app-plus中设置,就相当于默认值,偶尔业务需求可能要改变值

需求:
大多数商城商品搜索框placeholder中都会自动显示一些热搜商品名称,
点击搜索后这些热搜商品可以直接进行搜索,可以有效提高用户对某一系列产品的搜索率

实现方法:

       //这个操作一般放在 onLoad 函数中  

       uni.request({ //发起网络请求  
                url: 'https://xxx.xxx.com,   //要显示的文字数据接口  
                success: (res) => {  
                 console.log(res.data);  
                    this.value = res.data.title   //将请求结果赋值data函数中定义的vlaue值中  
                    var _this=this   //这个我知道你懂的  
                    let webview = this.$mp.page.$getAppWebview();  //获取当前窗口实例  
                            webview.setStyle({'titleNView':{"searchInput": { //修改当前窗口search样式  
                                                                      "placeholder": _this.value,  
                                     }    
                    }})   
                } //成功回调结束  
            });

我也是uni-app小白一枚,有不对的地方各位多多指教

想学吗,我教你呀!保你会

收起阅读 »

宿主App与小程序相互通讯

小程序SDK unimpsdk

请移步 新的文档。此文档以停止更新

宿主App与小程序相互通讯

注:2.6.10 版本开始支持此功能

宿主 App 向小程序发送事件

iOS 平台

API

Class DCUniMPSDKEngine.h  
/// 向小程序发送事件  
/// @param event 事件名称  
/// @param data 数据:NSString 或 NSDictionary 类型  
+ (void)sendUniMPEvent:(NSString *)event data:(id)data;

示例

[DCUniMPSDKEngine sendUniMPEvent:@"NativeEvent" data:@{@"msg":@"native message"}];

Android 平台

API

DCUniMPSDK.getInstance().sendUniMPEvent(event, data)

参数说明

参数 类型 必填 说明
event String 触发事件的event
data String或JSON 事件的携带参数

返回值

类型 说明
boolean true表示事件通知成功。false表示失败。可通过log查看。

示例

JSONObject data = new JSONObject();  
data.put("sj", "点击了关于");  
DCUniMPSDK.getInstance().sendUniMPEvent("gy", data);

小程序平台

监听宿主App发送事件

示例

uni.onNativeEventReceive((event,data)=>{  
    console.log('接收到宿主App消息:' + event + data);  
    this.nativeMsg = '接收到宿主App消息 event:' + event + " data: " + data;  
})

参数说明

属性 类型 说明
event String 事件名称
data String / JsonObject 宿主传递的数据

小程序向宿主 App 发送事件

小程序平台

API

向宿主App发送事件

uni.sendNativeEvent(event,callback)

参数说明

属性 类型 说明
event String 事件名称
callback Function 宿主App回调方法,参数可以是 String 或 JsonObject,取决于宿主的实现

示例

// 向宿主App发送事件  
uni.sendNativeEvent('unimp-event', {  
    msg: 'unimp message!!!'  
}, ret => {  
    this.nativeMsg = '宿主App回传的数据:' + ret;  
})

iOS 平台

当接收到小程序发送的事件会触发 DCUniMPSDKEngineDelegate 的协议方法,需宿主App实现该方法

协议方法说明

/// 监听小程序向原生发送事件方法  
/// @param event 事件名称  
/// @param data 数据:NSString 或 NSDictionary 类型  
/// @param callback 回调数据给小程序  
- (void)onUniMPEventReceive:(NSString *)event data:(id)data callback:(DCUniMPKeepAliveCallback)callback;  

DCUniMPKeepAliveCallback 说明  
/// 回调数据给小程序的 block 定义  
/// result:回调参数支持 NSString 或 NSDictionary 类型  
/// keepAlive:如果 keepAlive 为 YES,则可以多次回调数据给小程序,反之触发一次后回调方法即被移除  
typedef void (^DCUniMPKeepAliveCallback)(id result, BOOL keepAlive);  

示例

/// 监听小程序发送的事件方法  
- (void)onUniMPEventReceive:(NSString *)event data:(id)data callback:(DCUniMPKeepAliveCallback)callback {  

    NSLog(@"Receive UniMP event: %@ data: %@",event,data);  

    // 回传数据给小程序  
    // DCUniMPKeepAliveCallback 用法请查看定义说明  
    if (callback) {  
        callback(@"native callback message",NO);  
    }  
}

Android 平台

API

DCUniMPSDK.getInstance().setOnUniMPEventCallBack(callBack)
设置监听小程序发送给宿主的事件

参数说明

参数 类型 必填 说明
callBack IOnUniMPEventCallBack 小程序触发event事件接口

返回值

示例

DCUniMPSDK.getInstance().setOnUniMPEventCallBack(new DCUniMPSDK.IOnUniMPEventCallBack() {  
    @Override  
    public void onUniMPEventReceive(String event, Object data, DCUniMPJSCallback callback) {  
        Log.d("cs", "onUniMPEventReceive    event="+event);  
        //回传数据给小程序  
        callback.invoke( "收到消息");  
    }  
});
继续阅读 »

请移步 新的文档。此文档以停止更新

宿主App与小程序相互通讯

注:2.6.10 版本开始支持此功能

宿主 App 向小程序发送事件

iOS 平台

API

Class DCUniMPSDKEngine.h  
/// 向小程序发送事件  
/// @param event 事件名称  
/// @param data 数据:NSString 或 NSDictionary 类型  
+ (void)sendUniMPEvent:(NSString *)event data:(id)data;

示例

[DCUniMPSDKEngine sendUniMPEvent:@"NativeEvent" data:@{@"msg":@"native message"}];

Android 平台

API

DCUniMPSDK.getInstance().sendUniMPEvent(event, data)

参数说明

参数 类型 必填 说明
event String 触发事件的event
data String或JSON 事件的携带参数

返回值

类型 说明
boolean true表示事件通知成功。false表示失败。可通过log查看。

示例

JSONObject data = new JSONObject();  
data.put("sj", "点击了关于");  
DCUniMPSDK.getInstance().sendUniMPEvent("gy", data);

小程序平台

监听宿主App发送事件

示例

uni.onNativeEventReceive((event,data)=>{  
    console.log('接收到宿主App消息:' + event + data);  
    this.nativeMsg = '接收到宿主App消息 event:' + event + " data: " + data;  
})

参数说明

属性 类型 说明
event String 事件名称
data String / JsonObject 宿主传递的数据

小程序向宿主 App 发送事件

小程序平台

API

向宿主App发送事件

uni.sendNativeEvent(event,callback)

参数说明

属性 类型 说明
event String 事件名称
callback Function 宿主App回调方法,参数可以是 String 或 JsonObject,取决于宿主的实现

示例

// 向宿主App发送事件  
uni.sendNativeEvent('unimp-event', {  
    msg: 'unimp message!!!'  
}, ret => {  
    this.nativeMsg = '宿主App回传的数据:' + ret;  
})

iOS 平台

当接收到小程序发送的事件会触发 DCUniMPSDKEngineDelegate 的协议方法,需宿主App实现该方法

协议方法说明

/// 监听小程序向原生发送事件方法  
/// @param event 事件名称  
/// @param data 数据:NSString 或 NSDictionary 类型  
/// @param callback 回调数据给小程序  
- (void)onUniMPEventReceive:(NSString *)event data:(id)data callback:(DCUniMPKeepAliveCallback)callback;  

DCUniMPKeepAliveCallback 说明  
/// 回调数据给小程序的 block 定义  
/// result:回调参数支持 NSString 或 NSDictionary 类型  
/// keepAlive:如果 keepAlive 为 YES,则可以多次回调数据给小程序,反之触发一次后回调方法即被移除  
typedef void (^DCUniMPKeepAliveCallback)(id result, BOOL keepAlive);  

示例

/// 监听小程序发送的事件方法  
- (void)onUniMPEventReceive:(NSString *)event data:(id)data callback:(DCUniMPKeepAliveCallback)callback {  

    NSLog(@"Receive UniMP event: %@ data: %@",event,data);  

    // 回传数据给小程序  
    // DCUniMPKeepAliveCallback 用法请查看定义说明  
    if (callback) {  
        callback(@"native callback message",NO);  
    }  
}

Android 平台

API

DCUniMPSDK.getInstance().setOnUniMPEventCallBack(callBack)
设置监听小程序发送给宿主的事件

参数说明

参数 类型 必填 说明
callBack IOnUniMPEventCallBack 小程序触发event事件接口

返回值

示例

DCUniMPSDK.getInstance().setOnUniMPEventCallBack(new DCUniMPSDK.IOnUniMPEventCallBack() {  
    @Override  
    public void onUniMPEventReceive(String event, Object data, DCUniMPJSCallback callback) {  
        Log.d("cs", "onUniMPEventReceive    event="+event);  
        //回传数据给小程序  
        callback.invoke( "收到消息");  
    }  
});
收起阅读 »

优雅解决H5前端跨域请求

跨域请求

最近在做UNI项目,编译为H5,部署到自己的服务器时,出现了一个很蛋疼的问题:

**has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource**

这不就是万恶的跨域么?但奇葩的是,在前端代码所在服务器上curl接口地址,是可以ping通的哦。
第一想法,上UNI官网看看,毕竟官网的意见还是相对权威的,总结官网的观点就是2句话:

方案1:最利索的,当然还是将前端代码和后端接口部署在同域的web服务器上。
方案2:由后台服务器配置策略,设为允许跨域访问。

第1种方案不可行,接口服务器是客户的,不为我们所用。
第2种方案,后台服务器已经开放了跨域限制了,可H5页面还是请求不到。。。

官方不行,那就百度、谷歌走一通,大部分的回答都是配置devServer,范例如下:
"h5": {
"devServer": {
"port": 8000,
"disableHostCheck": true,
"proxy": {
"/dpc": {
"target": "http://dpc.dapeis.net",
"changeOrigin": true,
"secure": false
}
}
}
}
我欣喜若狂地尝试了一通,结果TMM,还是不行。。。说实在的 我实在想不通这样配置,是怎么实现了代理的。。。(麻烦有识之士留言)
如是乎,我去吃个饭,洗个澡,冷静了一下,,,出来后脑子灵光一闪,我把接口地址指向前端代码所在服务器A,再由A通过nginx转向到正式的接口服务器,不就好了。。。
激动时刻来了,还真的可以访问了。。。特此留言,兴许能帮到后期遇到同样问题的同行。。。

PS:诚接各类软件定制开发

继续阅读 »

最近在做UNI项目,编译为H5,部署到自己的服务器时,出现了一个很蛋疼的问题:

**has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource**

这不就是万恶的跨域么?但奇葩的是,在前端代码所在服务器上curl接口地址,是可以ping通的哦。
第一想法,上UNI官网看看,毕竟官网的意见还是相对权威的,总结官网的观点就是2句话:

方案1:最利索的,当然还是将前端代码和后端接口部署在同域的web服务器上。
方案2:由后台服务器配置策略,设为允许跨域访问。

第1种方案不可行,接口服务器是客户的,不为我们所用。
第2种方案,后台服务器已经开放了跨域限制了,可H5页面还是请求不到。。。

官方不行,那就百度、谷歌走一通,大部分的回答都是配置devServer,范例如下:
"h5": {
"devServer": {
"port": 8000,
"disableHostCheck": true,
"proxy": {
"/dpc": {
"target": "http://dpc.dapeis.net",
"changeOrigin": true,
"secure": false
}
}
}
}
我欣喜若狂地尝试了一通,结果TMM,还是不行。。。说实在的 我实在想不通这样配置,是怎么实现了代理的。。。(麻烦有识之士留言)
如是乎,我去吃个饭,洗个澡,冷静了一下,,,出来后脑子灵光一闪,我把接口地址指向前端代码所在服务器A,再由A通过nginx转向到正式的接口服务器,不就好了。。。
激动时刻来了,还真的可以访问了。。。特此留言,兴许能帮到后期遇到同样问题的同行。。。

PS:诚接各类软件定制开发

收起阅读 »

uni.uploadFile ios端携带from-data php就接收失败Array\n(\n)\n 其他端没问题已经解决

ios端携带from-data name参数不是'file' , php 就接收不到信息 Array\n(\n)\n
ios端 name 参数改为file php 就可以正常接收

ios端携带from-data name参数不是'file' , php 就接收不到信息 Array\n(\n)\n
ios端 name 参数改为file php 就可以正常接收

苹果应用上传TestFlight安装测试教程

上架 iOS iOS打包

通过本篇教程,可以学习到ios证书申请和打包ipa上传到App Store进行TestFlight测试的流程!

TestFlight测试分内部及外部测试,针对没有上架的app,可以通过此方式安装到手机测试。

内部测试(上传即可测试):通过测试码安装,一个码安装一个手机。

外部测试(上传后需通过审核):通过一个链接跳转到TestFlight应用安装,有效期限90天,安装数量1万台。

TestFlight上架App Store审核分7步进行,需要注册一个苹果的开发者账号才能操作

1、安装iOS证书申请辅助软件Appuploader

2、申请iOS发布证书(p12)

3、申请iOS发布描述文件(mobileprovision)

4、打包ipa

5、上传ipa到iTunes Connect

6、申请TestFlight内部测试及外部测试

详细图文请看

https://blog.csdn.net/qtb58/article/details/105163258

继续阅读 »

通过本篇教程,可以学习到ios证书申请和打包ipa上传到App Store进行TestFlight测试的流程!

TestFlight测试分内部及外部测试,针对没有上架的app,可以通过此方式安装到手机测试。

内部测试(上传即可测试):通过测试码安装,一个码安装一个手机。

外部测试(上传后需通过审核):通过一个链接跳转到TestFlight应用安装,有效期限90天,安装数量1万台。

TestFlight上架App Store审核分7步进行,需要注册一个苹果的开发者账号才能操作

1、安装iOS证书申请辅助软件Appuploader

2、申请iOS发布证书(p12)

3、申请iOS发布描述文件(mobileprovision)

4、打包ipa

5、上传ipa到iTunes Connect

6、申请TestFlight内部测试及外部测试

详细图文请看

https://blog.csdn.net/qtb58/article/details/105163258

收起阅读 »

如何在windows 更好的调试 IOS 的 App

如题 ,之前用 mac 来 开发 uni-app 的 ios 应用方便, 但是现在切换到 windows, 怎么更好的调试 IOS 应用。

有没有详细的教程或者 说明。 例如 自定义基座可以 用连wifi 进行 热调试

HubilderX 的自定义基座也打了【ios的测试证书】,但是接下来怎么做不太清楚

继续阅读 »

如题 ,之前用 mac 来 开发 uni-app 的 ios 应用方便, 但是现在切换到 windows, 怎么更好的调试 IOS 应用。

有没有详细的教程或者 说明。 例如 自定义基座可以 用连wifi 进行 热调试

HubilderX 的自定义基座也打了【ios的测试证书】,但是接下来怎么做不太清楚

收起阅读 »

插件市场的payment-monitor插件无法多次会响应的问题

uniapp插件

详细问题描述

上传发帖,让我找到插件原作者提供相关代码,已经找到作者,并让对方提供了响应js 对调部分的代码,原贴为:

https://ask.dcloud.net.cn/question/91199

问题为插件部分多次响应js 的回调参数,但是 uni 这边无法收到回调,重现版本为: HBuilderX 2.6.6

附上插件部分代码:


继续阅读 »

详细问题描述

上传发帖,让我找到插件原作者提供相关代码,已经找到作者,并让对方提供了响应js 对调部分的代码,原贴为:

https://ask.dcloud.net.cn/question/91199

问题为插件部分多次响应js 的回调参数,但是 uni 这边无法收到回调,重现版本为: HBuilderX 2.6.6

附上插件部分代码:


收起阅读 »