CORS, PTZ и метод PUT

[ВиталийC 0]

Добрый день! Два дня уже бьюсь. Есть задача интеграции в наш WEB сервер вашего WEB сервера. Оба сервера на одном компьютере, пока.

Видео получаю, методы GET выполняются. Метод PUT для управления камерой - ни в какую. Браузер в консоле выдаёт что это запрещено CORS политикой.

Формирую запрос вида

const response = fetch(url, {
        method: 'PUT', // *GET, POST, PUT, DELETE, OPTION etc.
        mode: 'cors', // no-cors, *cors, same-origin
        headers: {
            'Content-Type': 'application/json',
        },
        body: JSON.stringify(json) // body data type must match "Content-Type" header
    })

Что я делаю не так, и как надо?

[Станислав 0]

Здравствуйте !
1.) Как реализуется авторизация этого запроса?
2.) Нужны полный запрос клиента и ответ сервера (со всеми заголовками, скопированные, например, через консоль разработки).
Возможно, сначала уходит какой-нибудь OPTIONS и сервер отвечает, что он не поддерживается.

[ВиталийC 0]

Для метода PUT пробовал url вида 'http://192.168.1.32:9786/cameras/0/ptz/zoom/relative?authorization=Basic%20' + utf8_to_b64(user + ':' pass)

Пробовал перед эти запросом посылать метод get для url 'http://192.168.1.32:9786/cameras/0?authorization=Basic%20' + utf8_to_b64(user + ':' pass)

Get - проходит, Put - нет. Put считается "сложным" запросом, и да, перед ним браузер сам формирует запрос OPTIONS, на что получает такой ответ в консоле -

index.html:1 Access to fetch at 'http://192.168.1.32:9786/cameras/0/ptz/zoom/relative?authorization=Basic%20d2ViOmFkbWlu' from origin 'http://192.168.1.32:8088' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: It does not have HTTP ok status.
ptz_utils.js:61 PUT http://192.168.1.32:9786/cameras/0/ptz/zoom/relative?authorization=Basic%20d2ViOmFkbWlu net::ERR_FAILED
putCom_URL @ ptz_utils.js:61
runPTZ @ ptz_utils.js:128
onclick @ index.html:1
index.html:1 Uncaught (in promise) TypeError: Failed to fetch

 И такой во вкладке Network

Request URL: http://192.168.1.32:9786/cameras/0/ptz/zoom/relative?authorization=Basic%20d2ViOmFkbWlu
Request Method: OPTIONS
Status Code: 405 Method Not Allowed
Remote Address: 192.168.1.32:9786
Referrer Policy: no-referrer-when-downgrade

Access-Control-Allow-Origin: *
Connection: Keep-Alive
Content-Length: 169
Content-Type: text/html; charset=UTF-8
Date: Wed, 29 Jul 2020 09:40:34 GMT
Server: Devline Linia Server

Accept: */*
Accept-Encoding: gzip, deflate
Accept-Language: ru-RU,ru;q=0.9,en-US;q=0.8,en;q=0.7
Access-Control-Request-Headers: content-type
Access-Control-Request-Method: PUT
Connection: keep-alive
Host: 192.168.1.32:9786
Origin: http://192.168.1.32:8088
Referer: http://192.168.1.32:8088/index.html
Sec-Fetch-Mode: cors
User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/83.0.4103.116 Safari/537.36 OPR/69.0.3686.77

authorization: Basic d2ViOmFkbWlu

Если из url убрать часть ?authorization=Basic%20d2ViOmFkbWlu

Начало ответа сервера меняется на такое

Request URL: http://192.168.1.32:9786/cameras/0/ptz/zoom/relative
Request Method: OPTIONS
Status Code: 401 Unauthorized
Remote Address: 192.168.1.32:9786
Referrer Policy: no-referrer-when-downgrade

После всё идентично, как и в случае с частью ?authorization=Basic%20d2ViOmFkbWlu

Есть ли пример, как с помощью fetch api корректно вызвать PUT метод? Был бы очень признателен

[Станислав 0]

Здравствуйте !
Попробуйте  воспользоваться  переопределением метода - нужно изменить запрос с PUT на GET и добавить параметр "method=PUT", например:

GET http://192.168.1.32:9786/cameras/0/ptz/zoom/relative?method=PUT&authorization=Basic%20d2ViOmFkbWlu

 

[ВиталийC 0]

Спасибо, - но, не помогло.

Can’t access http://192.168.1.32:9786/cameras/0/ptz/zoom/relative?method=PUT&authorization=Basic%20d2ViOmFkbWlu response. Blocked by browser? TypeError:Failed to execute 'fetch' on 'Window': Request with GET/HEAD method cannot have body.

Get не может иметь Body. Как в этот запрос запихнуть ещё и json или xml данные для ptz?

Похоже, CORS разрешает только Get и Post. Либо сервер должен в заголовке возвращать как минимум 'Access-Control-Allow-Methods', 'GET,PUT,POST,OPTIONS');

[unlifer 0]

Здравствуйте.

А Вы не пробовали указать, что в запросе присутствует авторизация?

То есть указать:

credentials: 'include'

Хотя, по идее, если у Вас оба web-сервера на одной машине, то должно быть:

credentials: 'same-origin'

[ВиталийC 0]

Здравствуйте! Чего я только не пробовал уже.

Для подмены Put на Get это вообще не имеет смысла, т.к. тут ошибка в наличии Body, которого в Get быть не должно. А в случае чистого Put, ошибка в том, что браузер формирует зарос OPTION на который сервер отвечает, что он его не поддерживает (405). Формировал запрос OPTION и в ручную, с авторизацией - ответ аналогичный (405), без - ответ что она требуется (401).

credentials: 'include' подразумевает что в headers будет присутствовать 'Authorization': "Basic%20"... а сервер должен ответить Access-Control-Allow-Credentials (не отвечает). Да и вообще, такая авторизация не проходит, проходит только через URL.

Замкнутый круг получается - Put может и работает, но т.к. не работает Options, то не получается вызвать и Put.

[russki666 0]

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

[ВиталийC 0]

russki666 Спасибо! жду

[russki666 0]

В 01.08.2020 в 20:29, ВиталийC сказал:

Спасибо! жду

Все подтвердилось и думаю будем костылить как и с запросами POST.

И так же не могу обещать что исправления будут в 7-ке. Мне нужно время чтобы все утвердить и сделать рабочий вариант.

Когда делали эту часть  API, браузеры еще не блокировали запросы. Приносим свои извинения! Буду держать в курсе по мере решения вопроса.