react-native : Get internal api call data from url of the WebView - javascript

I have a webview with a url (for example a payment processing page). When the url is loaded, certain api calls are done and i want to know how to get data from the internal api calls of that particular url.
It is not something like communication between webpage and react native code. ( window.ReactNativeWebView.postMessage or onMessage )
I need internal api call response data from the webpage.

Solution 1:
you can inject js into webview to get api detail
var open = XMLHttpRequest.prototype.open;
XMLHttpRequest.prototype.open = function() {
this.addEventListener("load", function() {
var message = {"status" : this.status, "responseURL" : this.responseURL}
webkit.messageHandlers.handler.postMessage(message);
});
open.apply(this, arguments);
};
Solution 2:
right now, there is no way to intercept webview internal API calls.
you can add support for this in webview
Android
In android you have to use
WebViewClient.shouldInterceptRequest()
you can add bridging method REF

I think you can inspect/log the network requests by setting up a (WiFi) proxy:
Step-by-step instructions for Fiddler
Another how-to for Proxyman
Related StackOverflow question

Related

Angular and Server Sent Events: close method call does not close the data stream

Tech stack: Angular 7, Spring webflux (with spring boot), Chrome browser
I cannot share the actual code due to policy restrictions. Appreciate your understanding.
I have followed this example: https://medium.com/#chrisbautistaaa/server-sent-events-in-angular-node-908830cc29aa
I have a boolean variable makeCall acting as a condition switch for my if else
When user clicks a button on screen toggleSseCall method containing the below logic is called in Angular component
Body of toggleSseCall method:
makeCall: boolean = true;
toggleSseCall() {
let eventSource = new EventSource(url);
if(makeCall) {
Call service method: getServerSentEvents(eventSource) //similar to the example in link one difference being i'm passing the Instantiated eventSource reference
Subscribe to the observable returned by the above call like in the example and console log the data
} else { //When user clicks the button again, call goes here as makeCall is false
//Call flow comes here as expected, I verified that with console logging
eventSource.close(); //I verified to make sure the close method is not uppercase or anything like that
}
makeCall = !makeCall //toggle boolean flag
}
Server side:
Just RESTFul Get Api call that returns Flux and the Flux just returns hello string every x seconds
The call is happening and the "hello" text streams from back-end to front-end as expected. But, the data stream doesn’t stop on call to close method. I want the data stream to close when user clicks the button again. Would appreciate any suggestions on this.
A bit late, but I just came across this issue myself. For me, this only happens when developing locally via ng serve, using the Webpack dev server to proxy requests to my backend app.
The proxy is implemented using the NPM package http-proxy-middleware. There's
an unresolved issue suggesting this is a bug.
When the browser connects directly to the backend API, this issue doesn't happen for me.

Actions-on-Google SDK: respond without registering handlers

I am working on an app for Google Home and Google assistant.
I use express as a web server for the fullfillment. In most cases, I manually check the request to decide what to respond and manually send a JSON as express response.
In some cases, I use the actions-on-google SDK which is set up as the following instead to send the reply.
const { DialogflowApp } = require("actions-on-google");
const assistant = new DialogflowApp({
request: request,
response: responseToAssistant
});
In version 1.11 of actions-on-google SDK, I could also use assistant.tell('Thanks for talking to me!'); to send a response (instead a manual JSON).
I've now updated to version 2.2. However, in this version it looks like I have to register the handlers for all intents, to use the actions-on-google SDK to send a response.
app.intent('Default Welcome Intent', conv => { // (registering intent)
conv.close('Thanks for talking to me!');
});
However for that, I would have to restructure the whole project. Is it somehow possible to still check the request manually (without registering all intent-handlers) and use the actions-on-google SDK to send a response?
You can set a handler that will be called in the event none of the other registered handlers would be triggered. Your code would be something like this:
app.fallback(conv => {
conv.ask("Everything else is handled here!");
});
If you want to set the raw JSON in these cases, you should be able to call the conf.json() method with the JSON you want to set.

Starting new Angular application in new Browser window

