qin 发表于 2025-7-3 11:16:46

轻阅读后端

本帖最后由 qin 于 2025-7-3 11:46 编辑 <br /><br />如图 展示部分书源,支持免cf盾的站点:
1.https://www.69shuba.com-69书吧(原69主站)
2.https://69shux.co-69书吧
3.https://101kanshu.com-101看书
4.https://www.banxia.la-半夏小说
后端地址:http://154.222.29.11:7000
邀请码获取:https://static.yesui.me/qingread.html

app下载:
<div class="version-fetch-container">
    <style>
      :root {
            --primary: #4f46e5;
            --primary-light: #dbeafe;
            --secondary: #3b82f6;
            --accent: #ec4899;
            --surface: #ffffff;
            --text-primary: #1e293b;
            --text-secondary: #64748b;
            --border: #e2e8f0;
            --shadow-lg: 0 10px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
            --shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
      }

      .version-fetch-container {
            background: transparent;
            box-shadow: none;
            margin: 2rem auto;
            max-width: 850px;
            border-radius: 12px;
            overflow: hidden;
            transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
      }

      .page-title {
            text-align: center;
            margin: 1.5rem 0;
            font-size: 1.8rem;
            font-weight: 700;
            color: var(--primary);
      }

      .release-list {
            padding: 1.5rem;
      }

      .release-item {
            background: var(--surface);
            padding: 1.5rem;
            margin: 1.2rem 0;
            border-radius: 10px;
            box-shadow: var(--shadow-md);
            transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
            position: relative;
      }

      .release-item:hover {
            box-shadow: 0 10px 20px -5px rgba(0,0,0,0.1), 0 4px 6px -2px rgba(0,0,0,0.05);
      }

      .release-meta {
            display: flex;
            justify-content: space-between;
            align-items: center;
            margin-bottom: 1.2rem;
            flex-wrap: wrap;
            gap: 0.5rem;
      }

      .release-version {
            font-size: 1.25rem;
            font-weight: 600;
            color: var(--primary);
            flex: 1;
            min-width: 200px;
      }

      .release-date {
            color: var(--text-secondary);
            font-size: 0.9rem;
            text-align: right;
            flex-shrink: 0;
      }

      .asset-list {
            display: grid;
            grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
            gap: 1rem;
            margin-top: 1rem;
      }

      .asset-item {
            padding: 1rem;
            border-radius: 8px;
            background: rgba(241, 245, 249, 0.5);
            transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
      }

      .asset-item:hover {
            background: rgba(241, 245, 249, 0.8);
            transform: translateX(5px);
      }

      .asset-name {
            color: var(--text-primary);
            font-size: 0.95rem;
            text-decoration: none;
            display: block;
            margin-bottom: 0.75rem;
            font-weight: 500;
      }

      .asset-name:hover {
            color: var(--primary);
      }

      .asset-download {
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 0.5rem;
            color: var(--primary);
            font-size: 0.95rem;
            font-weight: 500;
            padding: 0.5rem 1rem;
            border-radius: 6px;
            background: rgba(79, 70, 229, 0.05);
            transition: all 0.2s ease;
            cursor: pointer;
      }

      .asset-download:hover {
            background: rgba(79, 70, 229, 0.1);
            transform: translateY(-1px);
      }

      @media (max-width: 768px) {
            .version-fetch-container {
                margin: 1rem auto;
            }
            
            .page-title {
                font-size: 1.5rem;
            }
            
            .release-version {
                font-size: 1.1rem;
                min-width: 160px;
            }
            
            .asset-list {
                grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
                gap: 0.8rem;
            }
      }
    </style>

    <h1 class="page-title">轻阅读下载</h1>

    <div id="version-fetch" class="loading-container">
      <div class="animate-spin"></div>
      <p class="loading-text">正在获取最新版本信息<span class="dots"></span></p>
    </div>

    <script>
      (function() {
            const repoUrl = 'https://api.github.com/repos/autobcb/read/releases';
            const container = document.getElementById('version-fetch');
            
            async function fetchReleases() {
                try {
                  const response = await fetch(repoUrl);
                  if (!response.ok) throw new Error(`HTTP Error: ${response.status}`);
                  
                  const releases = await response.json();
                  displayReleases(releases);
                } catch (error) {
                  showError(error.message);
                }
            }

            function displayReleases(releases) {
                container.innerHTML = releases.slice(0,3).map(release => `
                  <div class="release-item">
                        <div class="release-meta">
                            <span class="release-version">${release.tag_name}</span>
                            <span class="release-date">${new Date(release.published_at).toLocaleDateString('zh-CN', {
                              year: 'numeric',
                              month: 'long',
                              day: 'numeric',
                              hour: '2-digit',
                              minute: '2-digit'
                            })}</span>
                        </div>
                        <div class="asset-list">
                            ${release.assets.map(asset => `
                              <div class="asset-item">
                                    <a href="${asset.browser_download_url}"
                                       class="asset-name"
                                       target="_blank">${asset.name}</a>
                                    <div class="asset-download" data-url="${asset.browser_download_url}">
                                        <i class="fas fa-download"></i> 下载
                                    </div>
                              </div>
                            `).join('')}
                        </div>
                  </div>
                `).join('');
               
                document.querySelectorAll('.asset-download').forEach(button => {
                  button.addEventListener('click', function() {
                        const downloadUrl = this.getAttribute('data-url');
                        window.open(downloadUrl, '_blank');
                  });
                });
            }

            function showError(message) {
                container.innerHTML = `
                  <div class="error-container">
                        <p><i class="fas fa-exclamation-circle"></i> 错误: ${message}</p>
                        <p>建议检查网络连接或稍后重试</p>
                  </div>
                `;
            }

            fetchReleases();
      })();
    </script>
</div>


情绪 发表于 2025-7-3 11:22:42

感谢大佬

辉歌 发表于 2025-7-3 11:24:57

感谢大佬

taunia 发表于 2025-7-3 11:32:49

直接从那进会这样获取数据时发生错误?

zimushui 发表于 2025-7-3 11:33:50

获取邀请码显示Failed to fetch,
后端无法连接。

感谢分享

sunnytnt 发表于 2025-7-3 11:41:28

EDGE、chrome,点邀请码获取都报错,我试了,VIA浏览器可以获取。

rgm1988 发表于 2025-7-3 11:55:12

感谢分享

元通站 发表于 2025-7-3 12:37:03

感谢分享

dujddj 发表于 2025-7-3 13:44:46

感谢分享。

悠然浅笑 发表于 2025-7-3 13:46:08

感谢大佬
页: [1] 2 3 4 5
查看完整版本: 轻阅读后端