PowerShell自动化IE填写支付表单时输入内容无法留存问题求助

问题原因 #

当前多数网站的支付表单使用了React/Vue等前端框架开发，表单值和框架内部状态做了双向绑定，直接给DOM元素的value属性赋值不会触发框架的状态同步，就会出现表面有值、实际提交时识别为空的问题。 #

解决方法 #

方案1：赋值时主动触发表单事件（优先尝试）

赋值前后触发焦点、失焦动作，同时手动触发input和change事件，让前端框架感知到值的变更，修改后可直接运行的代码如下：

$cardnumber = "4000 1000 2000 0000"
$nameoncard = "Alban Mysteriousguy"
$expirationdate = "10/77"
$ccv = "420"
$ie = New-Object -COMObject InternetExplorer.Application
$ie.visible = $true
$ie.Navigate('https://secure2.ldlc.com/fr-fr/DeliveryPayment')
# 等待浏览器加载完成
while ($ie.Busy -eq $true) { Start-Sleep -Seconds 1; }    

# 封装通用赋值函数，自动触发所有必要事件
function Set-InputValue($inputElement, $value) {
    $inputElement.focus()
    Start-Sleep -Milliseconds 100
    $inputElement.value = $value
    # 触发input事件，同步输入状态
    $inputEvent = $ie.document.createEvent("Event")
    $inputEvent.initEvent("input", $true, $false)
    $inputElement.dispatchEvent($inputEvent)
    # 触发change事件，同步值变更状态
    $changeEvent = $ie.document.createEvent("Event")
    $changeEvent.initEvent("change", $true, $false)
    $inputElement.dispatchEvent($changeEvent)
    $inputElement.blur()
    Start-Sleep -Milliseconds 100
}

# 卡号赋值
$cardNumberEl = $ie.document.getElementsByName("CardNumber") | Select-Object -first 1
Set-InputValue $cardNumberEl $cardnumber

# 持卡人姓名赋值
$ownerNameEl = $ie.document.getElementsByName("OwnerName") | Select-Object -first 1
Set-InputValue $ownerNameEl $nameoncard

# 有效期赋值
$expDateEl = $ie.document.getElementsByName("ExpirationDate") | Select-Object -first 1
Set-InputValue $expDateEl $expirationdate

# CVV赋值
$cvvEl = $ie.document.getElementsByName("Cryptogram") | Select-Object -first 1
Set-InputValue $cvvEl $ccv

# 原有勾选协议、提交逻辑
$payementButton = $ie.Document.getElementsByTagName('button') | Where-Object { ($_.ClassName -ceq 'button color2 maxi') }
$CGV = $ie.Document.getElementsByTagName('label') | Where-Object { ($_.for -ceq 'terms') }
$CGV.click()
# $payementButton.click()

方案2：系统级按键模拟（方案1无效时使用）

如果网站做了特殊的输入校验，事件触发不生效，可以调用系统按键模拟能力输入内容，运行时不要操作鼠标键盘避免窗口焦点丢失：

# 新增在脚本顶部
$wshell = New-Object -ComObject wscript.shell
# 激活IE窗口
$wshell.AppActivate($ie.HWND)
Start-Sleep -Seconds 1

# 以卡号输入为例，替换原有赋值逻辑即可
$cardNumberEl.focus()
Start-Sleep -Milliseconds 200
$wshell.SendKeys($cardnumber)
Start-Sleep -Milliseconds 200

内容的提问来源于stack exchange，提问作者Alban M