Аспро: ЛайтШоп [тема: [ТУТОРИАЛ]Как настроить noVNC на веб-приложении.]

[ТУТОРИАЛ]Как настроить noVNC на веб-приложении.

Fri, 28 Feb 2025 11:18:00 +0300

[ТУТОРИАЛ]Как настроить noVNC на веб-приложении. Proxmox Виртуальная Среда в форуме Proxmox Виртуальная Среда.
У меня есть еще один метод, если твой PVE URL отличается от NovNC URL: загрузи loadvnc.html, mgui.js, util.js, webutil.js в PVE ноду /usr/share/novnc-pve/ и PHP файл типа:

PHP:
```php
// Require the autoloader
require_once 'vendor/autoload.php';

// Use the library namespace
use ProxmoxVE\Proxmox;

// Create your credentials array
$credentials = [
'hostname' => 'id-n1.domain.com',
'username' => 'vnc',
'password' => 'q1w2e3r4',
'realm' => 'pve',
'port' => '8006',
];

// Then simply pass your credentials when creating the API client object.
$proxmox = new Proxmox($credentials);

session_start();
if ($login = $proxmox->login()) {
$host = $credentials['hostname'].':'.$credentials['port'];
$node = 'id-n1';
$vmid = 109;

$ticket = $login->getTicket();
$csrf = $login->getCsrf();

$src_href = "https://{$host}/novnc/loadvnc.html?novnc=1&token={$ticket}&CSRFPreventionToken={$csrf}&console=qemu&virtualization=qemu&node={$node}&vmid={$vmid}";
header("Location: ".$src_href);
exit();
}
```
28.02.2025 11:18:00, habibulilalbaab.

[ТУТОРИАЛ]Как настроить noVNC на веб-приложении.

Thu, 27 Feb 2025 11:56:00 +0300

[ТУТОРИАЛ]Как настроить noVNC на веб-приложении. Proxmox Виртуальная Среда в форуме Proxmox Виртуальная Среда.
Привет, могу подтвердить, что этот метод работает у меня:

Proxmox хост: id-n1.domain.com
VNC URL/Этот PHP файл (должен быть на том же домене, что и Proxmox домен): vnc.domain.com

PHP:
```php
ini_set('display_errors', '1');
ini_set('display_startup_errors', '1');
error_reporting(E_ALL);
// Require the autoloader
require_once 'vendor/autoload.php';

// Use the library namespace
use ProxmoxVE\Proxmox;

// Create your credentials array
$credentials = [
'hostname' => 'id-n1.domain.com', // Также может быть IP
'username' => 'vnc',
'password' => 'q1w2e3r4',
'realm' => 'pve',
'port' => '8006',
];

// Then simply pass your credentials when creating the API client object.
$proxmox = new Proxmox($credentials);

if ($login = $proxmox->login()) {
$host = $credentials['hostname'].':'.$credentials['port'];
$node = 'id-n1';
$vmid = 109;

$ticket = $login->getTicket();
setcookie("PVEAuthCookie",$ticket, 0, "/", ".domain.com" );
$config = $proxmox->create("/nodes/$node/qemu/$vmid/vncproxy", [
'websocket' => 1, // Start websocket proxy
]);

$websock = $proxmox->get("/nodes/$node/qemu/$vmid/vncwebsocket", [
'vncticket' => $config['data']['ticket'],
'port' => $config['data']['port']
]);

$src_href = 'https://'.$host.'/?console=kvm&novnc=1&vmid='.$vmid.'&node='.$node.'&path=/api2/json/nodes/'.$node.'/qemu/'.$vmid.'/vncwebsocket/port/'.$config['data']['port'].'/vncticket/'.$config['data']['ticket'];
echo '';
}
make sure PVEAuthCookie set to .yourdomain.com
```

Убедитесь, что PVEAuthCookie установлен для .yourdomain.com
27.02.2025 11:56:00, habibulilalbaab.

[ТУТОРИАЛ]Как настроить noVNC на веб-приложении.

Wed, 12 Feb 2025 11:24:00 +0300

