首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

object c和js交互

Objective-C(OC)与JavaScript(JS)交互主要涉及到在iOS应用中使用WebView来加载网页,并通过JavaScriptCore框架实现两者之间的通信。以下是关于这一交互的基础概念、优势、类型、应用场景以及常见问题和解决方案的详细解答。

基础概念

Objective-C:一种面向对象的编程语言,主要用于iOS和macOS应用的开发。

JavaScript:一种脚本语言,广泛用于网页和网络应用的交互逻辑。

WebView:iOS中的UIWebView或WKWebView组件,用于在应用内显示网页内容。

JavaScriptCore:iOS 7及以上版本提供的框架,允许Objective-C代码与JavaScript代码直接交互。

优势

  1. 增强用户体验:通过JS与OC的交互,可以在原生应用中嵌入动态网页内容,提供丰富的交互体验。
  2. 代码复用:可以利用现有的Web技术栈,减少重复开发工作。
  3. 灵活性:可以根据需要动态加载和更新网页内容,而不需要重新发布整个应用。

类型

  • OC调用JS:原生代码触发JavaScript函数的执行。
  • JS调用OC:网页中的JavaScript代码调用原生Objective-C的方法。

应用场景

  • 混合应用开发:结合原生应用和Web技术的优势,快速迭代产品。
  • 动态内容加载:在应用中显示实时更新的数据或个性化内容。
  • 第三方登录与服务集成:通过网页实现OAuth认证或其他在线服务。

常见问题及解决方案

问题1:如何在Objective-C中调用JavaScript函数?

解决方案

代码语言:txt
复制
// 假设你已经有了一个WKWebView实例webView
NSString *jsFunctionCall = @"yourJavaScriptFunction()";
[webView evaluateJavaScript:jsFunctionCall completionHandler:^(id _Nullable result, NSError * _Nullable error) {
    if (error) {
        NSLog(@"Error executing JavaScript: %@", error);
    } else {
        NSLog(@"Result: %@", result);
    }
}];

问题2:如何从JavaScript调用Objective-C的方法?

解决方案: 首先,在Objective-C中定义一个协议并实现它:

代码语言:txt
复制
@protocol JSObjcDelegate <JSExport>
- (void)callObjcMethod:(NSString *)message;
@end

@interface YourViewController : UIViewController <UIWebViewDelegate, JSObjcDelegate>
@end

@implementation YourViewController
- (void)callObjcMethod:(NSString *)message {
    NSLog(@"Received message from JS: %@", message);
}
@end

然后,在HTML中通过JavaScript调用这个方法:

代码语言:txt
复制
<script type="text/javascript">
function callObjectiveC() {
    window.webkit.messageHandlers.yourHandler.postMessage("Hello from JavaScript");
}
</script>

在Objective-C中设置WKScriptMessageHandler:

代码语言:txt
复制
WKWebViewConfiguration *configuration = [[WKWebViewConfiguration alloc] init];
WKUserContentController *controller = [[WKUserContentController alloc] init];
[controller addScriptMessageHandler:self name:@"yourHandler"];
configuration.userContentController = controller;
WKWebView *webView = [[WKWebView alloc] initWithFrame:self.view.frame configuration:configuration];

注意事项

  • 确保在主线程上执行UI相关的操作。
  • 处理好内存管理,避免循环引用导致的内存泄漏。
  • 在调用JavaScript时要注意安全性,避免注入攻击。

