Mirage `passthrough` is not working - javascript

I'm trying to use passthrough for a POST request in this Ember project
this.passthrough('/thirdeye/entity?entityType=ANOMALY_FUNCTION');
This is what the call looks like in app/mirage/config.js.
I got the following error:
Mirage: Your Ember app tried to POST '/thirdeye/entity?entityType=ANOMALY_FUNCTION',
but there was no route defined to handle this request.
Define a route that matches this path in your
mirage/config.js file. Did you forget to add your namespace?
Clearly, I've added that call to the config file, but it's not being picked up. I read that passthrough only works for >= jquery 2.x, which my project is.
Does anyone know what else could cause this?

I found out the problem was I had to do this.passthrough('/thirdeye/***'); since the call has query params. It works now.

Related

Pulling Weather API Data and tweeting it

Apixu recently updated their endpoints(now weatherstack) and I'm having trouble figuring out how to fix my twitter weather bot. I am stuck right now with the following code
now fixed
I'm not sure if you're giving us a snippet or the full file, but you're not invoking your setup function.
You have missed certain things here (If you have sent the whole file content):
1) Import the Twit instance from package of twitter to send the post request.
2) Calling the setup() function from somewhere in the file.
Ok it turns out I forgot to install the axios package, it's working now.

React ES6 App - Local API calls

I can't for the life of me figure this out, it seems like it should be straight forward but it's just not clicking.
I have an ES6 app that I created using create-react-app. I've got all the templates and layouts set up for the project and came to trying to pull in data from an API that I want to sit inside the app - like a botched MVC where React handles the views and I run the models and controllers in PHP.
So I have a function in one of my components that I want to fetch some data. I use the fetch() function (I know this isn't yet compatible with a number of browsers but that's a problem for another day) to fetch a relative path from the component to the model I want to load, however the fetch function treats my path as a call to the base URL followed by the request. So with the site running on localhost:3000, I run the following code in my getData() function...
let test = fetch('../models/overall-stats.php').then(function(response) {
console.log(response);
return response;
});
...the URL that fetch hits is then http://localhost:3000/models/overall-stats.php which simply resolves back to the index.html file and loads the app, rather than the PHP file I'm requesting.
If I need to hit that PHP file to get my data, am I wrong in using fetch? Or am I just using it incorrectly? If I shouldn't be using fetch what's a better approach to this problem I'm having?
When I run this on an apache server (after building and deploying) I can get the fetches to work fine (apache recognizes the structure of the URL and hits it as I am expecting) and I hit the file no issues, but I need to be able to work in a local development environment and have the same functionality. The app will end up being deployed live on an apache server.
Any help would be greatly appreciated.
I knew after sleeping on this it would be very straight-forward... I simply had to move my models and controllers into the public directory for them to be accessible. I'll be putting in authentication to the models so that they can't be hit directly, but only through GET requests.
Why don't you just use something like ${baseUrl}/models/... ?
Also for solving browsers problem with fetch you can import the Polyfill or simply use axios (my choice)!
Maybe you can try to use ajax to get or post the data from server, just like this:
$.ajax({
url: '../models/overall-stats.php',
data: {
},
type: 'GET',
dataType : 'json',
success : function(res){
let obj = parseJSON(res)
}
})
or add this on top in your php file because the CORS :
header('Access-Control-Allow-Origin: *');

AngularJS: Retrieving Videogular templates stored in $templateCache results 404 Error

