GWT Javascript Injection and JSNI
How can I use the Javascript library (downloaded from CDN) inside the JSNI code?
For example, I would like to call the javascript Stripe method from this JSNI method:
private native void contactStripe(String creditCard, String cvc, String expiryMonth, String expiryYear) /*-{
$wnd.Stripe.setPublishableKey('my_stripe_publishable_key');
$wnd.Stripe.createToken({
number: creditCard,
cvc: cvc,
exp_month: expiryMonth,
exp_year: expiryYear
}, callBack);
}-*/;
... but the javacript Stripe method is undefined.
(more about Stripe.createToken method https://stripe.com/docs/tutorials/forms#create-a-single-use-token )
The Stripe javascript file is injected using the CDN url:
ScriptInjector.fromUrl("https://js.stripe.com/v1/").setCallback(
new Callback<Void, Exception>() {
public void onFailure(Exception reason) {
}
public void onSuccess(Void result) {
contactStripe("0000111122223333", "456", "04", "2014");
}
}).inject();
source to share
If you want a JS script to be injected in such a way that the global variables it defines are accessible through $wnd
, you must .setWindow
(
ScriptInjector.TOP_WINDOW
)
source to share
Try changing your code to:
private native void contactStripe(String creditCard, String cvc, String expiryMonth, String expiryYear) /*-{
console.log($wnd.Stripe); // Should log 'Object'
console.log($wnd.Stripe.createToken); // should log function
var obj = {
number: creditCard,
cvc: cvc,
exp_month: expiryMonth,
exp_year: expiryYear
};
consloe.log(obj); // Should be 'Object'
$wnd.Stripe.createToken(obj, callBack);
}-*/;
If you are using chrome debug tools you can check all these objects.
Update You do not provide a callback. It's your problem?
source to share