This is how my site is constructed...
articles.php contains the layout html to display all articles for a category.
articles.js contains the control elements to obtain db query results and pass to articles.php page. Within the js script is a dataTable that is displayed on the articles.php page.
ajax_articles.php contains the query request and return json file results of the query. Within the json file are links to the individual articles. The link is structured as a clean SEO URL (e.g., article/001/moby_dick).
This is how I understand htaccess to work.
When a user selects an article the URL (i.e., https://www.example.com/article/001/moby-dick) is passed through htaccess and with a RewriteRule ^article/([0-9]+)/([a-z_-]+) article.php?art_id=$1&art_name=$2 [NC,L] will display the SEO 'pretty' URL, BUT known to the system will be the URL containing the two parameters that can be used by a $_GET to obtain the two parameters. IS MY UNDERSTANDING OF THE PROCESS CORRECT?
I've noticed that with the htaccess I now have to use the full path name to load the support (.js) and graphic files. Further, I cannot obtain the variables via js $_GET.art_id and $_GET.art_name.
Any assistance is greatly appreciated.
You can't access the GET variables with javascript in this configuration because they do not exist after the URL rewrite. The query parameters have been removed.
There are still ways you can extract these values from the URL with window.location.href and the .split() method in javascript.
// var myurl = window.location.href; // this will get the string of your current URL. Used manual string in this example
var myurl = "https://www.example.com/article/001/moby-dick"; // manual URL for sake of an executable example
var spliturl = myurl.split("/"); // ["https:","","example.com","article","001","moby-dick"]
var articleid = spliturl[4]; // "001"
var articlename = spliturl[5]; // "moby-dick"
// see the variables in action
console.log("id: ", articleid);
console.log("name: ", articlename);
Related
I am building a web app and I am using Firebase to store my user's data in Cloud Firestore. There is a page on my web app that allows users to view their documents from Cloud Firestore. I would like to add a query parameter to the end of my URL on view.html so I can take that query parameter value and use it to search for a document.
I have been searching online to find possible solutions. So far I have come across a few videos on the topic, but they haven't been going into the depth I have been needing. For example, this video shows how to add and get query parameters from a URL, but it only shows how to log those changes in the console. How would I make that my URL?
I've also be browsing Stackoverflow for solutions. This Stackoverflow post asks a similar question, however, many of the solutions in the answers causes view.html to reload on a loop. Why would this be, and if this is a possible solution, how would I stop this from happening.
How would I go about appending and fetching URL query parameters in Javascript?
You say you want to do this in javascript, so I assume the page itself is building/modifying a link to either place on the page or go to directly via javascript.
In javascript in the browser there is the URL object, which can build and decompose URLs
let thisPage = new URL(window.location.href);
let thatPage = new URL("https://that.example.com/path/page");
In any case, once you have a URL object you can access the parts of it to read and set the values.
Adding a query parameter uses the searchParams attribute of the URL, where you can add parameters with the .append method — and you don't have to worry about managing the ? and & … the method takes care of that for you.
thisPage.searchParams.append('yourKey', 'someValue');
This demonstrates it live on this page, adding search parameters and displaying the URL at each step:
let here = new URL(window.location.href);
console.log(here);
here.searchParams.append('firstKey', 'theValue');
console.log(here);
here.searchParams.append('key2', 'another');
console.log(here);
I have solved this issue in the simplest way. It slipped my mind that I could link to view.html by adding the search parameter to the URL. Here's what I did:
On index.html where I link to view.html, I created the function openViewer();. I added the parameter to the end of URL href.
function openViewer() {
window.location.href = `view.html?id={docId}`;
}
Then on view.html, I got the parameter using URLSearchParameters like so:
const thisPage = new URL(window.location.href);
var id = thisPage.searchParams.get('id');
console.log(id)
The new URL of the page is now "www.mysite.com/view.html?id=mydocid".
You can try to push state as so in the actual view.html
<script>
const thisPage = new URL(window.location.href);
window.history.pushState("id","id",thisPage);
</script>
So, basically what I am doing is scraping a webpage, getting all of the data I want and displaying it on a webpage on my site. When scraping this specific page i need the link within the 'href' tag. However, this particular site doesn't use regular links. Inside the 'href' tag is a query string. My plan was to take what was inside the 'href' and create a url to make my next request, but now when I try to pass the query string into the url, I can not access it in Node via req.params
I want to know if there is a way to maybe pass a query string without the server thinking it is a query string, or will I have to use req.query to take all the params and build the URL again from scratch?
Here are some examples of what I am talking about:
page1.ejs:
some.href = "?variable=bleh"
Server-side handling:
app.get('/display/:string', function(req, res) {
var url = "http://theurlineed.com/" + req.params.string;
});
This code does not work. When i click on the link it tells me it couldn't get /display/?variable=bleh
You need to encode the query string so that it is not treated like a query string in the URL:
some.href = encodeURIComponent("?variable=bleh");
So then your URL will be: /display/%3Fvariable%3Dbleh. As mentioned in the comments, Express will automatically decode the value in req.params.string so it will be the right value.
I am collecting data from a user on Server A,
I need to send that data in a URL to server B (separate buildings and companies)
On server A it is a CRM system which is pre built and I cannot just simply use PARAMETERs as I cannot HASH the PARAMETERs as the system is pre built by a third party and they would charge to allow for this.
So I have managed to build some JS that replaces certain characters from the PARAMETERs I can collect.
Here is a small snippet of what I have to make my HASH.
<script type="text/javascript">
// Collect USERID
var m = 'XX784188';
// HASH USERID
m = m.replace(/7/g, 'M');
m = m.replace(/4/g, 'S');
// Set up Object n as Location name.
var n = 'Cumbria';
// Rename Location to correct code
n = n.replace(/[Cumbria]/g, '01');
// Test Object m & n
alert(n);
alert(m);
Here is the above in a test.
Now what I cannot seem to find out is how do I insert the results into a url and redirect the user to that URL.
For example:http://google.com/?n=&m=
I can insert this line I know for the redirect:
window.location = "http://google.com/?n=&m="
I just need to know how I make that URL look like this google.com/?n=01&m=XXM8S188
Funny, I just answered the same thing 1min ago :
window.location = "http://google.com/?n="+n+"&m="+m
Your snippet code and JS Fiddle code are different.
For snippet code then you simply insert your values like,
window.location = "http://google.com/?n="+n+"&m="+m;
For JSFiddle code, then,
window.location = "http://google.com/?"+serialiseObject(obj);
I'm working on an AJAX application that uses Knockout and Sammy for AJAX history. The application uses a set of filters, sort options and pagination to let the user search trough 35000 records.
Currently the URL hash is in the following form:
http://domain/Search/{SearchTerms}/PageIndex
For example:
http://localhost/search/#0%20-%205%C4%80square%20meter/1
The search terms are parsed on the server to match them to the available filters. I can't use an Id or something because the filter set is rebuild each day (when backend data updates) and the only thing that stays the same is the description.
This is the javascript code to build the hash:
var hash = '';
ko.utils.arrayForEach(self.SelectedItems(), function (item) {
hash = hash + item.Description + ' ';
});
hash = encodeURIComponent($.trim(hash));
hash = hash + '/' + self.HuidigePagina();
location.hash = hash;
The problem is that joining all the item descriptions can become really long. Is there a way I can compress this part and then decompress it when I send it to the server in javascript?
I've found some answers here on stackoverflow that uses LZW compression, but it didn't give me my original string back.
I want to redirect after a successful ajax request (which I know how to do) but I want to pass along the returned data which will be used to load an iframe on the page I just redirected to.
What's the best way to pass such data along and use it to open and populate an iframe in the page I just redirected to?
EDIT:
I am passing a GET variable but am having to use the following to access it for use in my iframe src attribute:
function $_GET(q,s) {
s = (s) ? s : window.location.search;
var re = new RegExp('&'+q+'=([^&]*)','i');
return (s=s.replace(/^\?/,'&').match(re)) ? s=s[1] : s='';
}
var d = $_GET('thedata');
I assume there isn't really a more straightforward way to access the GET vars?
If it's not too much data, you could pass it as a get parameter in the redirect:
document.location = "/otherpage?somevar=" + urlescape(var)
Remember that urls are limited to 1024 chars, and that special chars must be escaped.
If it is beyond that limit your best move is to use server side sessions. You will use a database on the server to store the necessary information and pass a unique identifier in the url, or as a cookie on the users computer. When the new page loads, it can then pull the information out of the database using the identifier. Sessions are supported in virtually every web framework out of the box.
Another alternative may be to place the data as a hidden attribute in a form which uses the post method (to get around the 1024 char limit), and simulating a submission of the form in javascript to accomplish the redirect, including the data.