CEF3—在网页加载前给js对象填值

前言

记录一次笔者在实际开发中遇到的问题。在用cef做多页应用开发的时候，多个单页共享数据的问题。这个数据被前端称之为token，在多页应用中需要被共享。数据被使用和存的动作都是在render进程，而多个h5页面也就是多个 render进程中，但是存放的位置肯定是在browser进程，因为browser进程是后台进程，大家取数据都到同一个进程中去存取数据也就被共享。

思路

笔者一开始设计的接口如下：

BB.SetToken(x); // 存token
BB.Token(function(x){console.log(x);}); // 取token

存会去更新token。取需要通过回调函数取，这里需要在回调函数中去，因为数据并不在render进程中只能异步取。看是去一切还很简单美好。但是前端并不想通过回调函数的方式取token，就想通过类似下面的方式去取。

// 前端想快速方便的取到token，类似下面这种方式
var token = BB.Token(); // 方法返回值方式
var token = BB.token;  // 对象属性的方式

当然前端的要求并不过分，就得我们去想办法去实现了！这里如果用方法的返回值的话，必须使用全局的事件进行等待，等从browser取到了还要从共享内存或者其他方式把token数据取到。所以笔者当然也想用最简单方式去实现，这里是使用 BB.token对象属性值的方式。

如果用对象属性的方式的话，我们 token的填值就是我们客户端作为主动方进行填值。如果有单页使用SetToken方法更新token，那么此时客户端要更新所有单页上的 BB.token。如果新开一个单页而且js代码要立即取到BB.token的值，这里也就是笔者遇到的问题。因为笔者更新某个单页的上的BB.token逻辑已写好，当新单页打开加载后直接给新开的单页发送消息让其更新token即可，但是这样回有一个延时问题在页码加载过程中 js代码取不到token而要等1s后才能取到。

代码

所以不能等单页加载完后去发送更新token的消息去进行更新。这里必须是在创建单页或者在单页加载完前类似window对象的内置属性一样可以直接取到token。网上没找到参考的，所以笔者去仔细看了一下cef接口果然找到了。主要用到下面几个接口。

// 创建单页会用到下面这个接口，对就是这个函数，仔细看这个函数的extra_info参数，该数据可以将browser进程的数据带到创建单页过程中的回调函数中CefRenderProcessHandler::OnBrowserCreated()// CefBrowserHost的静态成员函数///// Create a new browser window using the window parameters specified by// |windowInfo|. All values will be copied internally and the actual window// will be created on the UI thread. If |request_context| is empty the// global request context will be used. This method can be called on any// browser process thread and will not block. The optional |extra_info|// parameter provides an opportunity to specify extra information specific// to the created browser that will be passed to// CefRenderProcessHandler::OnBrowserCreated() in the render process.////*--cef(optional_param=client,optional_param=url,optional_param=request_context,optional_param=extra_info)--*/
static bool CreateBrowser(const CefWindowInfo& windowInfo,CefRefPtr<CefClient> client,const CefString& url,const CefBrowserSettings& settings,CefRefPtr<CefDictionaryValue> extra_info,CefRefPtr<CefRequestContext> request_context);// 所以就找到CefRenderProcessHandler中相关的回调函数// CefRenderProcessHandler中可被重写的回调函数// 该函数可以取到从browser进程中带过来的数据///// Called after a browser has been created. When browsing cross-origin a new// browser will be created before the old browser with the same identifier is// destroyed. |extra_info| is a read-only value originating from// CefBrowserHost::CreateBrowser(), CefBrowserHost::CreateBrowserSync(),// CefLifeSpanHandler::OnBeforePopup() or CefBrowserView::CreateBrowserView().////*--cef()--*/virtual void OnBrowserCreated(CefRefPtr<CefBrowser> browser,CefRefPtr<CefDictionaryValue> extra_info) {}// 下面这个函数注释写的很清楚，下面是Chrome V8环境一旦被创建好就会被回调，所以在下面回调函数中取我们的自定义对象或者 window对象一定是可以取到并能赋值的///// Called immediately after the V8 context for a frame has been created. To// retrieve the JavaScript 'window' object use the CefV8Context::GetGlobal()// method. V8 handles can only be accessed from the thread on which they are// created. A task runner for posting tasks on the associated thread can be// retrieved via the CefV8Context::GetTaskRunner() method.////*--cef()--*/virtual void OnContextCreated(CefRefPtr<CefBrowser> browser,CefRefPtr<CefFrame> frame,CefRefPtr<CefV8Context> context) {}

