CPanel 特定页面密码访问设置教程

在 cPanel 中，目录隐私 Directory Privacy 功能可以为网站或网站中的特定文件添加用户和密码保护功能，只有输入正确用户名和密码的用户才能访问页面中的具体内容，可以防止未经授权的人访问敏感文件。

例如，我们在独立站添加批发会员价格区，为批发会员提供专属的访问权限；

或者添加一个受密码保护的报价和文档下载专区，为客户开通账户供他们随时下载；

再或者，将自动备份的网站数据放在受密码保护的文件夹中，定期下载到电脑上。

ChemiCloud 主机最低2.95美金/月, 45天随时退款, LiteSpeed 驱动 – 立即试用

图片[1]-CPanel 特定页面密码访问设置教程 | 歪猫跨境 | WaimaoB2C-歪猫跨境 | WaimaoB2C

Directory Privacy 设置教程

在 cPanel 的 Files 板块点击 Directory Privacy

图片[2]-CPanel 特定页面密码访问设置教程 | 歪猫跨境 | WaimaoB2C-歪猫跨境 | WaimaoB2C

进入页面之后，默认打开的是主机的根目录如下图。

图片[3]-CPanel 特定页面密码访问设置教程 | 歪猫跨境 | WaimaoB2C-歪猫跨境 | WaimaoB2C

点击页面右上角 settings 按钮，弹窗中选择要打开的默认网站目录或文件夹。

图片[4]-CPanel 特定页面密码访问设置教程 | 歪猫跨境 | WaimaoB2C-歪猫跨境 | WaimaoB2C

例如在网站 waimaob2b.com 上添加一个页面，为用户提供产品报价或技术文档的下载服务。

首先在 file manager 中的网站根目录 “public_html” 中创建 “download” 的文件夹，

然后把产品报价或技术文档全部上传到这个文件夹。

我们完成接下来的 Directory Privacy 设置后，用户就可以通过链接 “waimaob2b.com/download” 查看并下载我们上传的产品报价或技术文档。

在 directory privacy 设置页面，找到在 file manager 中创建的“download”的文件夹

点击右侧的“edit”按钮，进入到该文件夹的访问权限设置页面。

图片[5]-CPanel 特定页面密码访问设置教程 | 歪猫跨境 | WaimaoB2C-歪猫跨境 | WaimaoB2C

在下图页面中，勾选

Password protect this directory
Enter a name for the protected directory

文本框留空，直接点击底部的 Save 按钮保存设置。

图片[6]-CPanel 特定页面密码访问设置教程 | 歪猫跨境 | WaimaoB2C-歪猫跨境 | WaimaoB2C

页面刷新并且提示 success 表示我们已经完成设置。点击页面底部的 Go Back 回到之前的页面。

图片[7]-CPanel 特定页面密码访问设置教程 | 歪猫跨境 | WaimaoB2C-歪猫跨境 | WaimaoB2C

在原来页面的下方会出现 Create User 选项。

接下来需要将所有有权限查看 download 页面内容的用户，通过 Create User 添加到系统中。

系统目前不支持批量添加用户，所以只能一个一个手动添加。

图片[8]-CPanel 特定页面密码访问设置教程 | 歪猫跨境 | WaimaoB2C-歪猫跨境 | WaimaoB2C

添加成功的用户信息会显示在 Authorized Users 列表中，也就是说在这个列表中的所有用户都可以使用用户名和密码访问我们的 “Download” 页面。

如果要取消某个用户的访问权限，直接在 Authorized Users 列表中选中这个用户然后点击“Delete User” 完成设置，该用户就无法再使用他的用户名和密码访问受保护的页面。

图片[9]-CPanel 特定页面密码访问设置教程 | 歪猫跨境 | WaimaoB2C-歪猫跨境 | WaimaoB2C

完成以上设置之后，我直接访问网站链接 waimaob2b.com/download 时，打开的却是一个403页面。

图片[10]-CPanel 特定页面密码访问设置教程 | 歪猫跨境 | WaimaoB2C-歪猫跨境 | WaimaoB2C

以为是哪里设置错误了，联系 ChemiCloud 客服解决了问题，原因是在 Download 这个页面中只有我上传的文件，没有支持这个链接显示内容的着陆页。

图片[11]-CPanel 特定页面密码访问设置教程 | 歪猫跨境 | WaimaoB2C-歪猫跨境 | WaimaoB2C

客服帮我在 download 文件夹中添加了”.htaccess”文件，文件内容如下

#----------------------------------------------------------------cp:ppd
# Section managed by cPanel: Password Protected Directories     -cp:ppd
# - Do not edit this section of the htaccess file!              -cp:ppd
#----------------------------------------------------------------cp:ppd
AuthType Basic
AuthName "Protected 'public_html/download'" //这里的“public_html/download”修改为你自己的受保护的目录地址
AuthUserFile "/home/waimaobb/.htpasswds/public_html/download/passwd"//这里的“waimaobb”和“public_html/download”修改为你自己的信息
Require valid-user
#----------------------------------------------------------------cp:ppd
# End section managed by cPanel: Password Protected Directories -cp:ppd
#----------------------------------------------------------------cp:ppd

