CEF C++调用前端js方法展示传递过来的图片数据

转载：https://blog.csdn.net/lengyuezuixue/article/details/79769103

在项目开发过程中遇到一个需求，通过C++调用js方法传参给前端显示图片，但前端如果想显示一个本地绝对路径的一张图片，必须把图片内容转换成base64，原因是浏览器中的JavaScript不能直接直接访问本地资源（例如文件系统，摄像头，麦克风等），除非事先得到了用户的允许，之所以进行该限制也是很有必要的，如果JavaScript能够肆无忌惮的访问本地的文件系统，那么窃取用户隐私数据就变得轻而易举了，当用户访问网络上的某个网页时，不知不觉中自己机器上保存的信用卡卡号，密码，公司的秘密文件等隐私文件或许已经被恶意的JavaScript程序上传到了远方的服务器上，这对用户来说是不可容忍的。

1.簡單的調用js函數的方式：

m_handler->GetBrowser()->GetMainFrame()->ExecuteJavaScript(strJSFuncName, m_handler->GetBrowser()->GetMainFrame()->GetURL(), 0);

具体调用可以参考我之前关于CEF博客

例如：

frame->ExecuteJavaScript(L"ModifyValue();",frame->GetURL(),0);//无参数函数
frame->ExecuteJavaScript(L"ModifyValue('巴萨牛逼');",frame->GetURL(),0);//有参数函数
如果参数是可变的，可以这样
CString strJsCode;
strJsCode.Format(L"setInstallStatus('%s','%s','%d');", lpData->strId.c_str(), strStatus, nPercent);
其中setInstallStatus是js函数，它有三个参数

但在具体调用过程中遇到，

 

 感觉是字符串被截断了，没法当成一个js函数调用，然后调试图片转成base64生成的buffer，如下图发现字符串里面很多" "

应该是" "这个原因造成的，所以应该把字符串中的" "过滤掉。

wstring&   replace_all_WString(wstring&   str, const   wstring&   old_value, const   wstring&   new_value)
{
    wstring::size_type   pos(0);
    while (true)   {

        if ((pos = str.find(old_value, pos)) != wstring::npos)
        {
            str.replace(pos, old_value.length(), new_value);
            pos += new_value.length();
        }
        else   break;
    }
    return   str;
}

....

wstring  wstrBase64=L"data:image/jpeg;base64,.....";

wstrBase64 = replace_all_WString(wstrBase64, L"
", L"");//过滤

 CString strJson;
 strJson.Format(L"ModifyValue('%s');", wstrBase64.c_str());

 frame->ExecuteJavaScript(wstrBase64,frame->GetURL(),0);//有参数函数

 ....