gushoubang
/
one-code-manage
разклонено от siwei/SiWei-Cloud


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302
							<!DOCTYPE html>
<html lang="zh-CN">
<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;
            max-width: 900px;
            margin: 50px auto;
            padding: 20px;
            background-color: #f5f5f5;
        }
        .container {
            background-color: white;
            padding: 30px;
            border-radius: 8px;
            box-shadow: 0 2px 10px rgba(0,0,0,0.1);
        }
        h1 {
            color: #333;
            text-align: center;
            margin-bottom: 30px;
        }
        .section {
            margin-bottom: 30px;
            padding: 20px;
            border: 1px solid #ddd;
            border-radius: 5px;
        }
        .section h3 {
            color: #555;
            margin-top: 0;
        }
        input[type="text"], input[type="file"] {
            width: 100%;
            padding: 8px;
            border: 1px solid #ddd;
            border-radius: 4px;
            margin-bottom: 10px;
            box-sizing: border-box;
        }
        button {
            padding: 8px 16px;
            background-color: #007bff;
            color: white;
            border: none;
            border-radius: 4px;
            cursor: pointer;
            margin-right: 10px;
            margin-bottom: 10px;
        }
        button:hover {
            background-color: #0056b3;
        }
        button:disabled {
            background-color: #6c757d;
            cursor: not-allowed;
        }
        .example {
            background-color: #f8f9fa;
            padding: 15px;
            border-radius: 4px;
            margin: 10px 0;
            font-family: monospace;
            font-size: 14px;
            border-left: 4px solid #007bff;
        }
        .result {
            background-color: #d4edda;
            border: 1px solid #c3e6cb;
            padding: 15px;
            border-radius: 4px;
            margin-top: 10px;
        }
        .error {
            background-color: #f8d7da;
            border: 1px solid #f5c6cb;
            padding: 15px;
            border-radius: 4px;
            margin-top: 10px;
        }
        .info {
            background-color: #d1ecf1;
            border: 1px solid #bee5eb;
            padding: 15px;
            border-radius: 4px;
            margin-top: 10px;
        }
        .url-display {
            background-color: #f8f9fa;
            padding: 10px;
            border-radius: 4px;
            margin: 10px 0;
            font-family: monospace;
            font-size: 12px;
            word-break: break-all;
            border: 1px solid #dee2e6;
        }
    </style>