I currently develop an AngularJS 1.5.9 Single Page Application on my localhost with NodeJS running backend, where I use
Videogular framework. http://www.videogular.com/
Everything is fine except inserting videogular object on my page. I strictly follow the given example: http://www.videogular.com/examples/simplest-videogular-player/
<videogular vg-theme="controller.config.theme.url">
<vg-media vg-src="controller.config.sources"
vg-tracks="controller.config.tracks"
vg-native-controls="true">
</vg-media>
</videogular>
But it results in AngularJS error:
(sessionId in the request is the auth token not linked to current problem)
I have found the following in videogular.js :
$templateCache.put("vg-templates/vg-media-video", "<video></video>");
$templateCache.put("vg-templates/vg-media-audio", "<audio></audio>");
I have tried to store files locally, and the error disappeared
Actually there are a lot of plugins for Videogular and they all are using $templateCache to store some files in the cache, so it would be very confusing to manually store them locally in my app folder.
How can such files be stored in the cache using $templateCache so they can be extracted properly?
I apreciate your help.
UPDATE
I have tried insert $templateCache.get to directive, where the part is loading with error 404, and it works. But still doesn't work as it supposed to be.
It seems like there is an issue with sessionId that you pass in URL parametrs, do you actually need it?
I guess your interceptor or whatever auth managing module is wrong configured, so you don't check request target URL and id parameters are going to be added for local calls as well as for backend calls.

Ember.js model save sends no data to server

I'm currently building a small demo app using Ember.JS and NodeJS with Express. I've knocked up a simple model and have created an action to save it.
The component has a property called recipe, which is an instance of a model I've defined. The save action is as simple as:
save() {
this.get('recipe').save();
}
Looking at my network tab in Chrome dev tools, I can see the data in the request payload. However, I can't access the data in my Node app. I've logged the full req object and my data isn't there anywhere.
I have a feeling this is to do with the fact that Ember uses the PATCH verb, whereas I'd expect it to use PUT or POST.
Any help is greatly appreciated.
Disclaimer: Without seeing the code it is difficult to give you a definitive answer.
The JSON API specification defines, that updating a resource is done with the PATCH verb. (http://jsonapi.org/format/#crud-updating)
If you chose to use this adapter, you will have to define the appropriate routes in your Express app. Without seeing it, I'd suggest to define the route for PUT and PATCH with the same callback and you'll be fine.
For example:
router.put('/:id', controller.update);
router.patch('/:id', controller.update);
Overriding the HTTP verb in the adapter is not that easy at the moment (Ember Data 2.4). A possible head would be to override the updateRecord method of the adapter. (https://github.com/emberjs/data/blob/v2.4.0/addon/adapters/json-api.js#L115-L133)
Disclaimer: Without seeing the code it is difficult to give you a definitive answer.
You're not receiving the request payload because the 'Content-Type' header has not been set properly.
The JSONAPIAdapter for Ember sends requests with the 'Content-Type' header set to 'application/vnd.api+json'. You'll need to set this in body-parser like so:
app.use(bodyParser.json({ type: 'application/vnd.api+json' }));
In the end, I fixed the issue by using DS.RESTAdapter as opposed to DS.JSONAPIAdapter. The RESTAdapter uses PUT when you save a record while JSONAPIAdapter uses PATCH. I suspect there's some issue in the implementation of PATCH in either Ember or Express.

Listen for a webhook server side using meteor

I've set up a meteor app using iron-router and I want the app to listen to a webhook from another service (basically I'm building an API for other services to use)
So for example, when an external website calls myapp.meteor.com/webhook I want to catch that specific link and parameters and do stuff with the data.
Update: Thanks to a comment I found this: https://github.com/iron-meteor/iron-router/blob/devel/Guide.md#server-routing
Router.route('/webhooks', { where: 'server' })
.post(function () {
console.log(this);
this.response.end('Caught you\n');
//this.response.status(200).json({text:"Todo added"});
});
I added the above in the /server folder as there is no need to for the front-end server to worry about this like mentioned in the comment. But when I load this using postman POST request, it just returns my HTML for not found. Any ideas?
Thanks in advance for your help.
UPDATE
I tried what #David said and still I get the template loaded and nothing in the console. Any idea what I'm doing wrong?
Your server route will only run if no client routes also match. I suspect you have a catch-all route which is executing on the client and preventing the server route from running. One solution is to define all of the routes in a common folder like /lib so that you can properly order them. Your routes file could look something like:
client route 1
client route 2
server route 1
server route 2
catch-all (not found) route

Categories