So I have a routes.js file to handle my routing in my VUE app and I have used it to transition between components successfully using a router-link tag. However I would now like to execute routes using javascript. For example after I receive an authentication response from my server I would like to transition from the login page to my home page. What can I do to execute a route when I want to?
You can programmatically route using router.push('home'). Here is a a reference to see more options available.
Related
I created a React app which has four routes, user,admin,home and bus.
if I want to access http://localhost:300/user I was able to access that,
but after hosting it on Github( https://loveyourtrip.tk/ ), if I want to access https://loveyourtrip.tk/user , GitHub throws error status code 404.
However, I can log on https://loveyourtrip.tk/ . once I log on this URL, there is a button called "mange account". if you click there , you can see user. once clicked on user , you can go to https://loveyourtrip.tk/user. but I am not able to access it directly. How can I resolve this issue?
It's because you didn't handle the /user in the backend.
You can handle the whole thing from the front end by using HashRouter instead of BrowserRouter.
Or you can handle it from the backend by return the html page to all the routes.
Take a look at this https://stackblitz.com/edit/hashrouter-demo
I want to make an angular app with routes and jwt auth, but I don't want normal users to see the HTML partials of admin views. What's the best way to do this with laravel and angular? People can just put "/partials/adminPage1.html" on the url and see the partial when they are not logged in. My API is secure but I don't want the html to be public.
I want it so this is public:
index.php, publicPartial1.html, publicPartial2.html, etc
and only logged in users can use these files:
admin.php, adminPartial1.html, adminPartial2.html
You can/need to approach this in a few ways:
when "someone" puts "/partials/adminPage1.html" you need to check in the sever side (by the service you are checking it's permissions/role) then display/redirect to the appropriate route with ReturnUrl in the query for after login redirect.
You can be more secured by downloading the routes from the server by requesting them first (per user/role/permission) from a dedicated service, but then you'll need to bootstrap your AngularJS, since routing needs to be loaded with AngularJS life cycle, so in that case you are getting the routes, building them in a provider while bootstrapping AngularJS after getting the routes from the designated service as I mentioned.
* I would suggest to simply implement option (1) which is straight forward and most commonly used. *
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
I have a meteor application and am using Iron Router for the routing.
I've got one route called /process which is run server side. In the URL parameters i have a parameter named route. What i want to do is for the handler for the route handler to return the HTML that was generated from the route specified in the parameter using this.res.end(- the rendered HTML from the route parameter's route-)
This is bound to be possible but my meteor skills are lacking.
I'm trying to use HTML5 push state links with my Angular app. What I have is a series of routes similar to the following
$stateProvider.state('product', {
url: '/product/:productCode',
templateUrl: 'product/product.html',
controller: 'ProductCtrl'
}
});
This works when I navigate to [host]/#/product/ABC123 - It displays the url in the browser as /product/ABC123, then when I start clicking through to my other routes (using ui-sref) everything works as expected.
However - I'd like the ability to both refresh the browser, and remain in the same state, as well as be able to copy and paste that link and route to the right state.
eg. If I got to [host]/product/ABC123 - I want to display the content from the #/product/ABC123 route. Currently, this will give me a not found.
I'm using nginx as my app server. I believe I'll have to add something to handle it at that level, but I'm not sure where to start.
The issue you have is that your server does not know how to respond to /product/ABC123.
I am currently using node.js for my backend with angular, and to solve this I return the angular app for all routes, not just the usual root route for example.
So you might have used something like this in the past:
app.get('/', ...);
Which would have returned the angular app just for the root route. Now I use something like:
app.get('*', ...);
Which will return the angular app for all routes.
I should have mentioned that this can act as a catch all placed after other routes such as for static files. Another alternative is to mark all the routes you want specifically for the angular app, eg:
app.get('/', ...); app.get('/product/:productId', ...); etc