uni-app unicloud设置referer白名单无效

发布于 1周前 作者 caililin 来自 Uni-App

uni-app unicloud设置referer白名单无效

操作步骤：

见描述和附件

预期结果：

referer白名单生效，且支持二级路径，返回404不应收取流量费。

实际结果：

referer白名单不生效，且不支持二级路径，返回404也收取流量费。

bug描述：

几个问题：

  1. 前端网页托管中，referer白名单无效，具体为：

    1. 设置了只能白名单内访问资源（非缓存原因，已配置10多天），且有多次在前端网页托管->参数配置中刷新缓存，但是依然每天都有非白名单内的域名能访问资源，如附件图所示。
    2. referer白名单域名不支持设置二级路径，比如servicewechat.com/appId，这里的appId很重要，如果能带上，则能限制只允许自己的小程序访问资源，见附件图。

  2. “前端网页托管”中，删除了对应的文件，且有多次在前端网页托管->参数配置中刷新缓存，过去了10多天，依然有对应的URL被大量访问，消耗流量的记录，如果因为被删除，还被访问返回404，这种情况下，不应收取流量费，否则可以无限恶意请求www.baidu.com/xxx, www.baidu.com/yyy等随意捏造地址，岂不是无限消耗cdn流量？

图片1 图片2


Harmonyos Next教程
2 回复

防盗链是限制非法来源访问资源内容，无权限访问或访问的文件地址不存在时http会响应403、404状态码，这也会消耗一定流量，只要有请求就会产生流量
防盗链配置的是域名，不支持非域名格式

阿里云服务空间的前端网页托管底层是OSS+CDN，配置逻辑及计费策略与该产品一致。


在处理uni-app和uniCloud设置referer白名单无效的问题时，首先需要确保你正确配置了referer白名单，并且了解uniCloud的访问控制机制。以下是一个可能的代码案例和配置步骤，帮助你检查和修正问题。

1. 配置uniCloud的referer白名单

在uniCloud的后台管理系统中，找到你的云函数或云数据库的安全设置部分，通常会有一个“Referer白名单”的配置项。你需要在这里添加允许访问的referer域名。

例如，如果你的应用部署在https://example.com，你应该在referer白名单中添加https://example.com。

2. 检查uni-app前端代码

确保你的uni-app在发起请求时，设置了正确的referer。通常，浏览器会自动设置referer，但如果你使用了自定义的请求库（如axios），可能需要手动设置。

以下是一个使用axios设置referer的示例：

import axios from 'axios';

axios.defaults.headers.common['Referer'] = 'https://example.com';

axios.get('https://your-unicloud-endpoint.com/api/your-function')
  .then(response => {
    console.log(response.data);
  })
  .catch(error => {
    console.error('Error fetching data:', error);
  });

3. 验证配置

在配置了referer白名单并更新了前端代码后，你需要验证配置是否生效。可以通过以下步骤进行验证：

  • 使用浏览器的开发者工具（通常按F12打开），查看网络请求的headers，确保referer字段被正确设置。
  • 尝试从不在白名单中的域名发起请求，应该会被拒绝。
  • 尝试从白名单中的域名发起请求，应该能够成功。

4. 调试和日志

如果仍然遇到问题，检查uniCloud的日志系统，看是否有关于referer验证失败的详细错误信息。这可以帮助你进一步定位问题。

5. 代码示例整合

以下是一个完整的uni-app页面示例，它使用了axios并设置了referer：

<template>
  <view>
    <text>{{ data }}</text>
  </view>
</template>

<script>
import axios from 'axios';

export default {
  data() {
    return {
      data: ''
    };
  },
  mounted() {
    axios.defaults.headers.common['Referer'] = 'https://example.com';
    axios.get('https://your-unicloud-endpoint.com/api/your-function')
      .then(response => {
        this.data = response.data;
      })
      .catch(error => {
        console.error('Error fetching data:', error);
      });
  }
};
</script>

确保所有配置正确无误，并且前端和后端代码都按照预期工作，通常可以解决referer白名单设置无效的问题。

回到顶部