I am trying to append URL, but it the generated URL is not as expected. Below is the code that I've tested and its outcome.
Since I'm using a local server to test my system, the desired request URL is http://127.0.0.1:8000/api/posts. I will be deploying this system to a remote server in the near future so I cannot use the request URL as it is now. Base on the code below, what I am trying to do is to get the current hostname and append it with the route URL but it produces weird URL. How to solve this?
Component
created() {
var test = window.location.hostname + '/api/posts';
this.axios.get(test).then(response => {
this.posts = response.data.data;
});
Route Api (api.php)
Route::get('/posts', 'PostController#index');
Just use an absolute URL in your axios requests if you don't want to have to configure a base URL:
this.$axios.get('/apiposts')
Where the prefixed / is the important part.
You probably do not need to set baseURL. Have you tried to define baseURL? For example:
axios.get(`${process.env.HOST}:${PORT}/api/categories`)
Add this code in your: /src/main.js
const baseURL = 'http://localhost:8080';
if (typeof baseURL !== 'undefined') {
Vue.axios.defaults.baseURL = baseURL;
}
See the solution here Set baseURL from .env in VueAxios
I think in your app baseURL is set to http://127.0.0.1:8000 (default) and you append the host to this url in this line var test = window.location.hostname + '/api/posts';. Try it without this.
Related
I am using Swagger-UI for jax-rs jersey.
So there is this index.html. There you have to enter the url for the swagger.json .
So this is a big problem.
We are deploying our application to a lot different environments.
And the respective swagger.json will always be on the same environment.
We have Jenkins build jobs and we cannot edit index.html for every environment.
window.onload = function() {
// Begin Swagger UI call region
const ui = SwaggerUIBundle({
url: "**https://petstore.swagger.io/v2/swagger.json**",
Property url I always have to set.
What should I do?
P.S.
In Springfox Swagger-UI there is no physical swagger.json
But in jax-rs I have this dist folder and there is always a physical json
as far as I understand. Where should I put this so all different
clients can access it.
You can use vanilla JS for that:
var currentUrl = window.location.origin;
var apiBasePath = currentUrl + '/v2';
window.ui = SwaggerUIBundle({
url: apiBasePath + "/swagger.json",
...
})
In this example:
const resolved = this.$router.resolve({
name: 'about'
})
console.log(resolved.route.path)
Is it possible to get route with origin included? Like, if the url is site.com/about, the code would give /about, so I'll need to append origin myself: window.location.origin + resolved.route.path.
I've been using this (tested with vue-router v4, browser only):
const route = router.resolve({ /* your route here */ });
const absoluteURL = new URL(route.href, window.location.origin).href;
Edit: Used location.origin instead of location.href since resolve().href already includes base.
No, not from the router.
Even the router's base property is relative to the app root:
The base URL of the app. For example, if the entire single page application is served under /app/, then base should use the value "/app/".
$route.fullPath also begins at the app root. The docs describe it as:
The full resolved URL including query and hash.
I'm writing a node.js application with client-side javascript that uses fetch to get data from the node API that I wrote. I want to be able to put that application on any site (URL) without changing anything in the javascript. My current code goes something like fetch("http://localhost:8080/data.json"). If I wanted to deploy onto Heroku, for example, I would have to change that. Is there a way to overcome this fact?
Window location might do the trick, if I am understanding correctly. Set it into a variable like this:
For browser:
If the hostname is http://localhost:8000, using this:
// http://localhost:8000/data.json
var url = window.location.hostname + "/data.json";
fetch(url)
Heres another example.
document.getElementById("demo").innerHTML =
"Page location is " + window.location.href;
Result is
Page location is https://www.w3schools.com/js/js_window_location.asp
More info:
https://www.w3schools.com/js/js_window_location.asp
I see you wanted NodeJS, for server
var os = require("os");
var port = process.env.PORT || 8000
var url = os.hostname;
var final = url + ":" + port
// localhost:port
var hostname = os.hostname();
I am working on a project which I share with someonelse.
I have my host set up as http://dev.foobar which maps to a folder called foobar.com and I have no issues with my code, it all works as intended. However the other person has the same named folder foobar.com, but hasn't set up virtualhost, so he is using http://localhost/foobar.com
So, inside the code I have to send an ajax request to a URL http://dev.foobar/wp-admin/admin-ajax.php" however this won't work for the other guy, since his would be http://localhost/foobar.com/wp-admin/admin-ajax.phpso right now I am using this code to get the host and append the url wp-admin/admin-ajax.php
function get_host() {
if (window.location.hostname == "localhost") {
var host = "https://localhost/foobar.com/";
} else {
var host = "https://" + window.location.hostname
}
return host
}
And I am send request to ajax like this
var ajaxURL = get_host() + "/wp-admin/admin-ajax.php";
The problem with the function is that I am hard-coding foobar.com and I am not sure if there is another way to do this
I need my app to send email with a link back to the app in it. How do I form the link, no matter which host/port/etc it is running on? In one place, I do this:
var urlToSend = req.protocol + '://' + req.get('host') + "some/path";
But I don't have simple access to the req object in my new case. That string manipulation seems goofy and error-prone to begin with. Jumping through hoops to get the request would make it even worse, I think.
Is there something in nodejs like url helper functions in rails?
Looking at those URL helper functions, I don't see any that give you the hostname. You're right in that capturing it from req.hostname is a bit sloppy.
I'd recommend conditionally setting an environment variable as long as your setup isn't too complex. After that, use the url module that McMath mentioned.
if (process.env.NODE_ENV === "production") {
process.env.HOSTNAME = "site.com"
} else if (process.env.NODE_ENV === "development") {
process.env.HOSTNAME = "localhost"
}
Take a look at the url module in Node. url.format() should serve your purposes. For example, you can do something like this:
'use strict';
const url = require('url');
// Just for example:
const PROTOCOL = 'https';
const HOST = 'some.host.com';
const PATH = 'some/path';
// ...
var urlToSend = url.format({
protocol: PROTOCOL,
host: HOST,
pathname: PATH
});
// urlToSend = 'https://some.host.com/some/path'
You shouldn't need access to the req object just to construct a link. The relevant protocol, host, path, etc., should all be available somewhere in your app, unless there is something I'm missing about your question.
Update
I agree with #MitchLillie that you should make your app configurable using environment variables. I just thought I would expand on a suggestion I make in the comments below. It is a common pattern in Node to have a file (or perhaps several files) specifically for configuration, such as setting your host, port, etc. The file would normally contain default values that you could optionally override with environment variables, like so:
// config.js
module.exports = {
protocol: process.env.PROTOCOL || 'https',
host: process.env.HOST || 'some.host.com',
// ...
};
And then you can just require('./config.js') wherever you need access to these settings. It helps to maintain consistency as your app grows, and makes it easy to change your settings if necessary.