Read GET parameters using Javascript

Question

I would like to call Javascript in an HTML file like below:

<body>
<script src="./sample.js?ts=123456789&id=31ade2"></script>
</body>

How can I use ts and id in sample.js? Is this even possible?

I searched on Google, but what I found was to use location.href, which didn't return ts or id.

(Explanation why window.location.href doesn't solve this problem.) Let's say the script above is in example.com/index.html. window.location.href in sample.js returns example.com/index.html but not ./sample.js?ts=123456789&id=31ade2.

Those parameters go to the *server*; unless you make provisions there to inject them somehow, the script is not going to see them. But what's the *context*, why do you think you need to do this? — jonrsharpe, Jan 20 '18 at 09:23
Possible duplicate of [How to get the value from the GET parameters?](https://stackoverflow.com/questions/979975/how-to-get-the-value-from-the-get-parameters) — rolfv1, Jan 20 '18 at 09:29
@jonrsharpe I think the easiest way to pass params to `sample.js` is to use variables. For example, I can set `window._values = {'ts': '123456789', 'id': '31ade2'};` and `sample.js` can read it. I simply thought using GET parameters was smarter. — , Jan 20 '18 at 09:44
@EdHeal I have never looked into node, so am not sure what it can do. This time I only put a static js file in Nginx server. — , Jan 20 '18 at 09:46
That doesn't give the context. Also it's not clear why the behaviour of href surprised you. — jonrsharpe, Jan 20 '18 at 09:46
@jonrsharpe I would like users (media) of our service to send us some sorts of data. The users are supposed to render the script with parameters on their webpages. I am actually a backend engineer, so do not know a lot about Javascript... — , Jan 20 '18 at 09:50
But if they're only needed on the client side, why force the round trip to the server? This is why I'm asking for context, currently you have a http://xyproblem.info — jonrsharpe, Jan 20 '18 at 09:54
@jonrsharpe I guess there are some confusions. We are collecting web data. Our clients are publishers who have their own websites. We ask publishers to put our script to their webpages. I wrote `src="./sample.js"` because I am now testing in my local environment, but the server where `sample.js` should be different from servers which return webpages. We have to ask publishers to make some variables available to our script. — , Jan 20 '18 at 10:09
This is going in circles, I'm not going to waste further time on it. [Edit] the question to clarify the context and spend some time thinking about whether your approach actually makes sense given your needs. — jonrsharpe, Jan 20 '18 at 10:11
@jonrsharpe I am not sure why you write "if they're only needed on the client side, why force the round trip to the server?". I believe my approach (asking publishers to place scripts on their websites) is a common way to track users. Could you explain why you think the approach doesn't make sense? — , Jan 20 '18 at 10:16
https://stackoverflow.com/questions/48354460/read-get-parameters-using-javascript#comment83696265_48354460 — jonrsharpe, Jan 20 '18 at 10:17

score 0 · Answer 1 · answered Jan 20 '18 at 09:30

Inside sample.js you need to get reference to the script element itself. Simple way to do it is by reading document.scripts collection:

const thisScript = document.scripts[document.scripts.length - 1]
const params = getParams(thisScript.src)

console.log(params) // { ts: "123456789", id: "31ade2" }

_{* Note, in order for this to work as expected, script should not load asynchronously, or have defer/async attribute.}

As for getParams function, feel free to use any implementation you like. For example good on from this post: How can I get query string values in JavaScript?

Read GET parameters using Javascript

1 Answers1