如何快速将 APICloud 应用转换为微信公众号?

549 阅读4分钟

现在,APICloud 应用,可以一键生成微信公众号!

APICloud 基于积淀已久的 iOS/Android 原生引擎开发技术,结合微信公众号运行环境的特点,针对性地推出了为其量身定制的适配器环境,任何标准 APICloud 应用,都可以在不修改或极小修改之后,直接运行在微信环境中。

基于 APICloud 应用生成的微信公众号,开发者可直接获取源码,部署到自己服务器上。核心配置文件,开发者可根据服务器环境需要,灵活修改。最重要的是: 为了便于开发者二次开发或与微信业务进一步对接,我们提供了足够开放和灵活的自定义扩展机制,开发者可根据业务需要,重写任意 APICloud 模块的内部实现。

步骤

1. 登录 APICloud 网站控制台,选择或新建一个 Native 原生应用.

2. 点击 "云编译"页面的 "一键生成微信公众号"

3. 点击 "一键生成微信公众号"按钮,等待编译完成.

4. 部署

把云编译生成的压缩包,解压放到网站静态资源根目录,然后就可以通过类似

www.exapmle.com/A6055344415…

一类的值来访问.其中 A6055344415623 要替换为自己应用的 appId.如果不想放在网站根目录,需要对应修改web_adapter/script/config.js中的相关配置.

5. 跨域访问问题

No 'Access-Control-Allow-Origin' header is present on the requested resource.

如果控制台出现类似错误,说明当前预览微信公众号的网站与服务器接口不在同一个域名下,有两种解决方案:

  1. 修改服务器端接口设置,允许跨域访问.
  2. 将云编译生成的静态资源包放置在到网络接口所在的服务器,保证二者可以在同一域名下访问.

6. 原生模块适配问题

APICloud 现在可以自动适配原 APICloud 原生 App 中标准 WEB 技术相关的逻辑.涉及到使用 APICloud 原生模块的地方,还需要开发者自行定制开发.

为了保持代码写法的一致,我们提供了和 APICloud 原生引擎类似的扩展机制,开发者可基于此重写 APICloud 原生模块的相关逻辑.

开发者原有代码一般不需要做修改,只需要依照我们提供的扩展机制,针对性地添加部分原生模块的扩展代码,即可实现微信公众号的适配.详见下文 "扩展" 部分

扩展

APICloud 微信公众号适配器, 基于纯 Web 技术, 并针对微信的 Web 环境,有所优化.在接口实现上, 与 APICloud Native 引擎保持一致.基于此, 任意标准 APICloud 原生应用,都可以极低成本,迭代为微信公众号,甚至标准的网页应用.

APICloud 微信公众号适配器,在实现时,做了最大程度的开放性和灵活性设计.我们允许开发者重写任意 APICloud API 引擎对象或原生模块的任意方法和属性.

任意界面,只需要实现一个 apiadapter 方法,就可以在此方法内,拦截和重写 APICloud 模块方法的具体实现.

/*
当 frame, window, adapter 级别同时实现此函数时,
加载优先级为: frame > window > adapter > 内置默认实现

@payload:
@moduleName 模块名.
@method     方法名.
@isSync     是否是同步方法.
@params     调用模块方法时的参数.
@frameDom   frame 所在的 window dom对象.
@winDom     window 所在页面的 window dom 对象.
@apiDom     adapter 所在页面的 window dom 对象.
@cbId       调用模块方法时,传递的回调函数的唯一标识.
@callback   用于异步返回值的回调函数.(cbId, ret, err, del)=>{}
@cbId   调用模块方法时,传递的回调函数的唯一标识.
@ret    模块返回值.
@err    错误信息.
@del    调用后,是否删除此 cbId 对应的回调函数.
删除后,下一次基于同一 cbId调用callback,
将无法正确回传返回值.

@return: 不作处理.如果不想处理某个模块方法, 应该显式返回字符串 'TO_NEXT_API_ADAPTER',
以便往上传播调用.
*/
function apiadapter(payload) {
/* TODO: 自定义的处理逻辑. */

/* 默认不作处理. */
return "TO_NEXT_API_ADAPTER";
}

扩展建议

  • 异步方法的返回值,最好通过传入的callback和cbId传递.
  • 同步方法的返回值,可以直接 return 返回相关值.
  • 在处理 UI 类模块时,可在模块方法调用时添加一些自定义字段,以便于 apiadapter 能正确处理 UI 类模块的位置.如添加一个新的 parentDomId 字段,以便能自定义指定模块的父元素.