</head>
<body>
    <div class="container">
        <h1>绝对路径文件访问测试</h1>
        
        <div class="section">
            <h3>配置说明</h3>
            <div class="info">
                <strong>当前配置：</strong><br>
                文件存储路径：/home/siwei/uploadPath<br>
                文件服务地址：http://127.0.0.1:9202<br><br>
                
                <strong>支持的访问方式：</strong><br>
                方式1：http://127.0.0.1:9202/statics/相对路径<br>
                方式2：http://127.0.0.1:9202/home/siwei/uploadPath/相对路径 (新增)
            </div>
        </div>

        <div class="section">
            <h3>1. 文件上传测试</h3>
            <p>先上传一个文件，获取完整路径用于测试</p>
            <input type="file" id="fileInput" accept="*/*">
            <button onclick="uploadFile()" id="uploadBtn">上传文件</button>
            <div id="uploadResult" style="display:none;"></div>
        </div>

        <div class="section">
            <h3>2. 绝对路径访问测试</h3>
            <p>输入完整的文件路径进行访问测试</p>
            <input type="text" id="absolutePath" placeholder="输入绝对路径，如：/home/siwei/uploadPath/2025/08/01/文件_20250801154318A001.zip">
            <button onclick="testAbsolutePath()">测试绝对路径访问</button>
            <button onclick="fillExamplePath()">填入示例路径</button>
            <div id="absoluteResult" style="display:none;"></div>
        </div>

        <div class="section">
            <h3>3. 路径对比测试</h3>
            <p>对比两种访问方式的效果</p>
            <input type="text" id="relativePath" placeholder="输入相对路径，如：2025/08/01/文件_20250801154318A001.zip">
            <button onclick="testBothPaths()">对比测试</button>
            <div id="compareResult" style="display:none;"></div>
        </div>

        <div class="section">
            <h3>示例路径</h3>
            <div class="example">
                <strong>假设文件路径：</strong><br>
                完整路径：/home/siwei/uploadPath/2025/08/01/文件_20250801154318A001.zip<br><br>
                
                <strong>访问方式：</strong><br>
                方式1：http://127.0.0.1:9202/statics/2025/08/01/文件_20250801154318A001.zip<br>
                方式2：http://127.0.0.1:9202/home/siwei/uploadPath/2025/08/01/文件_20250801154318A001.zip
            </div>
        </div>
    </div>

    <script>
        function uploadFile() {
            const fileInput = document.getElementById('fileInput');
            const file = fileInput.files[0];
            const resultDiv = document.getElementById('uploadResult');
            const uploadBtn = document.getElementById('uploadBtn');
            
            if (!file) {
                alert('请选择文件');
                return;
            }

            const formData = new FormData();
            formData.append('file', file);

            uploadBtn.disabled = true;
            uploadBtn.textContent = '上传中...';
            resultDiv.style.display = 'block';
            resultDiv.innerHTML = '<div class="info">正在上传文件...</div>';

            fetch('http://127.0.0.1:9202/upload', {
                method: 'POST',
                body: formData
            })
            .then(response => response.json())
            .then(data => {
                uploadBtn.disabled = false;
                uploadBtn.textContent = '上传文件';
                
                if (data.code === 200) {
                    const result = data.data;
                    const absolutePath = result.path;
                    const relativePath = absolutePath.replace('/home/siwei/uploadPath/', '');
                    
                    resultDiv.innerHTML = `
                        <div class="result">
                            <strong>✅ 上传成功！</strong><br>
                            文件名：${result.name}<br>
                            完整路径：${result.path}<br>
                            相对路径：${relativePath}<br><br>
                            
                            <strong>测试链接：</strong><br>
                            <button onclick="window.open('http://127.0.0.1:9202/statics/${relativePath}', '_blank')">方式1：/statics 访问</button>
                            <button onclick="window.open('http://127.0.0.1:9202${absolutePath}', '_blank')">方式2：绝对路径访问</button><br><br>
                            
                            <button onclick="document.getElementById('absolutePath').value='${absolutePath}'">填入绝对路径测试框</button>
                            <button onclick="document.getElementById('relativePath').value='${relativePath}'">填入相对路径测试框</button>
                        </div>
                    `;
                } else {
                    resultDiv.innerHTML = `<div class="error">❌ 上传失败：${data.msg}</div>`;
                }
            })
            .catch(error => {
                uploadBtn.disabled = false;
                uploadBtn.textContent = '上传文件';
                console.error('Error:', error);
                resultDiv.innerHTML = `<div class="error">❌ 上传异常：${error.message}</div>`;
            });
        }

        function testAbsolutePath() {
            const absolutePath = document.getElementById('absolutePath').value.trim();
            const resultDiv = document.getElementById('absoluteResult');
            
            if (!absolutePath) {
                alert('请输入绝对路径');
                return;
            }
            
            const testUrl = `http://127.0.0.1:9202${absolutePath}`;
            
            resultDiv.style.display = 'block';
            resultDiv.innerHTML = `
                <div class="info">
                    <strong>测试URL：</strong><br>
                    <div class="url-display">${testUrl}</div>
                    <button onclick="window.open('${testUrl}', '_blank')">在新窗口打开</button>
                    <button onclick="testUrlAccess('${testUrl}', 'absoluteResult')">测试访问状态</button>
                </div>
            `;
        }

        function testBothPaths() {
            const relativePath = document.getElementById('relativePath').value.trim();
            const resultDiv = document.getElementById('compareResult');
            
            if (!relativePath) {
                alert('请输入相对路径');
                return;
            }
            
            const staticUrl = `http://127.0.0.1:9202/statics/${relativePath}`;
            const absoluteUrl = `http://127.0.0.1:9202/home/siwei/uploadPath/${relativePath}`;
            
            resultDiv.style.display = 'block';
            resultDiv.innerHTML = `
                <div class="info">
                    <strong>方式1 - /statics 前缀：</strong><br>
                    <div class="url-display">${staticUrl}</div>
                    <button onclick="window.open('${staticUrl}', '_blank')">打开</button>
                    <button onclick="testUrlAccess('${staticUrl}', 'static-status')">测试</button>
                    <span id="static-status"></span><br><br>
                    
                    <strong>方式2 - 绝对路径：</strong><br>
                    <div class="url-display">${absoluteUrl}</div>
                    <button onclick="window.open('${absoluteUrl}', '_blank')">打开</button>
                    <button onclick="testUrlAccess('${absoluteUrl}', 'absolute-status')">测试</button>
                    <span id="absolute-status"></span>
                </div>
            `;
        }

        function testUrlAccess(url, statusElementId) {
            const statusElement = document.getElementById(statusElementId);
            if (statusElement) {
                statusElement.innerHTML = ' 🔄 测试中...';
            }
            
            fetch(url, { method: 'HEAD' })
                .then(response => {
                    if (statusElement) {
                        if (response.ok) {
                            statusElement.innerHTML = ' ✅ 可访问';
                            statusElement.style.color = 'green';
                        } else {
                            statusElement.innerHTML = ` ❌ ${response.status}`;
                            statusElement.style.color = 'red';
                        }
                    }
                })
                .catch(error => {
                    if (statusElement) {
                        statusElement.innerHTML = ' ❌ 网络错误';
                        statusElement.style.color = 'red';
                    }
                });
        }

        function fillExamplePath() {
            document.getElementById('absolutePath').value = '/home/siwei/uploadPath/2025/08/01/文件_20250801154318A001.zip';
        }
    </script>
</body>
</html>