How can use a property later in the rxjs observable stream? - rxjs

I send a request to a server and got a response with a body and a cookies property
{body:[row1,...,rowN], cookies:sessionData}
in the next step i want to transform the data to match my needs
in (1) there is the res object that includes the above structure, res is at (2) no longer valid of course, because it's another scope. Is there a rx-way to deal with it and get cookies later or have I implement a structure in the first mapping (1) where I include the cookies? in the streamed data?
this.sendRequest("find",params) // send request with some query parameters
.map((res:Library.Response) => JSON.parse(res.body)) // (1) get the parsed body
.map((data) => this.filterFindings(data)) // get only the good ones
.map((data) => this.addCookies(data, res.cookies) // (2) want to add the cookies from res

You can nest your call to keep the response in scope:
this.sendRequest(...).pipe(
switchMap(res => of(res).pipe(
map(res => JSON.parse(res.body)),
//...
map(data => addCookies(data, res.cookies))
)
);

Related

Overwrite Laravel Http Faker

Is there a way to overwrite values of Http::fake([]) in Laravel during testing. I've noticed that if I set a value during a faker, eg. Http::fake(['url1.com' => Http::response('OK'), 'url2.com' => Http::response('Not Found', 404),]), if for some reason I need to change the value of say url1.com to something else such as ['message' => 'Success'], if I "update" the value by calling Http::fake(['url1.com' => Http::response(['message' => 'Success']) again at a later point, I'd expect the response when I call Http::get('url1.com') to return ['message' => 'Success'] but it instead always returns OK which was the original value set.
Same way if I later call Http::fake(['url2.com' => Http::response(['message' => 'Object found.'])]), I would expect the response when I call Http::get('url2.com') to be ['message' => 'Object found.'] but it'll always return Not found which was the original value set.
You can use achieve this by swapping the Http client
Http::fake(['https://potato.com' => Http::response('Yummy!', 200)]);
dump(Http::get('https://potato.com')->body()); // Yummy!
at some point in your test, you can reset the Http Facade using Facade Swap
Http::swap(app(\Illuminate\Http\Client\Factory::class));
now you can change the fake value to whatever you want
Http::fake(['https://potato.com' => Http::response("That's what the dcotor ordered.", 200)]);
dump(Http::get('https://potato.com')->body()); // That's what the doctor orderd.

RxJS Observable on Axios how to get access to the Response

I am working on getting a response from an HTTP POST in my NestJS project. I am using the HttpModule which wraps Observables from RxJS around Axios. here's some code:
async doSomething(bar: Bar) {
const resp = await this.httpService
.post(`${UPLOAD_URL}?app_token=111222333`, {
foo: bar
})
.pipe(map(response => response))
.toPromise()
.catch(err => {
this.logger.error(err)
})
this.logger.debug('response object')
this.logger.debug(resp)
}
In this particular case, I just want to see what the result of the resp object is. I'm getting a Converting circular structure to JSON error, though. So my question is, how would I view the response? I am okay with viewing it with the .toPromise() chain or without it. I'm not familiar with Observables so I convert it to a Promise. Not sure if that's a huge perf hit, but it isn't important for this question.
The map you are using is not helpful, as it does not actually do any mapping of the response. If you are wanting to log something in the observable without changing it you can use the tap operator and do something like
this.httpService().post(url, data).pipe(
tap((data) => console.log(data),
).toPromise()
the reason you are getting the Converting circular structure to JSON error is because the Nest Logger will JSON.stringify() objects and does not use a circular replacer. Consider stringifying the object yourself with a circular replacer, using console.log() or using a different logging library.

Can't access request data in production but can in local env

I'm working with a legacy Cakephp 2 app and need to create users via AJAX post on another domain.
I've got the whole thing working nicely in my local environment but have been battling with my prod environment.
I am using Postman to form a consistent Post request and setting the various headers as well as setting data values.
Locally:
I send a post request to a URL and var_dump the entire request object into the response. I can see that my data is populated. $this->request->data['email'] returns exactly what I expect.
Production:
I deploy the exact same code and my data array is completely empty.
I have set my Access-Control-Allow headers and I'm not getting any authisation issues. I can interact with the request within the application but I can not access any data. The request is the same request just a different endpoint.
I am running identical versions of PHP and exactly the same codebase.
Can anyone think of any environmental factors that might affect the request data?
This is my controller code in brief:
public function remoteadd() {
var_dump($this->request);
if ($this->request->is('ajax')) {
$this->disableCache();
$this->autoRender = false;
$this->response->type('json');
$this->User->create();
$gen_pass = $this->generatePassword();
$this->request->data['password'] = $gen_pass;
$emailAddr = $this->request->data['email'];
// Check if this email exists
$conditions = array(
'User.email' => $emailAddr,
);
if (!$this->User->hasAny($conditions)) {
if ($this->User->save($this->request->data)) {
$this->response->statusCode(200);
$this->response->body(json_encode(
array('status' => 'success', 'message' => 'New account successfully created')
));
}
} else {
$this->response->statusCode(500);
$this->response->body(json_encode(
array('status' => 'error', 'message' => 'Email address already exists')
));
}
$this->response->send();
$this->_stop();
}
}
It seems like the issue related to CORS preflight. Two requests are actually triggered. The first is a preflight which given my controller action is not returning any data as it's not actually a legitimate post request. The second request/response has the data appropriately loaded as expected.

ReduxObservable cancellation based on action type and its data

I have React app which uses redux-observable with typescript. In this scenario, FetchAttribute Action gets triggered with a id and then make an ajax call.
In certain case, I would want to cancel the ajax request if "FETCH_ATTRIBUTE_CANCEL" action was triggered with the same id as of "FetchAttributeAction" action.
action$.ofType(FETCH_ATTRIBUTE)
.switchMap((request: FetchAttributeAction) => {
return ajax.getJSON(`/api/fetch-attribute?id=${request.id}`)
.flatMap((fetchUrl) => {
// return new action
})
.takeUntil(action$.ofType(FETCH_ATTRIBUTE_CANCEL));
});
interface FetchAttributeAction{
id: number;
}
Problem:
How do we cancel the execution based on action type + action data?
In my case, it would FETCH_ATTRIBUTE_CANCEL and id.
The key is to filter actions in the takeUntil notifier to only those which match the ID you care about.
action$.ofType(FETCH_ATTRIBUTE_CANCEL).filter(action => action.id === request.id)
So here's what it might look like:
Demo: https://stackblitz.com/edit/redux-observable-playground-xztkoo?file=fetchAttribute.js
const fetchAttributeEpic = action$ =>
action$.ofType(FETCH_ATTRIBUTE)
.mergeMap(request =>
ajax.getJSON(`/api/fetch-attribute?id=${request.id}`)
.map(response => fetchAttributeFulfilled(response))
.takeUntil(
action$.ofType(FETCH_ATTRIBUTE_CANCEL).filter(action => action.id === request.id)
)
);
You can also take a look at previous questions:
Redux Observable: If the same action is dispatched multiple times, how do I cancel one of them?
Independent chain cancellation in redux-observable?
Dispatch an action in response to cancellation
The OP also pointed out that they were using switchMap (as did I originally when I copied their code) which would have meant that the epic only ever had one getJSON at a time since switchMap will unsubscribe from previous inner Observables. So that also needed to be chained. Good catch!
I think you should be able to make takeUntil selective for a certain action id with pluck and filter.
ex:
.takeUntil(action%.ofType(FETCH_ATTRIBUTE_CANCEL)
.pluck('id')
.filter((cancelActionID) => cancelActionID === fetchID))
The non-obvious part to me is how to get the current fetchID to run that comparison. I might consider try using do to store in a temporary variable

How to customize the CRUD response toaster message [admin-on-rest]

I want to add server response message in CRUD response toaster. For Example when we do an update, we will get 'Element updated' toaster message. Instead of it I want to show some dynamic (not static) server responded message.
This is only supported for error messages currently. If this is really important, please open a feature request and we'll consider it.
A slightly long winded way to do this. But definitely possible.
1) Write a custom restWrapper or RestClient
https://marmelab.com/admin-on-rest/RestClients.html
2) Handle the request and response from it like below.
function handleRequestAndResponse(url, options={}, showAlert={}) {
return fetchUtils.fetchJson(url, options)
.then((response) => {
const {headers, json} = response;
//admin on rest needs the {data} key
const data = {data: json}
if (headers.get('x-total-count')) {
data.total = parseInt(headers.get('x-total-count').split('/').pop(), 10)
}
// handle get_list responses
if (!isNaN(parseInt(headers.get('x-total-count'), 10))) {
return {data: json,
total: parseInt(headers.get('x-total-count').split('/').pop(), 10)}
} else {
return data
}
})
}
3) you now have a place in your code where you can intercept the data from the server. In above code you can define and shoot actions containing your data whenever you need. Create a reducer that takes the data from your action and populates a field in the state you can call it notification.
4) Use the redux-saga select method
How to get something from the state / store inside a redux-saga function?
You can now access the notification data from the store and show custom toaster messages to your heart's content :)

Resources