| 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>
 |