Как загрузить веб-компонент между доменами?

Question 1

Можете ли вы не загружать веб-компоненты из других доменов?

Я получаю ошибку cors в firefox/linux.

Я добавил это в nginx, но все еще не могу загрузить его:

  add_header Access-Control-Allow-Origin *;

<html lang="en">
  <head>
      <meta charset="utf-8" />
      <script type="module" src="//briskreader.com/components/feed-list.js"></script>
  </head>
  <body>
    <feed-list topic="bitcoin"></feed-list>
  </body>
</html>

Вот в чем ошибка:

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at http://briskreader.com/components/feed-list.js. (Reason: CORS header ‘Access-Control-Allow-Origin’ missing).

Loading module from “http://briskreader.com/components/feed-list.js” was blocked because of a disallowed MIME type (“text/html”).
test.html
Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at http://briskreader.com/components/feed-list.js. (Reason: CORS request did not succeed).

Вот заголовок из briskreader.com:

$ curl -I 'https://briskreader.com/components/feed-list.js'
HTTP/2 200 
server: nginx/1.18.0 (Ubuntu)
date: Sun, 21 Nov 2021 06:30:51 GMT
content-type: application/javascript
content-length: 2187
expires: Sun, 21 Nov 2021 06:30:50 GMT
cache-control: no-cache
cache-control: no-store, no-cache, must-revalidate, proxy-revalidate, max-age=0
access-control-allow-origin: *
accept-ranges: bytes

Question 2

Веб-компоненты не имеют ничего общего с CORS. Атрибут type="module" на <script> тег вызывает запрос CORS. В отличие от классических сценариев, сценарии модулей требуют использования протокола CORS для извлечения из разных источников.

Следующая строка add_header Access-Control-Allow-Origin *; бесполезно в домене происхождения. Вы должны установить Access-Control-Allow-Origin заголовок на briskreader.com домен. Если вы не контролируете briskreader.com, затем рассмотрите возможность использования классического сценария. Вы все еще можете использовать веб-компоненты с классическим сценарием.

Harshal Patil · Answer 1 · 2021-11-21T06:06:13

Веб-компоненты не имеют ничего общего с CORS. Атрибут type="module" на <script> тег вызывает запрос CORS. В отличие от классических сценариев, сценарии модулей требуют использования протокола CORS для извлечения из разных источников.

Следующая строка add_header Access-Control-Allow-Origin *; бесполезно в домене происхождения. Вы должны установить Access-Control-Allow-Origin заголовок на briskreader.com домен. Если вы не контролируете briskreader.com, затем рассмотрите возможность использования классического сценария. Вы все еще можете использовать веб-компоненты с классическим сценарием.

Я установил его на briskrsader, и он все еще не работает.
@chovy Можете ли вы поделиться заголовком ответа на запрос с //briskreader.com/components/feed-list.js?
обновленный вопрос, как вы можете видеть, имеет access-control-allow-origin: *
так вот в чем проблема. я использовал http-server который использует http, и мой сервер перенаправил http -> https, который, я думаю, не будет работать для не зависящих от протокола URL-адресов. Странный.
Если я изменю src атрибут модуля из // Для https:// это прекрасно работает.
Идеально // должно сработать. Но это странно. Рад, что это сработало для тебя.
Я проголосовал (со статусом -1 голос). [по моим непрофессиональным словам] // означает: сделайте запрос с протоколом, который выполняет запрашивающий, поэтому страница, обслуживаемая HTTP, делает запрос HTTP; затем сервер HTTP S заблокирует его, поскольку это небезопасный запрос. Сделайте 2-минутный поиск в Google, и вы получите множество ответов.
Я думал, что briskreader.com также служит на http и не только https.

Как загрузить веб-компонент между доменами?

Вопрос

Лучший ответ

На других языках

Эта страница на других языках

Популярное в этой категории

Популярные вопросы в этой категории