Adding sensitive ENV variables to a custom vscode extension? - azure

Does anyone have any suggestions on how I can add a secret api key to my vscode extension to allow it to make authorised requests to an external api?
When running locally, I have managed with a .env file and a launch.json config, but once it is published I do not know where to actually store the variable so that it is:
Accessible by the published extension/app
Safely stored
Any help appreciated, thanks
I haven't found any docs for this, but if anyone knows of a guide to add the env var to azure, that would be great.

Related

How do I add environment variables to a AWS Lightsail Node.js instance?

The Problem
I'm dipping my toes into AWS by deploying a simple API built with NestJS. This will be the first app I've deployed to a cloud service. I've already cloned my repository on an AWS Lightsail Linux instance with Node.js and installed all of my dependencies. However, I'm confused on how best to provide environment variables to my app.
Obviously, I has a local .env file that I used during development with credentials for my database, port info, etc. Do I just create a new .env file on the machine running my instance through the command line? I've read that for other AWS services you can provide env variables through that service's UI, but I can't find the same thing for Lightsail.
I would greatly appreciate it if someone could give me an explanation of env variables, and how we should generally provide them to cloud services.
Thank you!
There could be a better method. But, you could add a file locally on the LightSail server itself. If you don't know how to do so through console, I'll explain below.
Create the file: touch .env
Open up the file in console: vim .env.
Now you will see the file opened up in console, with weird UI if you haven't seen it before.
Prepare to write to file: press i.
Now you should see a the ~Insert~ mode appear at the bottom.
Add the variables: copy and paste your .env from your local laptop to your lightsail console.
close out: press esc, then type in :wq, and click on enter
This should work as normal with any .env file. I'm unsure if there are security issues with this, but I don't believe so.

How to Load Azure App Service Application Settings into VUE?

We have a Vue app hosted as an Azure App Service. Under Settings\Configuration in Azure Portal We have added application settings like VUE_APP_API_ENDPOINT_URL. These become environment variables like the documentation explains, and can be verified by opening a console from the portal and type 'env'.
I Had hoped that These env variables would now be accessible inside Vue by use of
process.env.VUE_APP_API_ENDPOINT_URL
My guess is that its only becomes available in VUE when aplication is build with WebPack or similar.
At least it doesn't work.
Are there any nice way to read those env variables created from Azure App Settings into the vue app?
Some people mentions dotenv npm package, but we need to read the env variables not add them from a config file.
You would be correct that the Environment Variables only become available when you build the application. And to elaborate on that, only the Environment Variables that you specify/supply at build time are the ones that become available in the application from the build process as per the documentation here:
https://cli.vuejs.org/guide/mode-and-env.html#environment-variables
Specifically look at this:
Note that only NODE_ENV, BASE_URL, and variables that start with VUE_APP_ will be statically embedded into the client bundle with webpack.DefinePlugin. It is to avoid accidentally exposing a private key on the machine that could have the same name.
I was struggling to accomplish essentially the same thing that you're trying to accomplish. I was trying to get a value from Azure's Application Settings so that I could setup multiple environments for my application and not have to constantly change values depending on the environment I published the app to.
After realizing that you might be onto something and reading the confirmation of such in the documentation, I decided to try putting the Environment Variable that I was trying to get from Azure's Application Settings in a .env file with a default so that it would be specified at build time. I then published my app to Azure and tested it and it worked!
Try creating a .env file with all of the Azure Application Settings that you're trying to set with default values or something, like:
VUE_APP_API_ENDPOINT_URL=default_value
And then set those same variables into your Azure Application Settings with the proper values and it should work.
Zoull's comment, while somewhat factual, is not possible. His comment implies that setting VUE_APP_API_ENDPOINT in Azure's Static App Settings blade will seamlessly include that var, and perhaps other VUE_APP_* vars into the vue app.
This is wrong.
Webpack is responsible for inclusion of VUE_APP_* vars into the build, and this is only possible at build-time.
This can be verified by following his logic, and then dumping to console "env" at runtime. Values will be set to, permanently, whatever they were at build-time.
tl;dr: Vue will never read, post-build, vars from Application Settings.
I use Github actions to build and deploy. By adding an env: setting after the with: stanza, and including VUE_APP_* vars there, I can do what OP is trying to do.
I believe I can also set some github "secrets" in githubs settings for my repo, and also include them dynamically in the YAML.
Ex. If I have a github secret key/val of: "VUE_APP_FOO: true", in my github action yml, I can do:
env:
VUE_APP_FOO: ${{secrets.VUE_APP_FOO}}
Then, in my final vue build, I should have a value of "true" when I read the process.env.VUE_APP_FOO var.
Savvy?

