I have a very simple Typescript script (ionic2 and angular2) that add an authentication header before an HTTP call. Here is the idea (simplified code):
function CreateAuthorization(){
this.header.append('tests' : 'test')
Storage.retrieve('Auth').then(data){
this.header.append('authorization' : data.token)
}
}
function customHttp(url){
CreateAuthorization();
Http.get(url, this.header);
}
In my Request header, I have 'test' = 'test' but I do NOT have 'authorization' = 'MyToken'.
How can I make in sort to "wait" for the header to be set in Storage.retrieve('Auth') ?
I know that I can use a setTimeout() but I don't like this dirty workaround.
The solution could be an observable/promise but I don't really master those things.
Any help would be very appreciated :)
Geoffrey
It's because your CreateAuthorization method is asynchronous. I would try something like that leveraging promise chaining to be notified when the Authorization header is actually added:
createAuthorization() {
this.header.append('tests' : 'test');
return Storage.retrieve('Auth').then(data){
this.header.append('authorization', data.token);
return true;
}
}
customHttp(url) {
this.createAuthorization().then(() => {
this.http.get(url, { headers: this.header });
});
}
Related
I have an intercept that serves up a stubbed json response like this:
cy.intercept('GET', '**/api/v1/myroute/*', { fixture: 'myData.json' }).as('myAlias')
Is there a way I can remove this intercept halfway through a test somehow? I was hoping to delete the alias so the xhr request doesn't get intercepted at all. Thanks!
OK, figured this one out. Simply do this:
cy.intercept('GET', '**/api/v1/myroute/*', (req) => {
req.continue()
});
You can try to use RouteMatcher's times option like this:
cy.intercept({
method: 'GET',
pathname: '/api/v1/myroute/*'
times: 1
}, { fixture: 'myData.json' }).as('myAlias')
so when it is called a second time it won't be intercepted
i have simple code in meteor js for find near by garages within 10 Kilometres the query works fine in my mongodb database if run it manually in robomongo it works fine but when i run it in my routes it throws an error. like this.
Error: Unrecognized operator: $nearSphere in meteor jsi
i see some blogs they said you need to call a server side method for this. so i use below code to call a server side route.
Router.route('/search/:name',
{name:'searchlist',
data:function(){
var searchedParams = this.params.name.split('-');
var lat = searchedParams.pop();
var lng = searchedParams.pop(1);
return {searchValue: Centers.find({ coordinates: { $nearSphere: { $geometry: { type: "Point", coordinates: [lng,lat] }, $maxDistance: 10000 } } })}
}
}, { where: "server" }
);
if anyone have idea please help.
You're mixing definitions for client and server side routes.
Server-side route should look like this:
Router.route('/search/:name', function(...){...}, { where: 'server' });
Client-side route could look like this:
Router.route('/search/:name, { ... });
Thus, your route is actually client-side route and minimongo doesn't have support for $nearSphere operator as noted here: https://github.com/meteor/meteor/blob/devel/packages/minimongo/NOTES
First, look at Styx answer and make the route a client route by eliminating this part:
', { where: "server" }'
Now that the router is available to the client, let's fix the $nearSphere issue, by changing the operator to $near. Use the following code:
Centers.find(
{
geoloc: {
$near: {
$geometry: {
type: "Point",
coordinates: [lng, lat]
}
}
}
}
);
Give it a try and let me know if it works.
I am currently new to Meteor and Angular2 and I built an application with same.
I want to make External API call inside Meteor Server using Meteor HTTP Module.
Could you please give an example code in "Typescript" how to do this? Thanks in advance.
Use HTTP.call() for external invoking API. You can call both Get and post requests with this. See the documentation link for details.
Here is a simple example
HTTP.call('POST', 'http://api.twitter.com/xyz', {
data: { some: 'json', stuff: 1 }
}, () => (error, result) {
if (!error) {
Session.set('twizzled', true);
}
});
I feel like this scenario should be in the Angular 2 docs, but I can't find it anywhere.
Here's the scenario
submit a form (create object) that is invalid on the server
server returns a 400 bad request with errors I display on the form
after the subscribe comes back, I want to check an error variable or something (ie. if no errors > then route to newly created detail page)
I imagine it working something like this:
this.projectService.create(project)
.subscribe(
result => console.log(result),
error => {
this.errors = error
}
);
}
if (!this.errors) {
//route to new page
}
I'm very new to Angular 2 so this may come from my lack of understanding in how an Observable works. I have no issue with displaying that data on the form, but can't figure out how to see it within the ts component. I really just want to check the success/fail of the http create.
As stated in the relevant RxJS documentation, the .subscribe() method can take a third argument that is called on completion if there are no errors.
For reference:
[onNext] (Function): Function to invoke for each element in the observable sequence.
[onError] (Function): Function to invoke upon exceptional termination of the observable sequence.
[onCompleted] (Function): Function to invoke upon graceful termination of the observable sequence.
Therefore you can handle your routing logic in the onCompleted callback since it will be called upon graceful termination (which implies that there won't be any errors when it is called).
this.httpService.makeRequest()
.subscribe(
result => {
// Handle result
console.log(result)
},
error => {
this.errors = error;
},
() => {
// 'onCompleted' callback.
// No errors, route to new page here
}
);
As a side note, there is also a .finally() method which is called on completion regardless of the success/failure of the call. This may be helpful in scenarios where you always want to execute certain logic after an HTTP request regardless of the result (i.e., for logging purposes or for some UI interaction such as showing a modal).
Rx.Observable.prototype.finally(action)
Invokes a specified action after the source observable sequence terminates gracefully or exceptionally.
For instance, here is a basic example:
import { Observable } from 'rxjs/Rx';
import 'rxjs/add/operator/finally';
// ...
this.httpService.getRequest()
.finally(() => {
// Execute after graceful or exceptionally termination
console.log('Handle logging logic...');
})
.subscribe (
result => {
// Handle result
console.log(result)
},
error => {
this.errors = error;
},
() => {
// No errors, route to new page
}
);
Please note that the previous syntax with callbacks has been deprecated as of 6.4 and is going to be removed with 8.0. Instead of
of([1,2,3]).subscribe(
(v) => console.log(v),
(e) => console.error(e),
() => console.info('complete')
)
you should now use
of([1,2,3]).subscribe({
next: (v) => console.log(v),
error: (e) => console.error(e),
complete: () => console.info('complete')
})
https://rxjs.dev/deprecations/subscribe-arguments
You can achieve with following way
this.projectService.create(project)
.subscribe(
result => {
console.log(result);
},
error => {
console.log(error);
this.errors = error
}
);
}
if (!this.errors) {
//route to new page
}
Updated rxjs way 2022
this.projectService.create(project)
.subscribe({
next: (data)=>console.log('data',data),
error: (err)=>console.log('error',err),
complete:()=>console.log('complete')
});
I imported restivus using :
meteor add nimble:restivus
And while using Restivus I encounter this error on meteor startup :
"Cannot find name 'Restivus' ".
I can although GET requests but I wonder if it impacts the behavior of the app.
Here is the code used :
if (Meteor.isServer) {
// Global API configuration
var Api = new Restivus({
apiPath: 'api/',
prettyJson: true
});
}
When receiving POSTs my request.body and my bodyParams are empty :
Api.addRoute(':id/test', {
post: function () {
var id = this.urlParams.id;
console.log("Body contains : ");
console.log(this.bodyParams);
return {
status: 'success',
url : 'post test from id: '+id,
body : this.bodyParams
};
}
});
Does anyone know how to make this error disappear and if this is linked to the POST body problem ?
If you use Meteor 1.4+ you can try to import Restivus to your file with something like this:
import Restivus from 'nibmle:restivus';
The problem with post body being empty was caused by the request I made :
I wasn't specifying the Content-type header.
Once I specified the "Content-Type": "application/json" it worked.
The "Cannot find 'Restivus' " Error is still here though.
Your code looks ok. Here is some code from a server-only file that I am using:
// Global API configuration
var Api = new Restivus({
useDefaultAuth: true,
prettyJson: true,
apiPath: 'restAPI/',
defaultHeaders: { 'Content-Type': 'application/json;encoding="UTF-8"' }
});
// Generates: GET, POST on /api/items and GET, PUT, DELETE on
// /api/items/:id for the Items collection
Api.addCollection(Policy);
Perhaps you should move your code to the server directory? I am on Meteor 1.3.4.