How to pass Laravel editable settings to Vue

Question

I have some settings in my app that can by changed by admin (like categories of products that every user can choose from when creating new product). I'm storing them in database 'settings' table that consists of 'name' and 'value' columns.

I also added a Service Provider that adds those settings to config and caches them. I can access them from Laravel easily, but not from frontend (using Vue).

Is there any way to access Laravel config values from Vue? I've tried this answer but with no success. Should I make request for settings with every API call?

Answer 1

If your setting is dynamic you must request them each time on a API call.

If not you can get those setting once when you deploy your fronted code.

Answer 2

I don't know if I'm understanding your question correctly but...

Laravel configurations are part of the backend. The only way to access them on the frontend is by passing them to it.

Unless there's some fancy trickery I'm not aware of, a Vue.js app, which loads and runs on the client-side, wouldn't have access to your server-side configurations -- unless there's something that say drags them in during compilation that I don't know about, which would strike me as risky at best.

But generally speaking, client-side headless app can't access server-side data unless the server says "here client, have this data."

E.g.

class MyApiController extends Controller
{
    function getThisConfig()
    {
          return config('this');
    }
}

With:

Route::get('/api/config/this', ['uses' => 'MyApiController@getThisConfig']);

And then your Vue.js app sends an AJAX request to /api/config/this.