【JCEF】JS与JAVA进行交互

简介: 【JCEF】JS与JAVA进行交互

前言

之前介绍了JCEF的可用性,经过几天的摸索,有了一个初步的理解并尝试着运行测试案例

一:介绍

在传统的Web开发中,前后端连接通常是通过以下方式实现的:

HTTP请求: 前端通过HTTP请求向后端发送请求,后端处理请求并返回数据。这可以是常规的GET请求、POST请求等。前端通常使用JavaScript或其他前端框架来发起这些请求。

API(应用程序编程接口): 后端提供一组API,这些API定义了前端可以调用的功能和数据。前端通过HTTP请求调用这些API来获取或发送数据。API可以返回数据,如JSON或XML格式的信息。

WebSocket: WebSocket是一种双向通信协议,允许前后端实时交换数据。与传统的HTTP请求不同,WebSocket连接保持打开状态,允许双方在任何时候都能发送和接收数据。

二:开始

JCEF(Java Chromium Embedded Framework)是一个将Chromium嵌入到Java应用程序中的框架,使您可以在Java应用程序中嵌入一个完整的浏览器引擎。JCEF提供了一种在Java应用程序中展示网页内容的方式,并且允许您在Java和JavaScript之间进行交互。下面是一个简单的示例,展示如何在JCEF中实现Java和JavaScript之间的交互:

首先,您需要设置JCEF的开发环境。这涉及到引入JCEF的库和配置,这里简单介绍一下步骤:

下载JCEF的库文件,并将它们添加到您的Java项目中。

配置JCEF的运行参数,主要是设置Chromium本地库的路径。

初始化JCEF框架,启动Chromium引擎。

创建JFrame或JPanel来嵌入JCEF组件,以展示网页内容。

以下是一个简化的示例,展示如何在JCEF中实现Java和JavaScript之间的交互:

1. import org.cef.CefApp;
2. import org.cef.CefClient;
3. import org.cef.CefSettings;
4. import org.cef.browser.CefBrowser;
5. import org.cef.handler.CefAppHandlerAdapter;
6. import org.cef.handler.CefLoadHandlerAdapter;
7. import org.cef.handler.CefMessageRouterHandlerAdapter;
8. import org.cef.handler.CefRequestHandlerAdapter;
9. 
10. import javax.swing.*;
11. 
12. public class JCEFExample {
13. public static void main(String[] args) {
14.         CefApp.addAppHandler(new CefAppHandlerAdapter(args));
15. CefSettings settings = new CefSettings();
16. CefApp cefApp = CefApp.getInstance(args, settings);
17. 
18.         SwingUtilities.invokeLater(() -> {
19. JFrame frame = new JFrame("JCEF Example");
20.             frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
21. 
22. CefClient client = cefApp.createClient();
23. CefBrowser browser = client.createBrowser("https://www.example.com", false, false);
24. 
25.             frame.getContentPane().add(browser.getUIComponent());
26. 
27.             frame.setSize(800, 600);
28.             frame.setVisible(true);
29.         });
30.     }
31. }

上述代码创建了一个简单的JCEF应用程序窗口,并在窗口中展示了一个网页。接下来,让我们看一下如何在JavaScript和Java之间进行交互。

在JCEF中,要实现JavaScript和Java之间的交互,您可以使用CefMessageRouter。

下面是一个简单的示例:

1. import org.cef.browser.CefBrowser;
2. import org.cef.callback.CefQueryCallback;
3. import org.cef.handler.CefMessageRouterHandlerAdapter;
4. 
5. public class JCEFMessageRouterHandler extends CefMessageRouterHandlerAdapter {
6. @Override
7.     public boolean onQuery(CefBrowser browser, long queryId, String request, boolean persistent, CefQueryCallback callback) {
8. if (request.equals("getJavaData")) {
9. String javaData = "This data is from Java";
10.             callback.success(javaData);
11. return true;
12.         }
13. return false;
14.     }
15. }

在上述代码中,我们创建了一个CefMessageRouterHandlerAdapter的子类,重写了onQuery方法来处理来自JavaScript的查询。当JavaScript代码中调用cefQuery并传递"getJavaData"时,Java代码会返回一段数据。

然后,您需要在之前的示例中将这个JCEFMessageRouterHandler注册到CefMessageRouter中。这样,您就可以在JavaScript中使用cefQuery来与Java进行交互了。

JavaScript代码示例:

