403 从公共/图像文件夹 laravel vuejs xampp 加载图像时禁止

Question

在我的个人资料中，图像完美显示，但我在控制台中收到以下错误。如果我尝试从公用文件夹访问图像，它不会向我显示错误，但如果我尝试从作为子文件夹的图像文件夹访问它，则会显示错误。自从我搜索 4 天以来，任何人都可以帮助我解决这个问题解决方案，但我没有找到任何解决方案，但他会那么好。

禁止访问！您无权访问请求的 目录。没有索引文档或目录是 读保护。

如果您认为这是服务器错误，请联系网站管理员。

错误 403 admin-cms.me Apache/2.4.39 (Win64) OpenSSL/1.0.2s PHP/7.1.31

我的 API 代码是：

Route::get('profile','API\UserController@profile');

我的控制器代码是：

 public function profile()
    {
        //
        return auth('api')->user();
    }

我的数据和方法代码是：

  data() {
    return {
      users: {},
      form: new Form({
        id: "",
        name: "",
        email: "",
        password: "",
        type: "",
        bio: "",
        photo: ""
      })
    };
  },

methods: {
    getProfilePhoto() {
      return "image/" + this.form.photo;
    }

我在 profile.vue 中的 HTML 代码是：

<div class="widget-user-image">
            <img class="img-circle" :src="getProfilePhoto()" alt="User Avatar" />
          </div>

Answer 1

您确定this.form.photo 在调用getProfilePhoto() 时有一个值吗？

错误信息：

没有索引文档或目录被读保护

让我觉得getProfilePhoto() 正在返回'image/' + ''，这导致图像目录试图被索引。

一种选择是仅在this.form.photo 具有值时显示个人资料照片，使用v-if：

<div class="widget-user-image">
    <img class="img-circle" v-if="form.photo" :src="getProfilePhoto()" alt="User Avatar" />
</div>

Answer 2

可能是权限问题，您是否有权访问您的公共目录，如果可以，您可以检查您的权限吗？即：

ls -li public

现在检查 www-data 或 nginx 是否对您的 image 文件夹具有允许读取权限。