Options +Indexes

或者你也可以直接联系 Chemicloud 帮你添加下面的文件。

再次打开链接 waimaob2b.com/download 时，会有一个登录弹窗，

要我们输入用户名和密码之后才能访问页面的具体内容。

图片[12]-CPanel 特定页面密码访问设置教程 | 歪猫跨境 | WaimaoB2C-歪猫跨境 | WaimaoB2C

输入用户名和密码，点击登录，就可以正常的访问页面，并且下载里面的文件。

图片[13]-CPanel 特定页面密码访问设置教程 | 歪猫跨境 | WaimaoB2C-歪猫跨境 | WaimaoB2C

如果觉得这个页面不够美观，我们可以直接在 Download 文件夹中使用 wordpress 新建一个下载站，或者更简单一些的，我们可以直接让 ChatGPT 帮我们写一个简单的下载页面的 HTML 源码。

以下是我给 ChatGPT 的提示词:

我在网站 waimaob2b.com/download 这个文件夹中上传了几十个 Excel，PDF 文件供用户下载，未来有可能增加更多的文件，请帮我生成一个精美的文件下载页面。

页面要求：

页面语言为英文

包含网站的 Logo

Logo下方页面标题显示为“歪猫跨境资源下载” 。标题下方有50字左右的页面描述内容，包括联系信息

包含页面背景图片

文件以列表的形式呈现; 整个文件下载列表区域用圆角边框框起来，背景颜色为80%透明度的白色，且边框带有轻微的阴影效果，以增强视觉层次感。

每行显示一个文件的下载信息，包括：文件名称，文件大小，上传日期，下载按钮。

文件列表中，每行内容以细横线分隔

每页最多显示15个文件下载信息，超过15个分页显示，用户可以点击“下一页”或“上一页”浏览。

下载按钮背景颜色为黑色，文字显示 “Download”，鼠标悬停在下载按钮上时，可以使用轻微的颜色变化或动画效果，增强互动感。

确保页面在不同设备上都能良好显示，包括桌面端和移动端。

以下是 ChatGPT 提供的 HTML 代码，ChatGPT 还提供了详细的代码使用教程，这里不贴了，按照教程制作好页面的 Logo 和背景图片，上传到 “download” 文件夹中。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Waimao B2B Resource Download</title>
    <style>
        body {
            font-family: Arial, sans-serif;
            background-image: url('background.jpg');
            background-size: cover;
            background-position: center;
            background-repeat: no-repeat;
            color: #333;
            margin: 0;
            padding: 20px;
        }
        .header {
            text-align: center;
            margin-bottom: 40px;
        }
        .header img {
            max-width: 150px;
        }
        .header h1 {
            font-size: 2em;
            margin: 10px 0;
        }
        .header p {
            font-size: 1em;
            margin: 10px 0;
        }
        .file-list {
            max-width: 800px;
            margin: 0 auto;
            background: rgba(255, 255, 255, 0.8);
            padding: 20px;
            border-radius: 15px;
            box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
        }
        .file-item {
            display: flex;
            justify-content: space-between;
            padding: 10px 0;
            border-bottom: 1px solid #ccc;
        }
        .file-item:last-child {
            border-bottom: none;
        }
        .file-name {
            flex: 2;
        }
        .file-size, .upload-date {
            flex: 1;
            text-align: center;
        }
        .download-button {
            flex: 1;
            text-align: right;
        }
        .download-button a {
            background-color: black;
            color: white;
            padding: 10px 20px;
            text-decoration: none;
            border-radius: 5px;
            transition: background-color 0.3s ease;
        }
        .download-button a:hover {
            background-color: #444;
        }
        .pagination {
            text-align: center;
            margin-top: 20px;
        }
        .pagination a {
            text-decoration: none;
            padding: 10px;
            color: black;
        }
        .pagination .current {
            font-weight: bold;
            text-decoration: underline;
        }
    </style>
</head>
<body>
    <div class="header">
        <img src="logo.png" alt="Waimao B2B Logo">
        <h1>Waimao B2B Resource Download</h1>
        <p>Welcome to the Waimao B2B Resource Download page! Here you'll find a variety of useful files available for download to support your cross-border business needs. For any inquiries, please contact us at <a href="mailto:your-email@example.com">your-email@example.com</a>.</p>
    </div>
    <div class="file-list">
        <!-- Repeat this block for each file -->
        <div class="file-item">
            <div class="file-name">File Name.pdf</div>
            <div class="file-size">2.3 MB</div>
            <div class="upload-date">08/29/2024</div>
            <div class="download-button"><a href="file-path.pdf">Download</a></div>
        </div>
        <!-- End file block -->
    </div>
    <div class="pagination">
        <a href="#" class="previous">« Previous</a>
        <span class="current">1</span>
        <a href="#" class="next">Next »</a>
    </div>
</body>
</html>

使用 file manager 打开 download 文件夹，在文件夹中新建文件 “index.html”, 然后再 “Edit” 编辑这个文件，将上面 ChatGPT 提供的代码粘贴到 index 文件中，并且根据教程修改代码中关于下载文件的名称，链接地址，等等信息。完成修改保存设置，关闭编辑窗口。