通过以上方法,你可以有效地在Objective-C和JavaScript之间建立桥梁,实现两者之间的无缝交互。

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

  • JS面试点-Object.is和===的区别?

    null 两个值都是 true 或者都是 false 两个值是由相同个数的字符按照相同的顺序组成的字符串 两个值指向同一个对象 两个值都是数字并且 都是正零 +0 都是负零 -0 都是 NaN 都是除零和...NaN 外的其它同一个数字 这种相等性判断逻辑和传统的 == 运算不同,== 运算符会对它两边的操作数做隐式类型转换(如果它们类型不同),然后才进行相等性比较,(所以才会有类似 "" == false...=== 运算符(和== 运算符)将数字值 -0 和 +0 视为相等,并认为 Number.NaN 不等于 NaN。...// false Object在严格等于的基础上修复了一些特殊情况下的失误,具体来说就是+0和-0,NaN和NaN。...== y } } 尚硅谷C核心技术 链接:https://pan.baidu.com/s/1SlUknJel3q7fYNZnhcWnSA 提取码:4b0r

    1.3K30

    Android_其他语言交互篇——Js、C#、C、C++

    作者博客 http://www.jianshu.com/u/1da72f6f0c2f 文章目录 前言 Js——WebView Android端调用Js端(下图示例有参数和无参两种调用) Js端调用Android...,很多教程的实现过程繁杂简直是天书,本篇就用最易懂最简单的方式教小白们掌握Anroid如何与Js、C#、C和C++进行交互,让大家克服对其他语言的恐惧!...2 Js——WebView Js交互可能是我们开发中涉及到的最多的(也有第三方有名的像腾讯X5内核),很多开发者应该很熟悉了,我们就稍微复习下: ①、Android端调用Js端(下图示例有参数和无参两种调用...JNI的神秘面纱吧: 看到C和C++与Java交互,我们脑海里第一时间想起的就是JNI。...(说明JNI能用于很多语言与Java进行交互,但平时我们提起JNI,主要指的是C和C++);话说年初的时候换工作面试,有个面试官问我会不会NDK开发,我虽然没在项目中用过,但是流程给他讲的明明白白,从他的眼神中我还是看出他对我一点都不相信

    2.3K20

    Lua和C如何交互(二)

    上一篇文章描述了Lua和C交互的原理, 这篇文章主要通过Demo程序加深Lua和C的交互....涉及到交互,分为: Lua中如何调用C函数 C中如何调用Lua函数 这里先描述C中如何调用Lua函数, 想象一下, C到底怎么和Lua进行通信,如何告诉它我调用的是xxx参数?...Lua采取的是利用栈进行交互 Lua提供了C API对栈进行操作, 利用各种Lua_pushXXX将不同的值压入栈中,然后调用Lua脚本时自然会退栈取出参数运行 Lua栈状态需要自己进行维护,若发生多线程同时对...hello.lua str = "hello world" -- 定义一个tab tb = {name = "hello",id = 20180119} 注意: Lua使用--表示为注释 main.c.../* 获取str的值,压入栈中 */ str=lua_tostring(L,1); /* 出栈,将给定索引处的Lua值转换为C字符串

    1.3K10

    用WebViewJavascriptBridge进行JS和app进行交互

    和安卓怎么进行通信,有这样的需求也是很少见的,但是既然存在这样的需求还是需要进行解决的,那么我参考的是这个地址的方案: JsBridge vue调用的问题 这个直接原生js写是没有问题的,但是vue直接调用的时候一直不成功...里面 第二步:在main.js里面引入 import Bridge from '..../config/bridge.js' Vue.prototype....附带几个写得好的交互的例子 https://www.jianshu.com/p/d12ec047ce52 https://www.cnblogs.com/yongbufangqi1988/p/8462275....html PS:这个js不确定是不是一定需要的,如果成功了这个就不用加, 以后我玩的熟了,我会继续更新这个,写的再详细一点,目前可以确定的是如果这个WebViewJavascriptBridge.js

    3.3K10

    js Object.defineProperty()详解

    : 是一个对象,里面是我们上述的对象属性的特性; 下面我们使用Object.defineProperty()分别演示数据属性和访问器属性; 注意:数据属性和访问器属性不能同时设置,也就是数据属性的writable...和value不能和访问器属性的set和get同时设置,否则会报错。...Object.defineProperty设置访问器属性 Configurable 和 Enumerable和上述一样,这里不再演示。 4.1 Get、Set get: 获取函数,在读取属性时调用。...它接收两个参数:要为之添加或修改属性的对象和另一个描述符对象,其属性与要添加或修改的属性一一对应: const book= {}; Object.defineProperties(person, {...读取属性的特性Object.getOwnPropertyDescriptor() Object.getOwnPropertyDescriptor()方法接收两个参数:属性所在的对象和要取得其描述符的属性名

    2.4K20

    WebViewJavascriptBridge源码探究--看OC和JS交互过程

    今天把实现OC代码和JS代码交互的第三方库WebViewJavascriptBridge源码看了下,oc调用js方法我们是知道的,系统提供了stringByEvaluatingJavaScriptFromString...源码不多,就一个头文件WebViewJavascriptBridge.h和实现文件WebViewJavascriptBridge.m, 和一个js文件,实现在js那边可以调用oc方法,也可以在oc里面调用...先上图,实现简单的oc和js互相调用的demo, 另外附加一个模拟项目中用到的oc和js互相调用场景: ? 一、然后说说js调用oc方法的原理,它们是如何实现的?库文件三个 ?...2、UIWebView加载我们自定义的html页面TestJSBridge.html, 里面有脚本注册js调用oc方法标识,和oc调用js标识 js调用oc成功 总结js调用oc过程: -->   触发js事件 -->   把要传入参数和自定义注册标识“js_Call_Objc_Func”存入js数组sendMessageQueue

    3.4K50
    领券