Using Express. Here's the route. It basically just passes the url params into a template that renders the OG tags.
router.get('/share/:redirectURL/:title/:description/:img', function (req, res) {
var url = req.protocol + '://' + req.get('host') + req.originalUrl; // points to this endpoint
res.render('share', {
url: url,
title: decodeURIComponent(req.params.title),
img: decodeURIComponent(req.params.img),
description: decodeURIComponent(req.params.description),
redirectURL: decodeURIComponent(req.params.redirectURL)
});
});
module.exports = router;
And here's the share template that it renders to.
doctype html
html
head
meta(property="og:url", content="#{url}")
meta(property="og:image", content="#{img}")
meta(property="og:title", content="#{title}")
meta(property="og:description", content="#{description}")
meta(property="og:type", content="article")
body
script.
location.replace("#{redirectURL}");
...and it works! But it only works LOCALLY. As soon as I upload to the server, things go awry.
works: http://localhost/share/http%3A%2F%2Fgoogle.com/Hear%20some%20music./http%3A%2F%2F201.23.456.789%2F%2Fassets%2Fimgs%2Ffavicons%2Ficon1024.png
doesn't work: http://123.45.678.910/share/http%3A%2F%2Fgoogle.com/Hear%20some%20music./http%3A%2F%2F201.23.456.789%2F%2Fassets%2Fimgs%2Ffavicons%2Ficon1024.png
Something upstream is partially decoding the url BEFORE it gets to the Express router. The result is this confused, useless thing.
http://123.45.678.910/share/http:/google.com/Hear%20some%20music./http%3A%2F%2F201.23.456.789%2F%2Fassets%2Fimgs%2Ffavicons%2Ficon1024.png
Switched to query parameters and it works!
Related
I am serving a static file(.js) using script tag (due to webpack). So the request url is like http://localhost:8080/bundle.js But I want to add parameter to this request URL like this:
http://localhost:8080/bundle.js/abc
And according to parameter I will modify bundle.js and serve it.
But How can I add the params.
I'm not sure to understand your goal.
But if you use express to serve your bundle.js (as mentioned in the post tag), to use the parameters, you can do something like :
app.get("/bundle.js/:foo?", (req, res) => {
if (req.params.foo === "bar") {
res.sendFile(__dirname + "/src/bundle2.js");
} else {
res.sendFile(__dirname + "/src/bundle.js");
}
});
Here is a codesandbox with this example:
https://codesandbox.io/s/stackoverflow-74429869-7iz7l2?file=/app.js:242-435
Im trying to deploy cors-anywhere on Google Cloud Functions. Im supposed to provide the url after gcp's link.
It looks like this :
https://us-central1-my-project.cloudfunctions.net/my-function/http://dummy.restapiexample.com/api/v1/employees
but it's transformed to :
https://us-central1-my-project.cloudfunctions.net/my-function/http:/dummy.restapiexample.com/api/v1/employees
All the double slashes after the host are transformed to simple ones.
I tried replacing req.url to transform http:/ to http:// but still wont work. Maybe this needs to be fixed in the webserver level.
Here's my function in GCP
var cors_proxy = require('cors-anywhere').createServer({
requireHeader: ['origin', 'x-requested-with'],
removeHeaders: [
'cookie',
'cookie2',
],
// See README.md for other options
});
exports.myFunction = (req, res) => {
req.url = req.url.replace('/my-function/', '/'); // Strip '/my-function' from the front of the URL, else the proxy won't work.
return cors_proxy.emit('request', req, res);
};
Anyone tried to deploy this in a serverless function?
You're using req.url which contains a normalized version of the request URL. You'll want to use req.originalUrl which, as the name suggests, retains the original requested URL. See Express docs for more info.
When a GET request is made on my site, I am trying to render templates that are stored on another server. Essentially my application will make a request to this server, and the response will contain the template that I would like to use. The server's response is a dust template in the form of a string.
What is the best way to render the template?
router.get('/', function(req, res) {
var options = {
host: myHost,
path: myPath,
port: myPort};
var templateReq = http.get(options, function(response) {
var templateStr = '';
response.on('data', function(chunk) {
templateStr += chunk;
});
response.on('end', function() {
var dustParams = myDustParams;
res.render(templateStr, dustParams); //THIS DOES NOT WORK
});
});
});
I understand that render looks in the 'views' folder to search for a template.
Also, I know that you can directly send HTML to the response using 'send', but by doing this I am unable to include the dust parameters.
You can use:
res.send(templateStr);
Regarding having dust populate the params in the template, you have to compile and render it before using the res.send
I wrote an npm module to do this by extending the express framework to read a template url from the view model along with a css selector of where to inject the content of the view.
You call res.render as normal but pass template url and selector rather than layout
res.render('view-name', {
template: 'https://courseof.life/johndoherty', // external url
templateSelector: '#promo-banner' // element within layout to inject view
});
It caches the template for 30 minutes before making another call to fetch the next version.
I am new to AngularJS and am trying out a few things with posting and deleting content using $resource. I've got the posting working fine, but when I try to delete something that I've posted I get a 404 error.
DELETE http://localhost:3000/tasks?__v=0&_id=53c5ddcf2978af0000ccdc50&beginningDat…vacy=true&title=This+is+a+complete+task&website=http:%2F%2Fwww.hotmail.com 404 (Not Found)
I've been working on this for a few days now and I'm just not seeing what i am missing. I am using a MEAN stack. I've got mongoose, express, bodyParser, and cors as dependencies in my app.js and created my endpoints:
app.get('/tasks', api.getTask);
app.post('/tasks', api.postTask);
app.delete('/tasks/:_id', api.deleteTask);
Here is the code from my api.js which
exports.deleteTask = function(req, res){
var _id = req.params._id;
Task.remove({_id:_id}, function(err, task){
res.send(task + ' removed task successfully');
if(err){
res.send('Hey guys...he is still here.');
}
});
};
Here is my factory/service:
'use strict';
angular.module('achievementApp').factory('tasks', function($resource){
return $resource('http://localhost:3000/tasks/',{_id: '#_id'},{
get: {method:'GET', isArray: true},
add: {method:'POST'},
delete: {method: 'DELETE'}
});
});
And here is the code from the Ctrl:
$scope.taskList = tasks.get({});
$scope.removeTask = function(obj){
tasks.delete(obj);
var index = $scope.taskList.indexOf(obj);
console.log(index);
$scope.taskList.splice(index,1);
console.log('removeTask was called');
};
Any guidance on this would be greatly appreciated. I've tried just about everything I can to get it to work and have had no luck so far.
It looks like you have a mismatch between the angular code which is putting the _id in the query string and the express code which is looking for it as a route param, which looks in the path part of the URL. req.params comes from the path part before the ?. req.query comes from the query string part after the ?. It would be more conventional to use the path in terms of REST, so I suggest changing your angularjs code to have /tasks/:_id as the resource route.
Aside: Best to use relative paths in your browser JS and omit the protocol, host, and port. Otherwise your app won't work when you deploy it on the real web.
I am writing a website with a single page web app (the rest of the website is just static files which are served). I am trying to write a piece of middleware for express to redirect all requests that follow the pattern 'example.com/app' to 'example.com/app' so that requests such as 'example.com/app/my/specific/page/' will all result in the same page being sent. The key issue with this is that the url in the address bar of the browser must not change so that the javascript app itself can interpret it and display the correct thing.
I could have done something like this:
app.use( '/app', function ( req, res ) {
res.redirect('/app');
});
However, this causes the url of the page to change and a separate HTTP request is assumedly made.
The most obvious alternative solution is to do something like this:
app.use( '/app', function ( req, res ) {
res.sendfile(__dirname + '/public/app/index.html');
});
The issue here is that resources from the page after requests like 'example.com/app/my/specific/page/' will look in the wrong location. For example, if I have an image on the page such as then it will look for example.com/app/my/specific/page/image.jpg. Since no image is returned, it will not display on the page. This happens for all external scripts or stylesheets.
I also tried something like this:
app.use( '/app', function ( req, res ) {
res.sendfile(__dirname + '/public/beta' + url.parse(req.url).pathname);
});
but that was very stupid of me for obvious reasons.
In the end I used this middleware to serve the app's page when appropriate
// all unmatched requests to this path, with no file extension, redirect to the dash page
app.use('/dash', function ( req, res, next ) {
// uri has a forward slash followed any number of any characters except full stops (up until the end of the string)
if (/\/[^.]*$/.test(req.url)) {
res.sendfile(__dirname + '/public/dash/index.html');
} else {
next();
}
});
I then set used a base HTML element with the href attribute pointed to the root.
If you're still trying to accomplish this I may have found a starting point. Alexander Beletsky has a Backbone.js + Express SPA boilerplate repo Located Here.
For a brief article on how it came about you can read his article on Dzone.