[ТУТОРИАЛ]Как настроить noVNC на веб-приложении. Proxmox Виртуальная Среда в форуме Proxmox Виртуальная Среда.
@alexo @vegasss7 @habibulilalbaab @ultrasive Ребята, вы уже нашли решение?
12.02.2025 11:24:00, windowsdesxtop.

[ТУТОРИАЛ]Как настроить noVNC на веб-приложении.

Wed, 06 Nov 2024 06:47:00 +0300

[ТУТОРИАЛ]Как настроить noVNC на веб-приложении. Proxmox Виртуальная Среда в форуме Proxmox Виртуальная Среда.
Есть ли способ обойти необходимость в CSRF-токенах? Может быть, можно использовать обратный прокси, который будет добавлять нужный токен?
06.11.2024 06:47:00, ultrasive.

[ТУТОРИАЛ]Как настроить noVNC на веб-приложении.

Wed, 31 Jul 2024 13:22:00 +0300

[ТУТОРИАЛ]Как настроить noVNC на веб-приложении. Proxmox Виртуальная Среда в форуме Proxmox Виртуальная Среда.
Можно ли использовать VNC без PVEAuthCookie, как Spice? Если всё равно приходится устанавливать cookie, то проще использовать обычные ссылки, когда cookie браузера уже установлен. https://{host}/?console=kvm&novnc=1&vmid={vmid}&node={node}&autoresize=true. Это не работает, потому что проверяется CSRF-токен. Было бы неплохо, если бы VNC-тикета было достаточно без установки cookie.
31.07.2024 13:22:00, ShotgunPayDay.

[ТУТОРИАЛ]Как настроить noVNC на веб-приложении.

Tue, 09 Jul 2024 15:29:00 +0300

[ТУТОРИАЛ]Как настроить noVNC на веб-приложении. Proxmox Виртуальная Среда в форуме Proxmox Виртуальная Среда.
Это решение объединяет два разных подхода и генерирует лишние вызовы /vncproxy в Proxmox, что не нужно. Смотрите мою тему и комментарии здесь: https://forum.proxmox.com/threads/n...ction-timeout-on-vncproxy.150854/#post-682559 Если у вас другое мнение, не стесняйтесь это обсудить. Я думаю, лучше найти чистое решение без лишних вызовов и ненужных кусков кода.
09.07.2024 15:29:00, lubr.

[ТУТОРИАЛ]Как настроить noVNC на веб-приложении.

Thu, 11 Jan 2024 06:35:00 +0300

[ТУТОРИАЛ]Как настроить noVNC на веб-приложении. Proxmox Виртуальная Среда в форуме Proxmox Виртуальная Среда.
Привет, я использую этот код, и всё работает. Можешь попробовать, тебе нужно добавить auth cookie. Мой PVE Node: n1.domain Моя APP: vnc.domain PHP:
```php

// Require the autoloader
require_once 'vendor/autoload.php';

// Use the library namespace
use ProxmoxVE\Proxmox;

// Create your credentials array
$credentials = [
'hostname' => 'n1.domain', // Also can be an IP
'username' => 'root',
'password' => 'pass',
'realm' => 'pam',
'port' => '8006',
];

// Then simply pass your credentials when creating the API client object.
$proxmox = new Proxmox($credentials);

if ($login = $proxmox->login()) {
$host = $credentials['hostname'];
$node = 'n1';
$vmid = 119;

$ticket = $login->getTicket();
setcookie("PVEAuthCookie",$ticket, 0, "/", '.domain' );
$config = $proxmox->create("/nodes/$node/qemu/$vmid/vncproxy", [
'websocket' => 1, // Start websocket proxy
]);

$websock = $proxmox->get("/nodes/$node/qemu/$vmid/vncwebsocket", [
'vncticket' => $config['data']['ticket'],
'port' => $config['data']['port']
]);
// print_r($login);
$src_href = 'https://'.$host.'/?console=kvm&novnc=1&node='.$node.'&resize=1&vmid='.$vmid.'&path=api2/json/nodes/'.$node.'/qemu/'.$vmid.'/vncwebsocket/port/'.$config['data']['port'].'/vncticket/'.$config['data']['ticket'];
echo '';
}
```
11.01.2024 06:35:00, habibulilalbaab.