1. // 在JavaScript中调用Java方法并获取返回值
2. cefQuery({
3.     request: "getJavaData",
4.     onSuccess: function(response) {
5.         console.log("Data from Java: " + response);
6.     },
7.     onFailure: function(errorCode, errorMessage) {
8.         console.error("Java query failed: " + errorCode + " - " + errorMessage);
9.     }
10. });

总结

JCEF使得在Java应用程序中嵌入Chromium引擎成为可能,并且通过使用CefMessageRouter,您可以在Java和JavaScript之间实现双向的交互。请注意,实际开发中需要更多的配置和处理,这里只是一个简化的示例

相关文章
|
2月前
|
开发框架 JavaScript 前端开发
揭秘:如何让你的asp.net页面变身交互魔术师——先施展JavaScript咒语,再引发服务器端魔法!
【8月更文挑战第16天】在ASP.NET开发中,处理客户端与服务器交互时,常需先执行客户端验证再提交数据。传统上使用ASP.NET Button控件直接触发服务器事件,但难以插入客户端逻辑。本文对比此法与改进方案:利用HTML按钮及JavaScript手动控制表单提交。后者通过`onclick`事件调用JavaScript函数`SubmitForm()`来检查输入并决定是否提交,增强了灵活性和用户体验,同时确保了服务器端逻辑的执行。
40 5
|
1月前
|
JavaScript 前端开发
JavaScript 与 DOM 交互
【9月更文挑战第01天】
22 2
|
2月前
|
JavaScript 前端开发 UED
Vue.js动画魔法:解锁流畅过渡,让每一次交互都成为用户心中的小确幸!
【8月更文挑战第30天】在Vue.js中,动画与过渡效果不仅是视觉点缀,更是提升用户体验的关键。通过流畅的动态效果,应用的互动性和吸引力得以增强,从而提高用户满意度和参与度。`<transition>`和`<transition-group>`组件结合CSS过渡,可轻松实现元素的进入、离开及列表变化动画。合理的性能优化,如使用硬件加速,能避免页面卡顿,确保动画既美观又高效。下面是一个简单的淡入淡出效果示例,展示了如何利用Vue.js实现平滑的动画过渡。总之,恰当的动画设计能显著提升应用的用户体验。
41 0
Vue.js动画魔法:解锁流畅过渡,让每一次交互都成为用户心中的小确幸!
|
2月前
|
前端开发 JavaScript Java
Ajax进行异步交互:提升Java Web应用的用户体验
Ajax 技术允许在不重载整个页面的情况下与服务器异步交换数据,通过局部更新页面内容,极大提升了 Java Web 应用的响应速度和用户体验。本文介绍 Ajax 的基本原理及其实现方式,包括使用 XMLHttpRequest 对象发送请求、处理响应数据,并在 Java Web 应用中集成 Ajax。此外,还探讨了 Ajax 如何通过减少页面刷新、实时数据更新等功能改善用户体验。
51 3
|
2月前
|
Devops 持续交付 测试技术
JSF遇上DevOps:开发流程将迎巨变?一篇文章带你领略高效协同的魅力!
【8月更文挑战第31天】本文探讨了如何在JavaServer Faces(JSF)开发中融入DevOps文化,通过持续集成与部署、自动化测试、监控与日志记录及反馈机制,提升软件交付速度与质量。文中详细介绍了使用Jenkins进行自动化部署、JUnit与Selenium进行自动化测试、ELK Stack进行日志监控的具体方法,并强调了持续改进的重要性。
31 0
|
2月前
|
前端开发 JavaScript
前端 JavaScript 与 HTML 怎么实现交互
前端 JavaScript 与 HTML 怎么实现交互
|
3月前
|
缓存 Java 编译器
Java演进问题之JVMCI JIT编译器与JVM的交互如何解决
Java演进问题之JVMCI JIT编译器与JVM的交互如何解决
|
2月前
|
存储 JavaScript 前端开发
2D物理引擎 Box2D for javascript Games 第三章 刚体的交互
2D物理引擎 Box2D for javascript Games 第三章 刚体的交互
|
3月前
|
设计模式 安全 Java
Java面试题:设计模式如单例模式、工厂模式、观察者模式等在多线程环境下线程安全问题,Java内存模型定义了线程如何与内存交互,包括原子性、可见性、有序性,并发框架提供了更高层次的并发任务处理能力
Java面试题:设计模式如单例模式、工厂模式、观察者模式等在多线程环境下线程安全问题,Java内存模型定义了线程如何与内存交互,包括原子性、可见性、有序性,并发框架提供了更高层次的并发任务处理能力
64 1
|
4月前
|
JavaScript 前端开发 Java
java 执行 javascript 代码
java 执行 javascript 代码
26 6
下一篇
无影云桌面