关键代码如下：

// browser进程中创建单页
CefRefPtr<CefDictionaryValue> extra_info = CefDictionaryValue::Create();
extra_info->SetString("token",m_strToken);
CefBrowserHost::CreateBrowser(windowInfo, m_browserEvent, strUrl, browserSetting, extra_info, NULL);// render进程中处理数据并给js对象进行属性赋值
static CefString m_strToken = "";
void CCefBrowserApp::OnBrowserCreated(CefRefPtr<CefBrowser> browser, CefRefPtr<CefDictionaryValue> extra_info)
{m_strToken = extra_info->GetString(CefString("token"));
}void CCefBrowserApp::OnContextCreated(CefRefPtr<CefBrowser> browser, CefRefPtr<CefFrame> frame, CefRefPtr<CefV8Context> context)
{context->Enter();CefRefPtr<CefV8Value> window = context->GetGlobal();CefRefPtr<CefV8Value> BB = window->GetValue(CefString("BB"));if(BB->IsObject()){CefRefPtr<CefV8Value> token = CefV8Value::CreateString(m_strToken);BB->SetValue(_T("token"),token,CefV8Value::PropertyAttribute::V8_PROPERTY_ATTRIBUTE_DONTDELETE);   }context->Exit();
}

CEF3—在网页加载前给js对象填值相关推荐

用 Flask 来写个轻博客 (28) — 使用 Flask-Assets 压缩 CSS/JS 提升网页加载速度
Blog 项目源码:https://github.com/JmilkFan/JmilkFan-s-Blog 目录目录前文列表扩展阅读 Flask-Assets 将 Flask-Assets 应用 ...
Windows下使用apache模块实现合并多个js、css提高网页加载速度
这篇文章主要介绍了Windows下使用apache模块实现合并多个js.css提高网页加载速度,本文使用的模块是基于mod_concat自己修改的,需要的朋友可以参考下现在的网站表现力越来越丰富,页 ...
Android开发笔记（六十四）网页加载与JS调用
内置浏览器网页视图WebView 如果一个网站已经有现成的网页及业务逻辑,那么使用WebView将其内嵌到app中,省去了app重画页面与http通信的事情,无疑是更经济的做法.WebView就是A ...
JS网页加载状态判断
网页加载状态一共分为5种,分别是: //(未初始化)还没有调用send()方法 1.uninitialized:(Uninitialized) the send( ) method has not y ...
开发那些事儿：如何解决js打包文件体积过大导致的网页加载慢问题？
智能分析网关作为我们新推出的产品,除了丰富的AI智能检测及视频功能之外,我们依然在持续拓展新AI算法的部署,并不断优化细节.提升用户的使用体验. 近期,我们对js打包文件体积过大的情况进行了优化,解决 ...
通过JS和CSS，实现网页加载中的动画效果
需要材料: 一张loading动画的gif图片基本逻辑: 模态框遮罩 + loading.gif动图, 默认隐藏模态框页面开始发送Ajax请求数据时,显示模态框请求完成,隐藏模态框下面我们通过 ...
网页动态加载图片通过JS和jquery实现。
;(function($){$.fn.extend({scrollLoad:function(options){var options = $.extend({src:'xsrc', //预加载在&l ...
html与js与mysql_WebView加载html与JS交互
一.加载Html的几种方法直接在Activity中实例化WebView WebView webview =new WebView(this); webview.loadUrl(......); 在X ...
使用WebView监控网页加载状况，PerformanceMonitor，WebViewClient生命周期
原理:WebView加载Url完成后,注入js脚本,脚本代码使用W3C的PerformanceTimingAPI, 往js脚本传入一个Android对象(代码中为AndroidObject),在js脚 ...

CEF3—在网页加载前给js对象填值

文章目录

CEF3—在网页加载前给js对象填值

前言

思路

代码

CEF3—在网页加载前给js对象填值相关推荐

最新文章

热门文章