Azure Service Editor config changes are not applicated

I have a problem with my QnA Bot App. I made some changes to basic responses (No answer found, Hello and Goodbye) in Azure Service Editor. I have also changed a default HTML webpage. Changes made in a HTML website were made instantly, but the config files with new welcome responses were not.
I am sure that I once watched a tutorial that provided information that after you change some stuff in configs files you need to commit them using Kudo Console. I tried restarting the app but it did not work.
I am beginner. Does anyone remember what is the command?
I tried searching through my whole browser history but I still cannot find it.
I used command deploy and it worked.

How could I prohibit anonymous access to my NodeRed UI Dashboard on IBM Cloud(Bluemix)?

I'm working with node-red, on boilerplate IBM cloud. I know that there is a way, changing the value of enviroments variables(NODE_RED_USERNAME and NODE_RED_PASSWORD), to change username and password of the editor flow. But, what about UI dashboard? I mean using dashboard nodes. Forbid access to
https://noderedservicename.mybluemix.net/ui/
I know that on the code, changing the variable httpNodeAuth on the file settings.js I can do what I want. What is the way for doing that on IBM Cloud?
Thank you in advance!
You need to add the httpNodeAuth (not the httpAdminAuth as this is for controlling access to the Node-RED editor and can done with the environment variables discussed in the other answer.) to the app/bluemix-settings.js file.
Something like this:
...
httpStatic: path.join(__dirname,"public"),
httpNodeAuth: {user:"user",pass:"$2a$08$zZWtXTja0fB1pzD4sHCMyOCMYz2Z6dNbM6tl8sJogENOMcxWV9DN."},
functionGlobalContext: { },
...
Details of how to generate the pass can be found here
There are a number of ways you can edit the file, some of which include linking the Node-RED deployment to a git repository or downloading the whole app, editing the file and pushing it back to Bluemix (when you first deploy Node-RED from the starter pack it gives you instructions on how to download the source to make changes and then push them back. You can get to these instructions by clicking on the "Getting started" link in your Node-RED Bluemix console page).
But the quickest/simplest/dirtiest way is probably to just SSH into the instance and change the file with something like vi. Details on how to ssh to an app instance can be found here. But the following should work:
cf ssh [app name]
Once you have edited the file you will need to tell bluemix to restart the app. You can do this from the web console or with the cf command line tool.
(The changes made by this method will not survive if the app is restaged, or bluemix decides to move your instance to another machine internally because it will rebuild the app from the pushed sources. The permanent solution is to download the source, edit and push back)
This link will help you but it's written in Japanese.
http://dotnsf.blog.jp/archives/1030376575.html
Summary
You can define the "user-defined" environment variables through the IBM Cloud dashboard.
It contains the variables to protect Node-RED GUI.
You have to be set as follows
NODE_RED_USERNAME : username
NODE_RED_PASSWORD : password

Style (.css) missing when added Azure Cloud Project

I'm in my way to convert an existing web site to Azure Cloud Service Project, but when I add this cloud project and debug my the project, the web page is missing all the styling, i.e. all the tabs in one page. I have seen that doesn't take the .css
Someone could tell me what's happening here?
Thanks!
Verify the *.css files, you need to make sure that the Build Action is set to Content:
You can try changing the properties of the cloud project -> Web -> use IIS Web Server..
worked for me
I had the same problem and I found it came from my use of IIS Express.
The problem was an error that can be seen in Windows Application Logs:
Src: IIS Express
"The directory specified for caching compressed content [...] is invalid. Static compression is being disabled."
fist I don't know if I have to write this as answer, if not sorry, I'll correct it.
About my question, I tough in publish it to Azure and when i did it, was working correctly. What I still don't know is why when I debug in VS with the cloud project is missing style and images.

Resources