[ТУТОРИАЛ]Как настроить noVNC на веб-приложении.

Tue, 18 Jul 2023 13:47:00 +0300

[ТУТОРИАЛ]Как настроить noVNC на веб-приложении. Proxmox Виртуальная Среда в форуме Proxmox Виртуальная Среда.
Не могли бы вы поделиться ссылкой на видео???
18.07.2023 13:47:00, dklinux7.

[ТУТОРИАЛ]Как настроить noVNC на веб-приложении.

Thu, 16 Mar 2023 13:05:00 +0300

[ТУТОРИАЛ]Как настроить noVNC на веб-приложении. Proxmox Виртуальная Среда в форуме Proxmox Виртуальная Среда.
Ты смог заставить это работать в итоге? У меня тоже ошибка 401 No Ticket, хотя я использую VNC-билет. Мой URL выглядит так: Code: https://172.17.50.250:8006/?console=kvm&novnc=1&node=mynodename&resize=1&vmid=103&path=api2/json/nodes/mynodename/qemu/103/vncwebsocket/port/5900/"vncticket"/PVEVNC%3A64130932%3A%3Adn%2BOzhoQtfRvVKfxd%2F%2BxE9IbBIwegHihcg8IZ2YRce%2BQrRGHcXtFQRr1QSmOMCyJrgzPiHGdu%2Bv0WZmhqK6ablXIsj%2FEY1f%2BVma2Fkp%2FH9A0pvkoQxcMYayLDwZPIFQYAcf%2BLzmQNybVKdGQgCY%2FB%2Bib1abUaohbRWbBUZq6y8CS1S6y8u6DBSf5jp7zc6wugpr3AOWtj%2BpTCtZZWwCChE1t2CyFVF78hAQB%2F1BCPYFx9%2B%2FuEgdKv0s4Vzr%2BHXOQnXy%2F64G55lOcnz6ewIp6v0twwxr1i%2FjD6jmqZ9BBgWgMfzQaiUCLilSA3dE0G8Le30a%2ByReJIJyIi7QqgVvGvQ%3D%3D Ещё заметил, что после получения ошибки 401, веб-интерфейс Proxmox показывает подключения немного дольше, прежде чем отключаться
16.03.2023 13:05:00, MatthieuLAURENT39.

[ТУТОРИАЛ]Как настроить noVNC на веб-приложении.

Mon, 13 Mar 2023 08:47:00 +0300

[ТУТОРИАЛ]Как настроить noVNC на веб-приложении. Proxmox Виртуальная Среда в форуме Proxmox Виртуальная Среда.
Судя по всему, я что-то делаю не так.
13.03.2023 08:47:00, alexo.

[ТУТОРИАЛ]Как настроить noVNC на веб-приложении.

Sun, 12 Mar 2023 23:46:00 +0300

[ТУТОРИАЛ]Как настроить noVNC на веб-приложении. Proxmox Виртуальная Среда в форуме Proxmox Виртуальная Среда.
https://123.123.12.12:8006/?console.../nodes/s3356/qemu/9803/vncwebsocket/port/5900 "/vncticket/"PVEVNC:640E5602::ZcxySe36YkbisxgRfXs3zqEMGO54zUXP1HdPMJKDjkZ7u7FaUdVYFMS9txDE1h2LVCnSsnZiV0tQzBd4zF4mue8A7evGajTMRoPGJSAsb73QSD8jW3je2bbxLokCqj/o8PzCyRh7yL/4gc3boELBkfsD3awcJKpfuT1zxMFckBMxESRRgog2bn4g9TmtMc8yqnZnViKm0rpaQZ7XVyOmV4LHP9336Ps/Dnh0naMByjTzoLaNw4++1IukrXIRAoDnJ1AvOdS5DPJZuwrCUawvjkSUTgyF7Nj9D/94uC5Z7LipKV9TNOXAq4K+5v8fK0B+UBj+DaibjDfjEbaRGeEF4A==
12.03.2023 23:46:00, alexo.

