Js如何调用本地应用程序

Posted 2023-05-04

参考技术A

一般情况下，浏览器中是无法直接和本机的其他的程序进行交互的，在IE中，我们可以通过ActiveX对象的方式进行。但是这个方式只适用于IE浏览器，另一种比较通用的方式便是URL协议的方式，我们将某种URL的协议注册给某个程序来进行处理，比如将tencent://这样的协议注册给QQ程序来进行处理，当浏览器需要访问这样的协议的时候就转给QQ程序进行处理。这种URL协议的方式是可以跨平台的，比如在Windows上你需要添加注册表项。

首先先看看js应该如何调用qq客户端。
window .open(" tencent://message/?uin=346915968 ")
window.open顾名思义，打开。Tencent就不用多说了吧 BAT之T。上述能直接打开qq帐号对应的对话框。由此可以知道网页上的在线客服功能是如何实现了吧。
那要是不需要打开对话框，就想要登陆qq应该如何实现呢？很简单呀：
window .open(" tencent://message/?uin=qq ") 不过调用应用这种跟黑客没什么差别的行为，浏览器一般都是禁止的，

选择允许后，

启动应用，qq客户端就会被调起。
为什么说这个呢，老板又给了个需求，想让调起qq客户端一样，想通过演示页面的一个按钮，调起售票系统的各种程序...
什么都不说了，先看看什么是自定义协议。
Pluggable Protocol，又叫URL Protocol，有时会叫Shell命令，通用的Protocol有http、ftp、mailto等，这些都是windows安装时自带的协议。
接着也实现一个简单的自己的自定义协议吧。
1，运行window，输入regedit打开注册表。 在HKEY_CLASSES_ROOT下面建一个自己起的名字的表。

用如下格式把各项值添上：

js打开qq音乐.exe

启动应用

end.

WebView2 (WPF) - 从本地文件夹加载网站并调用 C# 函数并调用 JS 函数

【中文标题】WebView2 (WPF) - 从本地文件夹加载网站并调用 C# 函数并调用 JS 函数

【英文标题】：WebView2 (WPF) - Load website from local folder and call C# Function and call JS Function

【发布时间】：2021-10-08 00:01:00

【问题描述】：

我正在让 WPF 应用程序使用 WebView2。

将有一个安装程序，它将 WPF 应用程序安装在一个文件夹中，还将下载网站并将其写入安装目录的子文件夹中。比如这样：

Installation Directory
├───Website
│   ├───index.css
│   └───index.html
└───WPF Self Contained EXE

WebView2 将使用这个（我认为）加载网站：webView.CoreWebView2.Navigate(Path.Combine(AppDomain.CurrentDomain.BaseDirectory, "Website");

这应该加载index.html 以及它引用的所有文件，例如index.css。

现在我主要关心的是如何从 C# 调用 JavaScript 函数。到目前为止，在谷歌搜索之后，我只找到了 WebView1 的方法。而且我找不到任何关于从 JavaScript 调用 C# 方法的信息。

所以三件事：

webView.CoreWebView2.Navigate(Path.Combine(AppDomain.CurrentDomain.BaseDirectory, "Website"); 是否适合从本地文件夹加载网站？ 如何调用 JavaScript 函数并将 C# 对象从 C# 方法传递给它。 如何从 JavaScript 脚本调用 C# 函数？

这可能吗？

谢谢。

【问题讨论】：

以下内容应该可以帮助您入门：***.com/questions/68578936/…、***.com/questions/65452473/… 和 ***.com/questions/68350635/…。但是，与其将文件（.html 和 .css）存储为嵌入式资源（如那些帖子中所示），不如将它们作为文件存储在磁盘上 - 正如您已经计划的那样。

谢谢！这有帮助！我认为将文件存储在磁盘上会使更新速度更快，因为它们可能会比实际应用程序更新得更快......再次感谢！

以下内容可能对如何从 JavaScript 调用 C# 函数有所帮助：github.com/MicrosoftEdge/WebView2Feedback/issues/335

【参考方案1】：

使用文件 URI

我不确定 AppDomain.CurrentDomain.BaseDirectory 是否总能为您提供正确的路径。您可以使用以下内容：

string exePath = System.Reflection.Assembly.GetExecutingAssembly().Location;
string exeFolder = System.IO.Path.GetDirectoryName(exePath);
string websiteFolder = Path.Combine(exeFolder, "website");
string htmlPath = Path.Combine(websiteFolder, "index.html");

webView.CoreWebView2.Navigate(htmlPath);

您必须包含 index.html 本身的路径，而不仅仅是包含 index.html 的文件夹。

通常 Navigate 应该采用 URI，但如果您提供 Windows 文件路径，它会为您将其转换为文件 URI 并且应该可以工作。

在尝试合并 http(s) URI 和其他需要 https 的 Web 平台功能时，文件 URI 有一些限制。

使用虚拟 HTTPS URI

如果您使用文件 URI 遇到问题，您可以使用 CoreWebView2.SetVirtualHostNameToFolderMapping 将 Windows 文件路径映射到虚假 HTTPS 主机名：

string exePath = System.Reflection.Assembly.GetExecutingAssembly().Location;
string exeFolder = System.IO.Path.GetDirectoryName(exePath);
string websiteFolder = Path.Combine(exeFolder, "website");

webView.CoreWebView2.SetVirtualHostNameToFolderMapping("appassets.example", websiteFolder, CoreWebView2HostResourceAccessKind.DenyCors);
webView.CoreWebView2.Navigate("https://appassets.example/index.html");

这将创建一个虚假的主机名“appassets.example”，该主机名将映射到您的 Windows 文件路径。而且由于它的 HTTPS URI，您不会遇到与文件 URI 相同的问题。

脚本中的宿主对象

对于您的问题 2 和 3，您可以使用 CoreWebView2.AddHostObjectToScript。 AddHostObjectToScript 的当前实现需要对您的 C# 类进行特殊标记。您可以在 AddHostObjectToScript 文档中看到它。

【讨论】：

嗨。本地网站有效！谢谢！当我在返回 List 的类中调用 c# 方法时，我得到 null。这是我的 js 代码：const transaction = chrome.webview.hostObjects.transaction; transaction.GetReceiptItems(10).then(TResult1 => this.amount = TResult1.Count;);

这会向控制台记录一个错误：Uncaught (in promise) TypeError: Cannot read property 'Count' of null 注意我正在使用 react.js。

GetReceiptItems 的结果类型是否也标注了相应的属性[ClassInterface(ClassInterfaceType.AutoDual)] 和[ComVisible(true)]？

MS 网站上的 JavaScript 代码不正确。 const transaction = chrome.webview.hostObjects.transaction; 需要有 await。应该是const transaction = await chrome.webview.hostObjects.transaction;

好的。谢谢！让我试试新代码。结果是 List... 你的意思是 类吗？