react-native: ios原生调用js方法

JavaScript012

react-native: ios原生调用js方法,第1张

ReactEventEmit.h

#import <React/RCTEventEmitter.h>

#import <React/RCTBridgeModule.h>

@interface ReactEventEmit : RCTEventEmitter<RCTBridgeModule>

-(void)goToCashier:(NSString*) result

@end

ReactEventEmit.m

#import "ReactEventEmit.h"

@implementation ReactEventEmit

@synthesize bridge = _bridge

RCT_EXPORT_MODULE(ReactEventEmit)

+ (id)allocWithZone:(NSZone*)zone {

    staticReactEventEmit*sharedInstance =nil

    staticdispatch_once_tonceToken

    dispatch_once(&onceToken, ^{

        sharedInstance = [superallocWithZone:zone]

    })

    returnsharedInstance

}

-(NSArray *)supportedEvents{

    return @[@"goToCashier"]

}

-(void)goToCashier:(NSString*) result

{

    NSLog(@"======== cashierSuccess ========== %@",result)

    [self sendEventWithName:@"goToCashier" body:@{@"result": result}]

}

@end

RN的module初始化是由RN内部实现的,所以我们调用这个实例的时候,必须是这样子:

ReactEventEmit *emit = [ReactEventEmit allocWithZone:nil]

 [emit goToCashier:@"fail"]

JS端调用:

const ReactEventEmit = NativeModules.ReactEventEmit

const myReactEventEmit = new NativeEventEmitter(ReactEventEmit)

this.listener = myReactEventEmit.addListener('goToCashier', (data: { result: string }) =>{

        console.warn('====== cashierSuccess ======= ' + JSON.stringify(data))

        this.process(data.result)

      })

项目使用React 开发 作为微信企业号应用 需要的功能为 获取地理位置信息

在public文件夹下的 Index.html 中引入 ,放在title标签下即可

其中 比较重要的是 signature

signature 需要通过 后端接口 访问微信的 api 获取 access_token 后获取 jsapiTicket

拼接结束后 使用 SHA1算法加密后传回 即是可用的 signature

后端获取 signature 接口

signature 拼接时候需严格按照 如下格式进行拼接

在IOS客户端 和 ANDROID中 url 参数略有不同

IOS客户端中 需要的是 页面的根路径

ANDROID客户单中需要的是当前页面的路径

注意: api 调用为单个应用每小时最多100次 实际测试可能小于100 接口就会无法相应 应当保存 jsapi_ticket避免频繁请求(本业务压力有限没有做处理)

java Spring-boot实现

使用函数式先注册config

调用地理位置信息

先引入config 注册函数 再使用window.wx.接口名称即可调用