[ТУТОРИАЛ]Как настроить noVNC на веб-приложении.

Sun, 12 Mar 2023 23:39:00 +0300

[ТУТОРИАЛ]Как настроить noVNC на веб-приложении. Proxmox Виртуальная Среда в форуме Proxmox Виртуальная Среда.
Ошибка сервера: запрос `GET https://123.123.12.12:8006/api2/json/ticket` вернул ответ `501 Method 'GET /ticket' not implemented`: {"data":null}
12.03.2023 23:39:00, alexo.

[ТУТОРИАЛ]Как настроить noVNC на веб-приложении.

Sun, 12 Mar 2023 23:31:00 +0300

[ТУТОРИАЛ]Как настроить noVNC на веб-приложении. Proxmox Виртуальная Среда в форуме Proxmox Виртуальная Среда.
PHP: require 'vendor/autoload.php';
use ProxmoxVE\Proxmox;
use GuzzleHttp\Client;
function PreviewVnc($vmID, $nodeid) {
// pass in the vmid and nodeid from the functions above
$node = $nodeid;
$vmid = $vmID;
// set up the proxmox creds and login
$credentials = [
'hostname' => '123.123.12.12', // Also can be an IP
'username' => 'root',
'password' => 'mypassword',
];
$host = $credentials['hostname'];
$proxmox = new Proxmox($credentials);
if ($login = $proxmox->login()) {

$ticket = $login->getTicket();

$config = $proxmox->create("/nodes/$node/qemu/$vmid/vncproxy", [
'websocket' => 1, // Start websocket proxy
]);

$websock = $proxmox->get("/nodes/$node/qemu/$vmid/vncwebsocket", [

'vncticket' => $config['data']['ticket'],
'port' => $config['data']['port']
]);

$src_href = 'https://'.$host.':8006/?console=kvm&novnc=1&node='.$node.'&resize=1&vmid='.$vmid.'&path=api2/json/nodes/'.$node.'/qemu/'.$vmid.'/vncwebsocket/port/'.$config['data']['port'].'"/vncticket/"'.$config['data']['ticket'];
echo '';
}
}
?> Теперь я изменил это на $config['data']['ticket'], но это не помогло
12.03.2023 23:31:00, alexo.

[ТУТОРИАЛ]Как настроить noVNC на веб-приложении.

Sun, 12 Mar 2023 23:29:00 +0300

[ТУТОРИАЛ]Как настроить noVNC на веб-приложении. Proxmox Виртуальная Среда в форуме Proxmox Виртуальная Среда.
Ну, у каждого будет немного разная конфигурация, это просто обзор основ настройки. Мой код должен работать в теории, он работает у меня. В некоторых случаях может потребоваться функция получения access token, которая будет получать определённый тикет для аутентификации, например, так: PHP:

```php
function getAT() {
$credentials = [
'hostname' => 'domain.com', // Также может быть IP
'username' => 'apiuser',
'password' => 'pass123',
];
$proxmox = new Proxmox($credentials);
if ($login = $proxmox->login()) {
$ticket = $login->getTicket();
return $ticket;
}
return null;

$getTicket = $proxmox->get("/ticket");

}
```
12.03.2023 23:29:00, parrotassassin15.

[ТУТОРИАЛ]Как настроить noVNC на веб-приложении.

Sun, 12 Mar 2023 23:20:00 +0300

[ТУТОРИАЛ]Как настроить noVNC на веб-приложении. Proxmox Виртуальная Среда в форуме Proxmox Виртуальная Среда.
И я только что взял твой код.
12.03.2023 23:20:00, alexo.

[ТУТОРИАЛ]Как настроить noVNC на веб-приложении.

Sun, 12 Mar 2023 22:47:00 +0300

