2

I'm building a vue app (using vue cli) with no server side rendering.

However the app needs some configuration that cannot be hard-coded or generated at build time, the same build being deployed on many different environnement (QA, preprod, prod, etc.)

I'm trying to find the better way to access configuration.

I'm seeking for advice / ideas on how to achieve this.

Exemple of configuration data

  • The url to the backend api
  • Configuration for authentification

Considerations

  • The app will be deployed on an Azure app service. Client and server parts have to be served from the same host.
  • It should be possible to change configuration via Azure Portal (appSettings). This is how it works with almost every application we make, and we want our operation team to work the same way for each application.
  • We usually write server-side code in C#. This is what our developpers know best, but I'm open to another solution.
  • We would also use the server part to genereate CSP header
  • The settings endpoint must be accessible from a known route under the same host, so I can request it without the need of any parameter, e.g. GET /settings.json

Ideas I got so far

Having a node.js server along the client code in the solution.

Pros :

  • All is in the same solution, one build, one deploy.

Cons :

  • I'm not sure how to make the limitation clear and clean between the vue app (client side) and the server app.
  • Not sure how to instruct webpack about this.

C# web app for serving configuration. I could bundle the client app under this website and deploy it.

Pros :

  • Server side code and cliend-side code are clearly segregated
  • We can the tech we now best for server side (C# in this case)

Cons :

  • Merging two project at build time seems kind of weird (although it is possible, I tried it)
Improve this question
0

1 Answer 1

Reset to default
2

You can access configuration by rest api.

It has nothing to do with the server you use in any language, you can choose whatever you want.

Step 1. Create Application settings on portal.

enter image description here

Step 2. List Application Settings.

enter image description here

Step 3. You just need to get key from properties by javascript code.

Improve this answer
Sign up to request clarification or add additional context in comments.

4 Comments

Interesting, but I'd still have to configure parameters (subscriptionId, resourceGroupName) so I can make this call, and I can't hard-code these or determine at build time. The settings should be accessible at a known route under the same host as the website itself. I thought I put this in considerations section, I'll add it.
@Johnny5 What I give you is just an idea. You can also code a webapi interface, set up HttpClient on the server side, and send http requests, you can also get the configuration in web app.
@Johnny5 Using the rest api method must be the best method or application settings, which can be flexibly configured and can obtain the application settings of different applications.
@Johnny5 I read your post carefully. You should have two questions. I suggest you ask them separately. In addition, it is recommended that your project is to separate the front and back ends. If resources are limited, you can use virtual applications under windows.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.