PPAPI插件开发（1）简介

2024-02-22 17:21:58

1.插件描述

Native Client enables the execution of native code securely inside web applications through the use of advanced Software Fault Isolation (SFI) techniques. Native Client allows you to harness a client machine’s computational power to a fuller extent than traditional web technologies. It does this by running compiled C and C++ code at near-native speeds, and exposing a CPU’s full capabilities, including SIMD vectors and multiple-core processing with shared memory.

Chrome PPAPI插件只能使用PPAPI接口的NativeClient(NaCl)方式编写，Native Client分别有三种embed类型：
1、“application/x-ppapi”：平台相关，唯一能直接使用win32 api的platfrom（有功能上的限制）。 dll格式，不允许通过Chrome web store分发。
2、“application/x-nacl”：只能通过PPAPI，平台无关，cpu相关。nexe格式，只能通过Chromeweb store分发。
3、“application/x-pnacl”：只能通过PPAPI，平台无关，cpu无关。pexe格式，可以不通过Chrome web store分发。

2.常见浏览器插件分类

Type	Chrome	based on Chromium core	IE
ActiveX	No	No	Yes
NPAPI	No	Yes	No
PPAPI	Yes	Yes	No

3.ppapi插件支持时间

Native Client was a sandbox for running compiled C and C++ code in the browser efficiently and securely, independent of the user's operating system. It was deprecated in 2020 and support will end in June 2021.

4.ppapi插件形式

Native Client comes in two flavors.

Portable Native Client (PNaCl): Pronounced ‘pinnacle’, PNaCl runs single, portable (pexe) executables and is available in most implementations of Chrome. A translator built into Chrome translates the pexe into native code for the client hardware. The entire module is translated before any code is executed rather than as the code is executed. PNaCl modules can be hosted from any web server.
Native Client (NaCl): Also called traditional or non-portable Native Client, NaCl runs architecture-dependent (nexe) modules, which are packaged into an application. At runtime, the browser decides which nexe to load based on the architecture of the client machine. Apps and Extensions installed via the Chrome Web Store (CWS) can use NaCl modules without additional prompting. NaCl apps can also be installed from chrome://extensions or the command-line during development, however, this is not a recommended distribution mechanism.

These flavors are described in more depth in PNaCl and NaCl

5.开发包下载地址

（1）Google相关开发官网，Native Client - Chrome Developers

https://developer.chrome.com/docs/native-client/

https://developer.chrome.com/native-client/sdk/download

（2）Open source from Adobe

https://github.com/adobe/chromium/tree/master/ppapi

（3）个人提供的

GitHub - xiaozihui/ppapi: Automatically exported from code.google.com/p/ppapi

https://download.csdn.net/download/hhy321/13183729

6.插件运行方式

（1）批处理文件的代码如下：

"C:/Program Files/Google/Chrome/Application\chrome.exe" --start-maximized --enable-local-storage --no-sandbox --register-pepper-plugins=C:\Users\tomcat\Desktop\PEDemoChrome\plugin\PPAPILoadPEModuleX64.dll;application/x-ppapi-peplugin C:\Users\tomcat\Desktop\PEDemoChrome\plugin\index.html

（2）网页文件的代码如下：

<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8">
  <title>PEInChrome</title>

  <style type="text/css">
    html,
    body {
      width: 100%;
      height: 100%;
      padding: 0;
      margin: 0;
      overflow: hidden;
    }
  </style>

  <script type="text/javascript">
    function handleMessage(message) {
      var msg = message.data;
      if (msg["command"] == "path") {
        getPath(); 
      }
      if (msg["command"] == "NoPE") {
        alert("没有找到模型文件");
      }
    }

    function getPath() {
      var pathName = document.location.pathname;    
      var pos = pathName.lastIndexOf('/');
      pathName = pathName.substring(0, pos + 1);
      pathName += "test.pe";
      plugin = document.getElementById('ppapiplugin');
      plugin.postMessage({
        command: "path",
        path: pathName,
      });
    }
  </script>


</head>

<body>

  <span id="listener">
    <embed id="ppapiplugin" width="100%" height="100%" type="application/x-ppapi-peplugin" />
  </span>

  <script type="text/javascript">
    var listener = document.getElementById('listener');
    listener.addEventListener('message', handleMessage, true);
  </script>

</body>

</html>

码农公寓