[ТУТОРИАЛ]Как настроить noVNC на веб-приложении. Proxmox Виртуальная Среда в форуме Proxmox Виртуальная Среда.
Привет, там есть два разных типа тикетов: VNC-тикет и PVE-тикет. Убедись, что ты передаешь правильный тикет в нужное место. Похоже, ты используешь PVE-тикет для входа в VNC, когда тебе нужен VNCPVE-тикет. `<---- этот фрагмент кода извлекает vnc-тикет. Основное различие между ними в том, что PVE-тикет аутентифицирует весь сервер, а vnc-тикет аутентифицирует только vnc-прокси. Надеюсь, это поможет, если все равно возникнут проблемы — дай знать.
12.03.2023 22:47:00, parrotassassin15.

[ТУТОРИАЛ]Как настроить noVNC на веб-приложении.

Fri, 28 Apr 2023 23:26:00 +0300

[ТУТОРИАЛ]Как настроить noVNC на веб-приложении. Proxmox Виртуальная Среда в форуме Proxmox Виртуальная Среда.
Ребята, вы пробовали установить cookie для VNC-тикета? Мое веб-приложение работает и без него, но в некоторых случаях он может понадобиться. Могу сделать видео и скинуть ссылку на него сегодня, если это поможет?
28.04.2023 23:26:00, parrotassassin15.

[ТУТОРИАЛ]Как настроить noVNC на веб-приложении.

Sun, 12 Mar 2023 07:57:00 +0300

[ТУТОРИАЛ]Как настроить noVNC на веб-приложении. Proxmox Виртуальная Среда в форуме Proxmox Виртуальная Среда.
Ошибка 801 Нет тикета https://myhostip:8006/?console=kvm&...n/nodes/s123/qemu/9505/vncwebsocket/port/5900 "/vncticket/"PVE:root@pam:640D7AAD::S/gwT/TL7fGdfC+eVraLJZ3JmvUhKtxFxxWFAJG42Q2FPjMUXWZVBjN5Rn39olTwjIgiuiHCnfrSAd7Jgml/bUSZQ7v/M0lodhlfB96MnGE7ObLJixuldTxDVgf7giDxLiK+UL/ThVPs6darIeZniMN5kaGMXnspywv9u9o/qqW9/EJv0XQECM2u+8Rb4bTMlbVqfc0auX43dW/SqjoCdpINEfdMYAiMGpqInannQdvGG/gnPzrBxe3J3TWbtgAloJB0nZZM27LI53TdIFUdj313sUVBjPxEXOHIL7AB0SOvM7TXC9ejqzABH/PBh3YY2lP0WwIvldQQlRXTmg1omQ==
12.03.2023 07:57:00, alexo.

[ТУТОРИАЛ]Как настроить noVNC на веб-приложении.

Mon, 02 Oct 2023 11:55:00 +0300

[ТУТОРИАЛ]Как настроить noVNC на веб-приложении. Proxmox Виртуальная Среда в форуме Proxmox Виртуальная Среда.
Привет, извините, что поднимаю эту тему снова, можно ли использовать API Token вместо PVEAuthCookie? Спасибо! И, кстати, вы уже сняли видео?
02.10.2023 11:55:00, vegasss7.

[ТУТОРИАЛ]Как настроить noVNC на веб-приложении.

Sun, 05 Mar 2023 07:42:00 +0300

[ТУТОРИАЛ]Как настроить noVNC на веб-приложении. Proxmox Виртуальная Среда в форуме Proxmox Виртуальная Среда.
Короткий рассказ о том, как я настроил noVNC. После бесчисленных часов исследований я наконец-то все настроил так, как задумано. Хочу поделиться пошаговой инструкцией, чтобы людям в будущем было проще.

Я использую следующий API Wrapper: https://github.com/zzantares/ProxmoxVE

Вкратце, вот что нам нужно сделать:

* Установить API Wrapper на хост-систему.
* Добавить API-пользователя и убедиться, что у него есть необходимые права.
* Создать функции для предварительного просмотра VNC на страницах по вашему выбору.
* Встроить (Iframe) экземпляр VNC в веб-приложение.

Эта настройка может не сработать для вас. Если это так, ответьте в этой теме, и я помогу вам. Возможно, вам потребуется внести некоторые изменения для вашей конкретной настройки.

Вот как создать нового пользователя с необходимыми правами для VNC:

(Нажмите на Datacenter, а затем Users)

Добавить пользователя, нажав здесь:

Затем нам нужно убедиться, что у этого нового пользователя есть пароль. Вот что я лично предпочитаю для этого:

Можно просто добавить нового пользователя с надежным паролем (будьте внимательны к специальным символам, поскольку этот Proxmox wrapper их не любит: '&$').

Bash: `adduser api`

Затем нужно повторить это на уровне Datacenter:

```json
{
"lightbox_close": "Закрыть",
"lightbox_next": "Следующий",
"lightbox_previous": "Предыдущий",
"lightbox_error": "Запрашиваемый контент не может быть загружен. Пожалуйста, попробуйте позже.",
"lightbox_start_slideshow": "Запустить слайдшоу",
"lightbox_stop_slideshow": "Остановить слайдшоу",
"lightbox_full_screen": "Полноэкранный режим",
"lightbox_thumbnails": "Миниатюры",
"lightbox_download": "Загрузить",
"lightbox_share": "Поделиться",
"lightbox_zoom": "Увеличить",
"lightbox_new_window": "Новое окно",
"lightbox_toggle_sidebar": "Переключить боковую панель"
}
```

[https://forum.proxmox.com/attachments/1677997390955-png.47577/?hash=4b135874fbeefba380d04ae5ca7436a2](<#9 >)

Нажмите на нового пользователя, который был создан, а затем на Password:

Убедитесь, что вы вводите тот же пароль, что и в командной строке хост-системы.

Затем нам нужно убедиться, что у этого нового пользователя есть необходимые права: (Создайте Resource Pool для ресурсов, которые мы хотим предоставить API-пользователю)

Затем просто назовите его – можете назвать как угодно. После этого мы сможем добавлять ресурсы в этот пул:

Нажмите на Virtual Machines, чтобы массово добавить отдельные машины:

Затем просто добавьте машины, к которым API-пользователь должен иметь доступ.

Наконец, мы можем добавить соответствующие права для пользователя:

Структура файлов:

---

VNC\_API:

* vm\_functions.php
* preview\_vnc.php

Установка Wrapper:

Bash: `composer require zzantares/proxmoxve ~4.0`

FILE: vm\_functions.php

```php

