Load Javascript file on localhost [duplicate]

Question

My webpage creates a new script element and then loads the script from a localhost server. The problem is that the script cannot be loaded and shows PROTOCOL ERROR:

https://localhost:4200/script/test.js net::ERR_SSL_PROTOCOL_ERROR

index.html

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <link href="./public/nps.style.css" rel="stylesheet" />
        <script>
          j = document.getElementsByTagName('script')[0],
          k = document.createElement('script');
          k.src = 'http://localhost:4200/script/test.js';
          j.parentNode.insertBefore(k,j);
        </script>
  </head>
  <body>
    <p>Testing</p>
  </body>
</html>

Then create a localhost server to listen it so the JavaScript file can be downloaded

index.js:

const express = require('express');
const cors = require('cors');
const { test } = require('./script/test.js');

const api = express();
api.use(cors({origin: '*'}));
api.use('/script', express.static('public'));

api.listen(4200, () => {
  console.log("Server listening");
})

test.js: alert("it works!");

How can I solve this issue?

Update:

Initially I had the source of the new script element as 'https://localhost:4200/script/test.js', So I changed to http, a new error occurred:

GET http://localhost:4200/script/test.js net::ERR_ABORTED 404 (Not Found)

Judson Terrell · Accepted Answer · 2023-02-09 04:14:17Z

1

Have you considered not using https? It looks like this could be your issue running locally. The protocol error is the giveaway.

answered Feb 9, 2023 at 4:14

Judson Terrell

4,3262 gold badges32 silver badges51 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Jordy · Accepted Answer · 2023-02-09 05:36:33Z

0

You just change 2 lines of your index.js code to solve it. Try with this code :

const express = require('express');
const cors = require('cors');
// const { test } = require('./script/test.js');

const api = express();
api.use(cors({ origin: '*' }));
api.use(express.static('public'));
api.use('/script', express.static('script'));

api.listen(4200, () => {
    console.log("Server listening");
});

And make sure your directory/file management looks like this :

answered Feb 9, 2023 at 5:36

Jordy

2,0373 gold badges12 silver badges40 bronze badges

1 Comment

Judson Terrell Over a year ago

I’m just curious how this changes anything because he is getting a protocol error which means that he’s trying to hit HTTPS on the local machine

Collectives™ on Stack Overflow

Load Javascript file on localhost [duplicate]

2 Answers 2

Comments

1 Comment

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

1 Comment

Linked

Related