By utilizing // within the source of a <script>, one can efficiently reference external files without specifying the

Curious if anyone has come across any evidence, proof, or firsthand accounts of utilizing the traditional http/https JavaScript <script> hack:

<script src="//someserver.com/js/script.js"></script>

Have you faced any problems with this method in browsers like IE 5.5+, FF2+, Chrome, Opera 9+, Safari 3+? Any success stories to share?

Answer №1

Every up-to-date web browser should be able to interpret this format, even IE 6 (though IE 5.5 is a bit iffy).

In reality, this isn't some workaround; it follows the correct URI syntax outlined in RFC 3986: Section 4.2. So, feel confident moving forward with this approach.

Answer №2

Allow me to direct you to exactly what you are seeking. The information you are looking for is within an RFC document, so there may be some extraneous details to sift through before finding what you need. However, this method is a legitimate feature (not a workaround) commonly used by supposed http clients.

b) If the embedded URL begins with a scheme name, it is interpreted as an absolute URL and the search ends here.
          
c) If the embedded URL does not start with a scheme name, it takes on the scheme of the base URL.

To explore further: (look for the section "Resolving Relative URLs" and refer to steps 1 and 2 below). Alternatively, visit:

A little note: I implement this method in most of my projects, not only for JavaScript resources but also for linking to images and CSS files (UPDATED: excluding stylesheets).

This approach works universally. I have tested it in various browsers like IE, Firefox, Opera, Chrome, Safari/Webkit, including earlier versions where applicable.

Here are a few examples:

  • < img src="//static.example.com/img/token.png" />
  • < script type="text/javascript" src="//static.example.com/js/jquery.js">

I prefer using this technique over writing code to determine whether we are on http or https.

The only exception is avoiding its use for stylesheets.

While the following method is valid and functional:

  • < link rel="stylesheet" type="text/css" href="//static.example.com/css/screen.css" media="screen" />

In Internet Explorer, this will result in two HTTP requests. This issue affects IE7, IE8, and early versions of IE9.

In essence, scheme relative URIs can and should be utilized for all resources except stylesheets.

Answer №3

Since posting this inquiry, I have consistently implemented this schema without encountering any issues. It has proven to be compatible with all web browsers, including IE5.5. Much of my work involves JavaScript functionality, and this method effectively incorporates the necessary scripts.

Answer №4

It seems that the confusion arises from the way Google Analytics standard code handles hostnames based on the protocol. There could be different SSL and non-SSL hostnames due to network reasons, causing this discrepancy.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Ways to address Path Traversal vulnerability in the following code

