apicloud使用
入口文件
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,initial-scale=1.0,width=device-width" />
<meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
<title>Hello APP</title>
</head>
<body class="wrap">
<header></header>
<section class="flex-1">
</section>
<footer></footer>
</body>
<script type="text/javascript" src="./script/api.js"></script>
<script type="text/javascript">
apiready = function() {
//输出Log，Log将显示在APICloud Studio控制台
console.log("Hello World! Hello APICloud!");
var header = $api.dom('header'); // 获取 header 标签元素
var footer = $api.dom('footer'); // 获取 footer 标签元素
// 1.修复开启沉浸式效果带来的顶部Header与手机状态栏重合的问题，最新api.js方法已支持适配iPhoneX；
// 2.默认已开启了沉浸式效果 config.xml中 <preference name="statusBarAppearance" value="true"/>
// 3.沉浸式效果适配支持iOS7+，Android4.4+以上版本
var headerH = $api.fixStatusBar(header);
// 最新api.js为了适配iPhoneX增加的方法，修复底部Footer部分与iPhoneX的底部虚拟横条键重叠的问题；
var footerH = $api.fixTabBar(footer);
api.setStatusBarStyle({
style: 'light'
});
api.setStatusBarStyle({
color: '#363636'
});
var mam = api.require('mam');
mam.checkUpdate(function(ret, err) {
if (ret) {
// alert(JSON.stringify(ret));
} else {
// alert(JSON.stringify(err));
}
});
api.openFrame({
name: 'main',
url: 'http://test.zhongzhew.com',
bounces: true,
rect: { // 推荐使用Margin布局，用于适配屏幕的动态变化
marginTop: headerH, // main页面距离win顶部的高度
marginBottom: footerH, // main页面距离win底部的高度
w: 'auto' // main页面的宽度 自适应屏幕宽度
}
});
};
</script>
</html>
xml配置
<widget id="A6099783276798" version="0.0.1">
<name>钱之家</name>
<description>
Example For APICloud.
</description>
<author email="[email protected]" href="http://www.apicloud.com">
Developer
</author>
<content src="index.html"/>
<access origin="*"/>
<preference name="pageBounce" value="false"/>
<preference name="appBackground" value="rgba(0,0,0,0.0)"/>
<preference name="windowBackground" value="rgba(0,0,0,0.0)"/>
<preference name="frameBackgroundColor" value="rgba(0,0,0,0.0)"/>
<preference name="hScrollBarEnabled" value="false"/>
<preference name="vScrollBarEnabled" value="false"/>
<preference name="autoLaunch" value="true"/>
<preference name="fullScreen" value="false"/>
<preference name="autoUpdate" value="true"/>
<preference name="smartUpdate" value="false"/>
<preference name="debug" value="true"/>
<preference name="statusBarAppearance" value="true"/>
<permission name="readPhoneState"/>
<permission name="camera"/>
<permission name="record"/>
<permission name="location"/>
<permission name="fileSystem"/>
<permission name="internet"/>
<permission name="bootCompleted"/>
<permission name="hardware"/>
<preference name="statusBarAppearance" value="false"/>
<preference name="iOS7StatusBarAppearance" value="true"/>
</widget>
apicloud 配置说明
线上配置 Android证书
增加对应模块 测试的时候使用 [模块]>[自定义loader]
微信登录 wx v1.1.2: https://www.apicloud.com/mod_detail/89053 在文件config.xml的widget里面添加/修改
<!-- 配置微信登录 -->
<feature name="wx">
<param name="urlScheme" value="wx0668dea32d5xxxxx"/>
<param name="apiKey" value="wx0668dea32d5xxxxx"/>
<param name="apiSecret" value="67e56447e040acbcef0d0e809bcxxxxx"/>
</feature>
qq登录 QQPlus v1.0.7: https://www.apicloud.com/mod_detail/76943 在文件config.xml的widget里面添加/修改
<!-- 配置qq登录 -->
<feature name="QQPlus">
<param name="urlScheme" value="tencent1105648239"/>
<param name="apiKey" value="1105648239"/>
</feature>
完整配置
<widget id="A6012591364670" version="0.0.1">
<name>tk</name>
<description>
tk system
</description>
<author email="[email protected]" href="http://www.apicloud.com">
Developer
</author>
<content src="index.html"/>
<access origin="*"/>
<preference name="pageBounce" value="true"/>
<preference name="appBackground" value="rgba(0,0,0,0.0)"/>
<preference name="windowBackground" value="rgba(0,0,0,0.0)"/>
<preference name="frameBackgroundColor" value="rgba(0,0,0,0.0)"/>
<preference name="hScrollBarEnabled" value="false"/>
<preference name="vScrollBarEnabled" value="false"/>
<preference name="autoLaunch" value="true"/>
<preference name="fullScreen" value="false"/>
<preference name="autoUpdate" value="true"/>
<preference name="smartUpdate" value="false"/>
<preference name="debug" value="false"/>
<permission name="readPhoneState"/>
<permission name="call"/>
<permission name="sms"/>
<permission name="camera"/>
<permission name="record"/>
<permission name="location"/>
<permission name="fileSystem"/>
<permission name="internet"/>
<permission name="bootCompleted"/>
<permission name="hardware"/>
<permission name="contact"/>
<!-- 配置qq登录 -->
<feature name="QQPlus">
<param name="urlScheme" value="tencent110564xxxx"/>
<param name="apiKey" value="110564xxxx"/>
</feature>
<preference name="querySchemes" value="mqq,mqqapi"/>
<!-- 配置微信登录 -->
<feature name="wx">
<param name="urlScheme" value="wx0668dea32d53xxxx"/>
<param name="apiKey" value="wx0668dea32d53xxxx"/>
<param name="apiSecret" value="67e56447e040acbcef0d0e809bc1xxxx"/>
</feature>
<!-- 状态栏沉浸 -->
<preference name="iOS7StatusBarAppearance" value="true" />
<preference name="statusBarAppearance" value="true"/>
<!-- 禁止页面弹动 -->
<preference name="pageBounce" value="false" />
</widget>
内置浏览器打开网站
function openApp() {
api.openApp({
androidPkg: 'android.intent.action.VIEW',
mimeType: 'text/html',
uri: 'https://pay.x.cn/Admin/index/init'
}, function(ret, err) {
var msg = JSON.stringify(ret);
api.alert({
title: 'openApp',
msg: msg,
buttons: ['确定']
});
});
}