整合營銷服務商
電腦端+手機端+微信端=數據同步管理
免費咨詢熱線：
電腦端+手機端+微信端=數據同步管理
免費咨詢熱線：
作中有這樣的場景，需要手動填寫很多格式一樣的表單，然后點擊提交。如果數據在Excel中，一個個的copy，重復性工作太繁瑣。今天就介紹一個實現網頁自動化的控件--WebBrowser控件。
﹥﹥先給大家看看效果：（自動填寫注冊頁面的表單數據）
這個效果稍做改變，加個循環，就可以實現批量填入網頁表單數據，并自動提交。（備注：公司內部的表單一般是不會有驗證碼的，所以暫時不用考慮識別驗證碼的工作。）
這就是WebBrowser控件的強大之處。下面就教大家如何實現上述網頁自動化的效果。
﹥﹥何為WebBrower?
WebBrowser 是微軟提供的一個用于瀏覽網頁的 ActiveX 控件，是植入在程序中一個控件，網頁顯示在窗體中.可以利用WebBrowser 對網頁進行控制，進行一些操作。
在VBA中WebBrowser 控件插入到 VBA 的用戶窗體、一般情況下，VBA 的控件工具箱中找不到該控件，需要在控件工具箱點擊右鍵，在右鍵菜單中選擇“附加控件”，在附加控件對話框中，找到“Microsoft Web Browser”并且勾選。
控件工具箱中出現一個地球形狀的控件，這樣就可以把該控件和其他控件一樣，拖放到用戶窗體中使用。
﹥﹥制作方法：
■第一步：拖拽控件到窗體上，添加兩個按鈕。一個是打開網頁按鈕，一個是填入數據按鈕、一個點擊【提交按鈕】的按鈕。（實際可以合為一個按鈕，這里只是為了方便演示操作）
■第二步：分析網頁結構，找出需要填寫的表單文本框ID，還有提交按鈕的ID。
網頁F12調出開發者工具，可以看到，對應于網頁上具體的控件內容，都有具體的html代碼。
找到填寫昵稱的代碼段，我們看到，昵稱文本框的ID為"inputName"，這就是我們需要的。用相同的方法，找到其他幾個文本框的ID。
■第三步：雙擊"打開網頁"按鈕，填入以下代碼；
Private Sub CommandButton1_Click() UserForm1.WebBrowser1.Navigate "http://zc.7k7k.com/" UserForm1.WebBrowser1.Silent = True'禁止安全彈窗提醒 End Sub
雙擊"填入數據"按鈕，填入以下代碼
Private Sub CommandButton2_Click()
With UserForm1.WebBrowser1.Document
.getElementById("inputName").Value = Range("a2")
.getElementById("inputPwd").Value = Range("b2")
.getElementById("inputRePwd").Value = Range("b2")
.getElementById("inputRealName").Value = Range("c2")
.getElementById("inputCardId").Value = Range("d2")
End With
End Sub
雙擊"點擊按鈕"按鈕，填入以下代碼：（實現提交按鈕的點擊）
Private Sub CommandButton3_Click() Set doc = UserForm1.WebBrowser1.Document For i = 0 To doc.All.Length - 1 If (LCase(doc.All(i).tagname)) = "input" Then If (LCase(doc.All(i).Type)) = "submit" Then Set tg = doc.All(i) tg.Click Exit Sub End If End If Next i End Sub
這只是個簡單的例子，復雜的網頁需要具體的分析解決。
我們也可以利用WebBrowser控件提取網頁的數據，因為網頁都是加載成功后的數據，所以內容基本都能提取成功。
述：本文將討論如何用最簡單的術語在網站上運行 C# 代碼。半技術講座我使用了 wasm-tools-net7，這是一個基于 wasm-tools 的工作負載，沒有包含任何額外的包。我的重點是簡單性和主要主題。徹底了解該主題可提供完成所有其他任務所需的信息。如何工作？WebAssembly 工作原理：序列圖創建演示創建項目我用的是net7，但這取決于你。Dotnet new console -o WASM_Demo cd WASM_Demo Dotnet workload install wasm-tools-net7此時，需要對 csproj 文件進行修改。Project Sdk=Mi
本文將討論如何用最簡單的術語在網站上運行 C# 代碼。
我使用了 wasm-tools-net7，這是一個基于 wasm-tools 的工作負載，沒有包含任何額外的包。我的重點是簡單性和主要主題。徹底了解該主題可提供完成所有其他任務所需的信息。
WebAssembly 工作原理：序列圖
Dotnet new console -o WASM_Demo
cd WASM_Demo
Dotnet workload install wasm-tools-net7
此時，需要對 csproj 文件進行修改。
<Project Sdk="Microsoft.NET.Sdk">
<PropertyGroup>
<OutputType>Exe</OutputType>
<TargetFramework>net7.0</TargetFramework>
<ImplicitUsings>enable</ImplicitUsings>
<Nullable>enable</Nullable>
<RuntimeIdentifier>browser-wasm</RuntimeIdentifier>
<WasmMainJSPath>main.js</WasmMainJSPath>
<AllowUnsafeBlocks>true</AllowUnsafeBlocks>
</PropertyGroup>
<ItemGroup>
<WasmExtraFilesToDeploy Include="index.html" />
<WasmExtraFilesToDeploy Include="main.js" />
</ItemGroup>
</Project>我們添加了什么：
返回到program.cs文件，需要考慮某些規則。
讓我們舉個例子。
using System.Runtime.InteropServices.JavaScript;
namespace WASM_Demo;
public partial class Program
{
static void Main(string[] args) { }
[JSExport]
public static string Response()
{
return """
<h1>
Hello World
</h1>
""";
}
}沒關系，但是我們如何在瀏覽器中運行此代碼？
運行這個程序的代碼是dotnet.js的，它自帶了wasm-tools，所以沒有必要擔心它。要使用此dotnet.js，我們只需使用一個名為 main.js 的文件。
import { dotnet } from './dotnet.js'
const is_browser = typeof window != "undefined";
if (!is_browser) throw new Error(`Expected to be running in a browser`);
const { setModuleImports, getAssemblyExports, getConfig, runMainAndExit } = await dotnet
.withDiagnosticTracing(false)
.withApplicationArgumentsFromQuery()
.create();
const config = getConfig();
const exports = await getAssemblyExports(config.mainAssemblyName);
const html =
exports
.WASM_Demo // Namespace
.Program // Class Name
.Response(); // Function Name
// Regular javascript code
document.getElementById("app").innerHTML = `${html}`;
await runMainAndExit(config.mainAssemblyName, [] /* Console App Args */);index.html頁面的模板已經準備完畢。
<!DOCTYPE html>
<html lang="en">
<head>
<title>WASM Demo</title>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="modulepreload" href="./dotnet.js" />
</head>
<body>
<main id="app"></main>
<script type="module" src="./main.js"></script>
</body>
</html>現在，讓我們再看一遍這個過程，
我們還有一件事要做，你需要打開一個名為 runtimeconfig.template.json 的文件，并將以下 JSON 數據放入其中。
{
"wasmHostProperties": {
"perHostConfig": [
{
"name": "browser",
"html-path": "index.html",
"Host": "browser"
}
]
}
}我們已經到了盡頭，程序現在可以運行了。唯一需要的命令是：
Dotnet run -c Release
我可以托管所有文件而不是 wasm-tools 嗎？又是如何做到的呢？
當然，但它可能會變得有點復雜，你用 wasm-tools 制作的項目不能用于任何其他目的，即控制臺應用程序不起作用，wasm-tools 可以工作。因為我們選擇 browser-wasm 作為 RuntimeIdentifier，并且多個 RuntimeIdentifiers 在 .NET 中不可用。作為替代方法，您可以打開兩個項目，將第一個項目設置為 WASM 項目，然后在第二個項目中將其設置為控制臺應用程序，然后生成第一個項目并托管輸出文件夾，所有 DLL 和文件都將在那里。
這個演示只是索引文件，我可以做多頁嗎？又是如何做到的呢？
當然，但這比你想象的要難得多，因為這樣做的方法是一種叫做SPA（單頁應用程序）的方法，用戶總是在同一頁面上，只是內容發生了變化。有多種方法可以做到這一點。所以它可以用你的創造力來完成。
我可以像計數器一樣做動態代碼嗎？又是如何做到的呢？
_是的，我也這樣做了，你可以一遍又一遍地調用 C# 函數，如果你只是將導出綁定到 window 對象，你可以從每個 JavaScript 代碼中調用它。
文主要以 HackerScreenSaver 新功能的開發經歷介紹 webBrowser中網頁如何調用.NET方法的過程。
之前開源了一款名為 HackerScreenSaver 的 Windows 屏保程序。該程序具有模擬黑客炫酷界面的特點，用戶可以將自定義的網頁作為鎖屏界面。不久前，有網友提出一個有趣的需求：能否在退出屏保時需要輸入密碼？雖然我不太清楚他的用意，但這個其實可以安排，不過需要變通一下。
之前做這個程序的時候我就發現，屏幕保護程序需要自己處理退出，如果屏保程序設計得不夠合理，可能會導致用戶在無法正常退出屏保時遇到困擾。所以在設計之初，我添加了 MouseKeyHook 用來監聽全局的鍵鼠事件。
那么設計新的功能來實現網友的需求也很簡單，當然不是直接的設計什么密碼輸入，然后判斷退出的功能。這里只需將屏保退出的功能提供給網頁控制就可以了。
之前介紹到為了程序簡易軟件采用了 webBrowser，那么為了讓網頁可以決定什么時候退出屏保，就需要讓 webBrowser 中的網頁可以調用 .NET 的方法。
在網頁中，我們需要在屏保退出的邏輯部分添加一段 JavaScript 代碼，用于調用 .NET 方法。這段代碼的核心是 window.external 對象，它允許 JavaScript 訪問 .NET 對象。我們在用戶輸入正確密碼或者游戲勝利等條件下執行下面的 JavaScript 代碼即可：
window.external.ExecuteExitSrc();對于 .NET 代碼，可以創建一個和單獨的類以供 web 調用：
[ComVisible(true)]public class JavaScriptInteraction{public void ExecuteExitSrc(){Application.Exit();}}
需要注意的是，我們需要在該類上添加一個 [ComVisible(true)] 特性。這個特性使得該類的公共成員可以被 COM 組件訪問，從而實現 JavaScript 與 .NET 方法之間的互操作，否則你會收到下面的錯誤信息：
System.ArgumentException:“ObjectForScripting 的類必須對 COM 可見。請確認該對象是公共的，或考慮向您的類添加 ComVisible 特性。”最后，需要在 webBrowser 控件的 ObjectForScripting 屬性中設置一個 .NET 對象，這個對象將用于被 JavaScript 調用：
webB.ObjectForScripting = new JavaScriptInteraction();為了演示新功能的使用，在 html 目錄中，提供了一個演示用的 exit.html 直接提供了網頁退出屏保的演示按鈕。
新的功能提供了更多的可玩性，用戶可以根據自己的喜好設計各種有意思的屏保，這樣也是滿足了輸入密碼退出這個功能的實現基礎。當然我們可以有許多有意思的功能可以自行設計，比如：
1.解謎屏保：設計一個帶有簡單謎題的屏保，用戶需要在網頁上回答正確才能退出屏保。謎題可以是數學題、邏輯題或者常識題等，每次屏保激活時，可以隨機從題庫中抽取一道題目。既然是題庫，甚至可以利用屏保學習各種知識，比如英語單詞，各種考試題等等。2.拼圖屏保：制作一個拼圖游戲，用戶需要在網頁上完成拼圖才能退出屏保。可以使用用戶自己的照片作為拼圖素材，或者從網上隨機抓取圖片。拼圖難度可以根據用戶的喜好進行調整。3.計時屏保：設置一個倒計時屏保，用戶需要在網頁上等待一段時間（例如，1分鐘）后才能退出屏保。在等待期間，可以展示一些有趣的事物，如名言警句、美麗的圖片或者實時新聞等。
通過這些有趣的屏保設計方案，用戶在退出屏保時可以享受到更多互動和趣味性。此外，這些方案還可以根據用戶的喜好和需求進行定制和擴展，為用戶帶來更豐富的屏保體驗。
同時，我還在更新中提供了一個經典的 2048 小游戲，要求玩家在贏得游戲后才能退出屏保。
這個游戲改的邏輯其實是沒有改好的，也懶得調整了，更新一下游戲介紹也是可以的。
當玩家在游戲中努力拼搏，最終贏得游戲時，他們可能會發現，游戲并沒有因此結束，屏保依然繼續運行。這時，他們可能會意識到，即使付出了努力，結果也不一定如人意。而當玩家選擇投降并重新開始游戲10次后，他們將發現這個看似無用的操作竟然讓屏保退出，讓電腦恢復正常使用。
也許只有努力過才會發現，游戲還是投降躺平舒服些，只需要重開十次，就會被比你努力湊齊 2048 贏得游戲來退出屏保更快。人生有時就是這樣，在現實生活中，我們往往會面臨兩種選擇：努力拼搏還是躺平投降。有時候，努力拼搏的結果并不一定能讓我們達到預期的目標，反而可能讓我們陷入更深困境，帶來更多的困擾。而在某些情況下，選擇躺平投降，反而能讓我們以更輕松的心態面對問題，從而找到解決問題的更快方法。當然，該拼搏的時候，還是需要努力一把，萬一就成功了呢？
本文向大家介紹了如何在 webBrowser 中的網頁調用 .NET 方法，以及如何在屏保程序中加入游戲元素。通過這些技巧，我們可以為用戶帶來更有趣的屏保體驗。希望本文能對大家有所幫助，最后項目地址是：https://github.com/sangyuxiaowu/HackerScreenSaver?wt.mc_id=DT-MVP-5005195 感興趣的話，可以下載體驗一下。
*請認真填寫需求信息，我們會在24小時內與您取得聯系。