use ProxmoxVE\Proxmox;
use GuzzleHttp\Client;

function PreviewVnc($vmID, $nodeid) {
// pass in the vmid and nodeid from the functions above
$node = $nodeid;
$vmid = $vmID;

// set up the proxmox creds and login
$credentials = [
'hostname' => 'proxmox-domain', // Also can be an IP
'username' => 'api',
'password' => 'password',
];

$host = $credentials['hostname'];

$proxmox = new Proxmox($credentials);

if ($login = $proxmox->login()) {

$ticket = $login->getTicket();

$config = $proxmox->create("/nodes/$node/qemu/$vmid/vncproxy", [
'websocket' => 1, // Start websocket proxy
]);

$websock = $proxmox->get("/nodes/$node/qemu/$vmid/vncwebsocket", [

'vncticket' => $config['data']['ticket'],
'port' => $config['data']['port']
]);

$src_href = 'https://'.$host.':8006/?console=kvm&novnc=1&node='.$node.'&resize=1&vmid='.$vmid.'&path=api2/json/nodes/'.$node.'/qemu/'.$vmid.'/vncwebsocket/port/'.$config['data']['port'].'"/vncticket/"'.$ticket;
echo '';
}
}

?>
```

FILE: preview\_vnc.php

```php
require 'vm_functions.php';

$vmid = 100;
$node = 'proxmox';

PreviewVnc($vmid, $node);
```

Если все пройдет успешно, у вас должна быть инстанция VNC, запущенная на preview\_vnc.php.
05.03.2023 07:42:00, parrotassassin15.