I have a web application that I need to open a new browser window from and load an angular application into it. I Dont see any problems with that by dong the following:
var windowObjectReference = window.open(strUrl, strWindowName, [strWindowFeatures]);
After getting a reference to a new window I can call its function and send data to it. Sending data is the critical function. I am a bit fuzzy however how exactly Angular app will be getting this data. Will I be able to call a $rootScope function using windowObjectReference?
Any ideas?
Thanks
I would use whatever backend api you are using for your web app to pass the data instead. That way, your angular app should be set up to use the http library that's built in to request that data from there on load. That way you have a lot more angular constructs that can help you along the way. An example of the code in your angular app would look like this:
var onGetResponse = function(data) {
$scope.appData = data;
}
var onGetError = function(reason) {
$scope.responseError = "Could not get the app data.";
alert($scope.responseError);
}
$http.get('/appData').success(onGetResponse).error(onGetError);
The bottom statement actually makes the call to your backend api and when it gets a successful response, it will call the top. Then your angular app can access the information with {{appData}}.
There are many method by which a window can talk with a window, from the same domain, it opened:
Shared Workers and Service Workers can communicate with all windows from the same domain.
With window.postMessage you can send a receive messages from
opened windows, and iFrames.
Local storage can be used for communications between windows
from the same domain, using the storage event that is fired when a key content is changed.
The old method is using window.opener. The opened window can
refer to it's parent and request the information it needs. The
parent just have to store an object on the window with the needed
methods.
You can also send information via the url using the hash # part.
You can encapsulate most of this methods in a service on both the opened an window and the opener. btw - don't forget $apply with any of this methods.

Posting messages from a service worker to a client page

Today we can find many examples of sending message from a service worker to a client, but always following the reception of a message event in the service worker.
I would like to know if we can send messages independently of this event? And if yes, how? I tried few things, without success...
In my case, it's for redirect a client to a new page when my service worker receives a push event.
client.js :
const swListener = new BroadcastChannel('swListener');
swListener.onmessage = function(e) {
console.log('swListener Received', e.data);
};
service-worker.js
const swListener = new BroadcastChannel('swListener');
swListener.postMessage('This is From SW');
The interface for Client.postMessage() is described at https://github.com/slightlyoff/ServiceWorker/issues/609. Unfortunately, it is not fully implemented in Google Chrome as of version 45, though I'd expect it to make it into a version at a later date.
When the functionality's available, you could use self.clients.matchAll() to obtain a list of any open pages that are being controlled by the service worker, and call the postMessage() method on the specific client that you care about. You need to keep in mind that it's entirely possible that there won't be any tabs open with a page controlled by your service worker, in which case you'd want to do something like open a new client page with your target URL.
But, there's a method that's probably more appropriate for your use case (though also not currently support in Chrome 45): WindowClient.navigate(), which will instruct an open tab controlled by your service worker to navigate to a different URL on the same origin.

What parameters are required to share content from my BlackBerry WebWorks Application via Twitter's native BlackBerry implementation using Invoke?

I am displaying a list of tweets in my BlackBerry WebWorks application that the user should be able to share via Twitter.
I want to use Twitter's native BlackBerry client, and am calling it via an invoke object. I can launch the Twitter application fine, but does anyone know what parameters are needed to skip directly to sharing content from my application?
I am using the following to successfully invoke the Twitter client:
try{
var params = new Array();
var args = new blackberry.invoke.JavaArguments('net_rim_bb_twitter', params);
blackberry.invoke.invoke(blackberry.invoke.APP_JAVA, args);
}catch(e){
alert("Could Not Invoke App: "+e.name+" : "+e.message);
}
Thanks everybody!
From WebWorks in order to invoke other application you need to use JavaArguments (as you do), but don't add parameters as it won't work use only module name:
new blackberry.invoke.JavaArguments('net_rim_bb_twitter');
This way the code will try to invoke 'net_tim_bb_twitter'.
Looking in BB's github and how JavaArguments are implemented - it takes the first parameter and creates a URL query from the Array arguments. If you add parameters like ["par=val","par2=val2"] then the code will try to start 'net_rim_bb_twitter?par=val&par2=val2" which won't start anything if not specified by the OS or the app. The idea with parameter is to invoke apps that are listening for URLs.
Using without parameters will just start the app but it won't prefill the desired fields within the app, so you need to create a screen in your app to post to twitter or just use the web intents https://dev.twitter.com/docs/intents and BrowserArguments to start nice little twitter web app prefilled with data from your web app.

Categories