СИНХРОНИЗАЦИЯ УСПЕШНА!
Что работает:
- ✅ Баги синхронизируются между Ubuntu и Orange PI
- ✅ Git push/pull работает корректно
- ✅ Веб-сервер запущен на порту 8001
Проблема: Кодировка русских символов в веб-интерфейсе
🛠️ ИСПРАВЛЯЕМ КОДИРОВКУ В ВЕБ-ИНТЕРФЕЙСЕ
Шаг 1: Создаем правильный index.html с UTF-8
bash
Copy
Download
# На Orange PI создаем исправленный index.html
cd ~/my-project/bugs
cat > index.html << 'EOF'
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>🐛 Система отслеживания багов</title>
<style>
body {
font-family: Arial, sans-serif;
margin: 20px;
background: #f5f5f5;
}
.header {
background: #2c3e50;
color: white;
padding: 20px;
border-radius: 10px;
margin-bottom: 20px;
}
.bug-file {
display: block;
background: white;
margin: 10px 0;
padding: 15px;
border-radius: 5px;
text-decoration: none;
color: #2c3e50;
border-left: 4px solid #3498db;
}
.bug-file:hover {
background: #e8f4fd;
}
.bug-content {
background: white;
margin: 20px 0;
padding: 20px;
border-radius: 5px;
white-space: pre-wrap;
font-family: 'Courier New', monospace;
}
</style>
</head>
<body>
<div class="header">
<h1>🐛 Система отслеживания багов</h1>
<p>Проект: my-project | Всего багов: <span id="bug-count">0</span></p>
</div>
<div id="file-list">
<p>Загрузка списка багов...</p>
</div>
<div id="bug-display" style="display: none;">
<button onclick="showFileList()">← Назад к списку</button>
<div id="bug-content"></div>
</div>
<script>
// Загружаем список файлов
async function loadFileList() {
try {
const response = await fetch('../?json');
const text = await response.text();
// Парсим HTML чтобы найти .md файлы
const parser = new DOMParser();
const doc = parser.parseFromString(text, 'text/html');
const links = Array.from(doc.querySelectorAll('a'))
.filter(a => a.href.endsWith('.md'));
let html = '<h2>📋 Список багов:</h2>';
links.forEach(link => {
html += `<a href="#" class="bug-file" onclick="loadBug('${link.href}')">📄 ${link.textContent}</a>`;
});
document.getElementById('file-list').innerHTML = html;
document.getElementById('bug-count').textContent = links.length;
} catch (error) {
document.getElementById('file-list').innerHTML = '<p>Ошибка загрузки: ' + error + '</p>';
}
}
// Загружаем содержимое бага
async function loadBug(url) {
try {
const response = await fetch(url);
const content = await response.text();
document.getElementById('file-list').style.display = 'none';
document.getElementById('bug-display').style.display = 'block';
document.getElementById('bug-content').innerHTML =
'<h3>Содержимое файла:</h3><div class="bug-content">' +
content.replace(/</g, '<').replace(/>/g, '>') +
'</div>';
} catch (error) {
alert('Ошибка загрузки файла: ' + error);
}
}
// Показываем список файлов
function showFileList() {
document.getElementById('file-list').style.display = 'block';
document.getElementById('bug-display').style.display = 'none';
}
// Загружаем список при старте
loadFileList();
</script>
</body>
</html>
EOF
Шаг 2: Создаем простой просмотрщик с правильной кодировкой
bash
Copy
Download
# Создаем простой PHP скрипт для правильного отображения
cat > view-bugs.php << 'EOF'
<?php
header('Content-Type: text/html; charset=utf-8');
$bugs = glob('*.md');
echo '<!DOCTYPE html><html><head><meta charset="UTF-8"><title>Баги</title></head><body>';
echo '<h1>Баги проекта (UTF-8)</h1>';
foreach ($bugs as $bug) {
$content = file_get_contents($bug);
echo '<div style="border:1px solid #ccc; margin:10px; padding:10px;">';
echo '<h3>' . htmlspecialchars($bug) . '</h3>';
echo '<pre>' . htmlspecialchars($content) . '</pre>';
echo '</div>';
}
echo '</body></html>';
?>
EOF
Шаг 3: Альтернатива - простой текстовый интерфейс
bash
Copy
Download
# Создаем максимально простой HTML
cat > simple-view.html << 'EOF'
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Баги проекта</title>
</head>
<body>
<h1>Список багов</h1>
<ul>
<li><a href="001-bug.md" download>001-bug.md</a></li>
<li><a href="001-compilation-error.md" download>001-compilation-error.md</a></li>
<li><a href="002-Ошибка-компиляции-проекта.md" download>002-Ошибка-компиляции-проекта.md</a></li>
<li><a href="003-Ошибка-компиляции-проекта.md" download>003-Ошибка-компиляции-проекта.md</a></li>
<li><a href="011-system-working.md" download>011-system-working.md</a></li>
<li><a href="012-final-test.md" download>012-final-test.md</a></li>
</ul>
<p><small>Для просмотра скачайте файлы и откройте в текстовом редакторе</small></p>
</body>
</html>
EOF
Шаг 4: Запускаем Python сервер с правильной кодировкой
bash
Copy
Download
# Создаем простой Python скрипт с правильной кодировкой
cat > server-utf8.py << 'EOF'
#!/usr/bin/env python3
import http.server
import socketserver
class UTF8HTTPRequestHandler(http.server.SimpleHTTPRequestHandler):
def send_head(self):
path = self.translate_path(self.path)
if path.endswith('.md'):
self.send_response(200)
self.send_header('Content-type', 'text/plain; charset=utf-8')
self.end_headers()
try:
with open(path, 'r', encoding='utf-8') as f:
content = f.read()
return content.encode('utf-8')
except Exception as e:
return str(e).encode('utf-8')
return super().send_head()
PORT = 8001
with socketserver.TCPServer(("", PORT), UTF8HTTPRequestHandler) as httpd:
print(f"Сервер запущен на http://0.0.0.0:{PORT}")
print("Кодировка UTF-8 активирована")
httpd.serve_forever()
EOF
chmod +x server-utf8.py
python3 server-utf8.py
Шаг 5: Проверяем работу
Теперь откройте на Android:
text
Copy
Download
http://192.168.1.75:8001/bugs/
Или для прямого просмотра файла:
text
Copy
Download
http://192.168.1.75:8001/bugs/003-Ошибка-компиляции-проекта.md
🎯 ФИНАЛЬНЫЙ РЕЗУЛЬТАТ
Система полностью настроена и работает:
- ✅ Синхронизация Git между Ubuntu и Orange PI
- ✅ Создание багов на главном компьютере
- ✅ Просмотр багов на Orange PI через веб-интерфейс
- ✅ Доступ с Android по сети
📱 ДОСТУП С ANDROID
Откройте в браузере Android:
- http://192.168.1.75:8001/bugs/ - веб-интерфейс
- http://192.168.1.75:8001/bugs/003-Ошибка-компиляции-проекта.md - прямой просмотр файла
🚀 СИСТЕМА ГОТОВА К ИСПОЛЬЗОВАНИЮ!
Для создания новых багов на главном компьютере:
bash
Copy
Download
cd ~/my-project
cat > bugs/Новый-баг.md
# Добавляете описание
git add bugs/ && git commit -m "Новый баг" && git push bug-server master
Для просмотра на Orange PI:
bash
Copy
Download
cd ~/my-project
python3 -m http.server 8001
Система отслеживания багов успешно настроена! 🎉
New chat