const downloadFile = blobstoreRouter.get('/blobstore/download/:filename', (req, res) => { var localFile = path.join(__dirname, '..', escape(req.params.filename)); var file = require('fs').createWriteStream(localFile); try { ...

What is the main object used in a module in Node.js for global execution?

Node.js operates on the concept of local scope for each module, meaning variables defined within a module do not automatically become global unless explicitly exported. One question that arises is where a variable declared in a module file belongs in term ...

Tips for adjusting the text color of input fields while scrolling down

I am currently working on my website which features a search box at the top of every page in white color. I am interested in changing the color of the search box to match the background color of each individual page. Each page has its own unique background ...

What is the simplest method for comparing transaction amounts?

I'm in the process of integrating PayPal into my website using their REST API. My goal is to allow users to input the amount they want to deposit. While I can obtain the total during payment creation, I'm unsure how to smoothly pass it to the exe ...

Issue: Module 'js' not found in Node.js Express application

I am currently working on a NodeJS express application. While developing, I encountered the following issue: Error: Cannot find module 'js' After researching online, I couldn't find a solution. The typical troubleshooting steps didn&ap ...

Issue with integrating Razorpay into a Node.js Express application

I am currently working on setting up a checkout page using nodejs and express with Razorpay as the payment gateway. The issue arises when trying to run the checkout() function by clicking the "Checkout" button within my shopping-cart.hbs file. Despite havi ...

Issue with Nextjs environmental variables not functioning in JavaScript pages

Currently, I am in the process of developing a Next.js website. Within my JavaScript file, I am fetching data from an API and assigning a token using the .env.local file. However, when attempting to access the .env variable that I've set up, it seems ...

Ways to adjust timestamps (DayJs) by increments of 1 minute, 5 minutes, 15 minutes, 30 minutes, and more

Currently, I am exploring time functionality within React Native by utilizing DayJs. I have noticed a slight inconsistency when comparing 2 different points in time to calculate the time difference. Typically, everything works smoothly such as with 10:00 ...

When I apply properties in JavaScript, I find that I am unable to utilize the CSS "hover" feature

For a personal project I am currently working on, I decided to experiment with setting background colors using Javascript. However, I have encountered an issue where my CSS code that changes the hover property does not seem to work after implementing the J ...

What is the solution for the error message "Unhandled Runtime Error" with the description "TypeError: videoRef.current.play is not a function"?

I am currently working on implementing custom controls for a video on a Nextjs website. When using a standard HTML <video> component, the code functions as expected and clicking the custom play button successfully plays the video. However, when I swi ...

The div that scrolls gracefully within its boundaries

Currently, I am working on a task that involves a div containing images that need to be scrolled left and right. I have successfully implemented the scrolling functionality using jQuery. However, I now face the challenge of ensuring that the content stays ...

Setting up a recurring task with a while loop in a cron job

Discover numerous libraries dedicated to implementing cron jobs in NodeJS and Javascript, allowing for hosting on a server. Ultimately, cron jobs are simply repetitive tasks set to run at specific times/dates. This led me to ponder the distinction betwee ...

Troubleshooting a deletion request in Angular Http that is returning undefined within the MEAN stack

I need to remove the refresh token from the server when the user logs out. auth.service.ts deleteToken(refreshToken:any){ return this.http.delete(`${environment.baseUrl}/logout`, refreshToken).toPromise() } header.component.ts refreshToken = localS ...

Interactive questioning system using Javascript/jQuery for Quick Responses

Hi there! I'm new to StackOverflow and a bit of a beginner when it comes to javascript/jquery. My current project involves creating a chat interface that looks like SMS text messages. Right now, I have users inputting text and using javascript to disp ...

What is the best way to extract the text from a class only when it is nested within a particular header tag?

const request = require ('request'); const cheerio = require('cheerio'); const fs = require ('fs'); request("http://kathmandupost.ekantipur.com/news/2018-08-31/bimstec-summit-multilateral-meet-underway.html", (error, response ...

Is it possible to scroll a div on mobile without the need for jQuery plugins?

Upon investigating the initial query, we managed to implement D3js for identifying a scroll event. This allowed us to scroll the div #scroll-content from any location on desktop devices. However, we encountered an issue where this method does not function ...

Navigating through a mergeMap observable with an undefined value

In my Angular 6 app, I have a class that attaches API tokens to every http request using the getIdToken() method. If the token retrieval is successful, everything works fine. However, if it fails, my app will stop functioning. I need help with handling th ...

Show or hide a component based on a mouse click in Vue JS

After a prolonged absence from working with Vue JS, I find myself in the process of displaying a list of data with a button for each item. The goal is to conditionally render a component when a button is clicked. I am wondering if there is a recommended a ...

Changing the color of a Highcharts series bar according to its value

Playing around with Highcharts in this plunker has led me to wonder if it's possible to dynamically set the color of a bar based on its value. In my current setup, I have 5 bars that change values between 0 and 100 at intervals. I'd like the colo ...

yii CGridView refresh trigger an influx of Ajax requests

Does anyone know why the yii cgridview refresh button triggers multiple ajax calls? Upon refreshing, I have noticed that it initiates several ajax calls (this time it's 3, but sometimes it's 4 or even 5) GET http://localhost/ijob-css/index.php/ ...