Загрузить файл Javascript на локальном хосте

Моя веб-страница создает новый элемент скрипта, а затем загружает скрипт с локального сервера. Проблема в том, что скрипт не может быть загружен и показывает 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>

Затем создайте локальный сервер для его прослушивания, чтобы можно было загрузить файл JavaScript.

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.info("Server listening");
})

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

Как я могу решить эту проблему?

Обновлять:

Изначально у меня был источник нового элемента скрипта как 'https://localhost:4200/script/test.js', поэтому я перешел на http, возникла новая ошибка:

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

javascript node.js express localhost

09.02.2023 05:02

Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией

В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.

Концепция локализации и ее применение в приложениях React ⚡️

Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...

Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer

В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...

Безумие обратных вызовов в javascript [JS]

Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...

Система управления парковками с использованием HTML, CSS и JavaScript

Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...

JavaScript Вопросы с множественным выбором и ответы

Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...

Перейти к ответу Данный вопрос помечен как решенный

Ответы 2

Вы не рассматривали возможность использования https? Похоже, это может быть ваша проблема, работающая локально. Ошибка протокола является поддавки.

09.02.2023 05:14

Ответ принят как подходящий

Вы просто меняете 2 строки своего 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(express.static('public'));
api.use('/script', express.static('script'));

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

И убедитесь, что ваше управление каталогами/файлами выглядит так:

Мне просто любопытно, как это что-то меняет, потому что он получает ошибку протокола, что означает, что он пытается подключиться к HTTPS на локальной машине.

— 10.02.2023 21:00

09.02.2023 06:36