Vaadin JavaScript API集成

Question

我正在尋找任何類型的幫助（通用的或特定的），以為客戶端庫生成Braintree Payments API的Vaadin 客戶端 Java實現。

我可以滿足Braintree協議的所有服務器端Java要求，也可以在一段內聯JavaScript代碼之間進行RPC，但它無法使用Braintree .js API。

客戶端代碼（均在此處進行了總結）建議使用我打開的“托管字段”以及它們的Drop-In UI。 真的，任何事情都會發生。

hostedFieldsInstance.tokenize(function (tokenizeErr, payload) {
    if (tokenizeErr) {
      // Handle error in Hosted Fields tokenization
      return;
    }

    // Put `payload.nonce` into the `payment-method-nonce` input, and then
    // submit the form. Alternatively, you could send the nonce to your server
    // with AJAX.
    document.querySelector('input[name="payment-method-nonce"]').value = payload.nonce;

還應該有可能直接標記信用卡信息 ，這對我來說是最重要的一步。 在Vaadin中整合應該是一個不同的過程，也許有人更了解這種方式？

我將如何處理這樣的事情？

Answer 1

最簡單，最快的方法可能是使用AbstractJavascriptComponent或AbstractJavasciptExtension。 這些是可子類化的，並提供了一種將JS代碼鏈接到可以在服務器端進行操作的組件的簡便方法。 AbstractJavascriptComponent可能是兩者中最好的，因為它們為您提供了一個div元素，您可以使用js完全控制它，而無需vaadin對其進行操作。 這可以簡化IMO，因為您可以避免使用GWT並使用那里的連接器類。

這里有一些鏈接可以幫助您入門

https://vaadin.com/blog/-/blogs/vaadin-7-loves-javascript-components

https://vaadin.com/wiki/-/wiki/Main/Integrating%20a%20JavaScript%20library%20as%20an%20extension