How can I include a hyperlink as a parameter in Express? - json

I'm trying to send a hyperlink (such as: "http://google.com") as a parameter to my Express server script. My current script looks like this:
var app = require("express")();
app.get("/new/:link(*)", function(req, res){
var link = req.params.link;
res.end(JSON.stringify({
site: link
}));
});
app.listen(process.env.PORT || 3000, function(){
console.log("Listening...");
});
This is just a test to see if I can get it working so I can build something bigger on top. The idea is that I can send a link and receive the link in JSON. However when I try to go to the site with the the link as parameter, my browser want to save a file called "google.com" and it doesn't receive any JSON from the server.
I know it's possible to do this without changing anything about my browser but I don't know how. Anyone has any ideas?

Ok, so I have accidentally fixed my problem.
Apparently i had to write "res.send(...)" instead of "end". It now works perfectly although I don't really understand why.

Related

Creating two html pages in SAPUI5 and executing one or the other depends on the situation

Currently I have my project running as welcomFile the index.html file. This file takes me to an authentication process. The case is that I need to access one of my views but without performing this authentication, that is, I don't want to go through this index.html. To do so, I created another html (index_new.html). Even if I run this last one it always redirects me to the index.html, I don't know if it has to do with how the neo-app.json file is configured. I tried to put in the index.html that if it arrived a parameter in the url to be directed to the index_new.html but without success, it says that the page does not exist. This is what I tried:
<script>
const queryString = window.location.search;
const urlParams = new URLSearchParams(queryString);
window.location.search = urlParams.toString();
const con = urlParams.get('con');
if (con !== ""){
window.open("/index_new.html", "_self");
}
</script>
The only way I have managed to load the path I want is to run the program, it goes to the index.html and once it has loaded, I change the path to the index_new.html/viewthatIwanttoshow and it shows up. Is there any way to run the new index_new.html without having to run the old one?
I also think it's because of the manifest, because from the index_new.html I do it like this, just like in the index.html:
……
<script id="sap-ui-bootstrap>
…
data-sap-ui-resourceroots='{"app.hello”: “./“}’
…
</script>
</head>
<body class="sapUiBody">
<div data-sap-ui-component data-name="app.hello” data-id="container" data-settings='{"id" : “hello”}’ style="height: 100%"></div>
</body>
Maybe I should change the path here but I don't know which one or how to configure it in the manifest.json.
Maybe my question is not clear, if you have any questions please let me know.
My neo-app.json:
"welcomeFile": "/webapp/index.html",
My manifest.json:
"sap.app": {
"id": “app.hello”,
"type": "application",
I can't / don't want to give you a direct answer on your question. But I would like to mention to think about the concept you are going for.
I don't really understand why you want to load different index.html files. It's pretty far away from a best practice scenario - at least with the information I have out of your post.
When we are talking about authentication, mostly you save a token in cookies / browser storage. Then you can check if you are authenticated. If so, use the UI5 router. In every page you want to, you can check for valid authentication / authorization and redirect again to a login page, if you are not.
IMO you shouldn't use two different index.html sites.
I hope this help you to find another way to solve it.

How to make "Pretty" URL after dynamic content load using ajax

I am currently developing a website that will dynamically load the page content using ajax triggered by hash changes.
The code looks like this
$("*").delegate("a", "click", function () {
// Trigger Hash Change
window.location.hash = $(this).attr("href");
return false;
});
$(window).bind('hashchange', function () {
let newHash = window.location.hash.substring(1);
$("#main-content").load(newHash + " #ajax-content", function (responseTxt, statusTxt, xhr) {
}).hide().fadeIn();
});
Basically what I am working on now is making the URL look "Pretty", I have modified the .htaccess file to remove the .html extension
So a URL that looks like this
www.example.com/about.html
will become this
www.example.com/about
If I navigate the index (home) "www.example.com" page of the website and then navigate from there to the about page, the URL looks fine. "www.example.com#about" since the server does not display the "index" in the URL.
However, if I navigate straight to the about page like this www.example.com/about, then from the about page to another page, for example, the contact page. I get a URL that looks like this www.example.com/about#contact. When it should look like this www.example.com#contact.
My question is what is the best way to handle this? should I use jquery to redirect all to the index page and then add the hash to load the correct content? or is there some way I can not display the unnecessary part of the URL?
I hope my question was clear, I'm new to the server-side stuff involving the .htaccess file. FOr the ajax stuff I was following this tutorial from CSS tricks
https://css-tricks.com/video-screencasts/85-best-practices-dynamic-content/
You can use history.pushState
window.history.pushState("object or string", "Title", "/new-url");
The url will be www.example.com/new-url
in fact you can get history.state after use this method.
console.log(window.history.state)
output should be "object or string"
You can see the docs here.
Remember to use / to override the entire path.
To do what i think that you want, you can just override the url to / and set the hash.
This is probably not the best way to do this, but I have managed to redirect any page to the home page and then replace the / with the hash value so that the site wont end up wit "messy" URLs.
if(window.location.pathname != "/home.html")
{
window.location.replace("home.html" + window.location.pathname.replace("/", "#"));
}
what happens id the user navigates to "*www.example.com/about*" they will actually be sent to the homepage with the #about.html. So the never end up like this "*www.example.com/about#about*"

Using Angular to get html of a website URL

I am new in Angular
What I am going to try is to get the HTML of a page and reproduce it into an iFrame (it is an exercise).
I am using the following piece of code:
var prova = this._http.get(myUrl, {responseType: "text"}).subscribe((x) =>{
console.log(x);
});
I did it on a website (if is needed I can also insert the name of the pages) and it returns the html only of some pages.
In the other case the string x is empty.
Could it depend on connection?
Or there is some way to wait the end of the get request?
Or simply is wrong my approach and I should make a different type of request?
Your most likely going to need to use a library like puppeteer if you want to render a page properly. Puppeteer is a node library and useless headless chrome so I am not sure how well you could really integrate with Angular.
https://github.com/GoogleChrome/puppeteer

Express loading images relative to url

I'm building a fairly basic webpage using express. However, I'm having some trouble with my image pathways.
This code works fine.
app.use(express.static(path.join(__dirname, "/app/public/")));
app.get("/overview", function(req, res) {
res.render('some-file');
});
Inside of some-file.ejs I have...
<img src="assets/images/picture.jpg">
But what doesnt work is when I have a second url pathway.
app.get("/overview/specific", function(req, res) {
res.render('another-file');
});
<img src="assets/images/picture.jpg">
In this example I'm trying to load the exact same image (in my case its a banner thats reused on every single page). This gives me an error that the image is not found. What I've noticed from the console errors is that the image is being loaded from localhost:3000/overview/assets/images/picture.jpg
I don't understand why express is trying to load the image from whatever the first pathway is (overview in this case). Overview shouldnt be in the pathway!
Can anyone help me out debugging this issue?
Thanks in advance
Try to use /assets/images/picture.jpg.
Add / before the path. Then it will take /app/public/ as a root and be sure that the image will be at :
/app/public/assets/images/picture.jpg
Now wherever you want picture.jpg just pass this absolute path.
We serve favicons dynamically using an ExpressJS redirect, it works very well.
First, we retrieve the site object from memory with a quick lookup based on req.hostname, then send this response:
res.redirect(site.favicon);
The favicon variable could be a static asset on our server, or an asset on another server too. Our front-end code just calls /api/resources/favicon and it will receive the correct link in return.

JSON response from URL

Hey I'm trying to retrieve data from a json file I have hosted on my server but it's not working, I'm not sure what is wrong as I'm not the most well versed in this topic. Any tips are appreciated!
$(document).ready(function () {
$("#button").click(function () {
$.getJSON({
type: "POST",
url: "some URL will go here",
success: function (result) {
$("#div1").append(result);
}
});
});
});
heres the fiddle as well: http://jsfiddle.net/ahuston12/E5SzH/
Open a modern browser like Firefox or chrome and open the developer tools. Navigate to the page that contains the above code and monitor the "network" tab to see the related http request triggered via ajax. You can then see the request + response including header, body and return codes. This should help to figure out the problem.
You should show us what's going on the server side.
It doesn't seems to be problems on this jquery code so i guess it's from server.
You can check the response value to see the problem :
on chrome ctrl+j -> network. You'll see your request, click on it to see details like the server's response.
If you have FireBug installed in your Mozilla Firefox open it, in that you can see Net Tab . If you click that you can able to see what kind of response you are getting. I ahve attached the Image For your reference. And for getting a JSON result use "result.d".
The url that you are using doesn't return a json response, it returns a javascript file that charge a json result into a variable, because of that you can't get the result.. if you try with other site that returns information in json format like this you are going to get the data:
$.getJSON("http://headers.jsontest.com/", function (result) {
console.log(result);
}
);