Wasp-lang•3d ago

Import JSON in env.server ?

I’m losing it, I’m trying so many methods to import my Google vertex service account credentials which are in JSON format. Anyone know howwww

6 Replies

kapa.ai•3d ago

Hi @Zuck. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave: ---------------------- Based on the information provided in the knowledge sources, importing JSON files directly in Wasp projects, including in the server environment, is not straightforward. Here's what we know: 1. Wasp doesn't currently support importing JSON files directly as mentioned in this Discord thread (https://discord.com/channels/686873244791210014/1218225782183170158). 2. The recommended workaround is to parse the JSON or convert it to a regular JavaScript object and then import that as suggested in the same Discord thread (https://discord.com/channels/686873244791210014/1218225782183170158). 3. For handling sensitive information like service account credentials, it's generally recommended to use environment variables, especially on the server side as explained in the Wasp docs on env vars (https://wasp-lang.dev/docs/project/env-vars#server-env-vars). Given your specific case with Google Vertex service account credentials, here's a suggested approach: 1. Instead of trying to import the JSON file directly, consider extracting the necessary information from your service account JSON and storing it as individual environment variables in your .env.server file. 2. You can then access these variables in your server-side code using process.env. For example, your .env.server file might look something like this:

GOOGLE_PROJECT_ID=your-project-id
GOOGLE_PRIVATE_KEY=your-private-key
GOOGLE_CLIENT_EMAIL=your-client-email

GOOGLE_PROJECT_ID=your-project-id
GOOGLE_PRIVATE_KEY=your-private-key
GOOGLE_CLIENT_EMAIL=your-client-email

Then in your server-side code, you can access these variables like this:

const projectId = process.env.GOOGLE_PROJECT_ID;
const privateKey = process.env.GOOGLE_PRIVATE_KEY;
const clientEmail = process.env.GOOGLE_CLIENT_EMAIL;

const projectId = process.env.GOOGLE_PROJECT_ID;
const privateKey = process.env.GOOGLE_PRIVATE_KEY;
const clientEmail = process.env.GOOGLE_CLIENT_EMAIL;

This approach is more secure and aligns better with Wasp's current capabilities and best practices for handling sensitive information. If you absolutely need to work with the full JSON structure, you might need to consider alternative approaches, such as reading the file using Node.js file system operations within a server setup function. However, this is not ideal and might require additional configuration. For a more definitive solution, you might want to follow or contribute to this GitHub issue (https://github.com/wasp-lang/wasp/issues/1564) which discusses improving support for importing JSON files in Wasp. ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ---------------------- Sorry @Zuck, I seem to be having a bit of trouble. Don't worry though, I've pinged my support and they will try to fix me up! :technologist: Perhaps try again in 15mins?

ZuckOP•3d ago

But I gotta read it as a JSON @kapa.ai but I have to read it as json

kapa.ai•3d ago

Let me check the knowledge base for you again. One moment! :books: ---------------------- I understand you need to read the file as JSON. Unfortunately, Wasp doesn't currently have built-in support for directly importing JSON files. However, there are a couple of workarounds you can try: 1. Parse the JSON file manually: You can read the file contents as a string and then parse it using JSON.parse(). Here's an example of how you might do this:

   import fs from 'fs';
   import path from 'path';

   const rawData = fs.readFileSync(path.resolve(__dirname, 'your-credentials.json'), 'utf8');
   const credentials = JSON.parse(rawData);

   import fs from 'fs';
   import path from 'path';

   const rawData = fs.readFileSync(path.resolve(__dirname, 'your-credentials.json'), 'utf8');
   const credentials = JSON.parse(rawData);

You'll need to place this code in a server-side file where you have access to the Node.js fs module. 2. Convert JSON to a JavaScript object: Another approach is to convert your JSON file to a regular JavaScript object and import that instead. You can create a new file, let's say credentials.js, with the following content:

   export default {
     // Your JSON content as a JavaScript object
   };

   export default {
     // Your JSON content as a JavaScript object
   };

Then you can import it in your server code:

   import credentials from './credentials.js';

   import credentials from './credentials.js';

Both of these approaches are mentioned as workarounds in the Discord support thread (https://discord.com/channels/686873244791210014/1218225782183170158). Keep in mind that handling sensitive information like service account credentials in files can pose security risks. It's generally recommended to use environment variables for such data, especially in production environments. If you need more robust support for JSON imports, you might want to follow or contribute to the GitHub issue discussing this feature (https://github.com/wasp-lang/wasp/issues/1564). ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ---------------------- Sorry @Zuck, I seem to be having a bit of trouble. Don't worry though, I've pinged my support and they will try to fix me up! :technologist: Perhaps try again in 15mins?

ZuckOP•3d ago

The above was indeed the FIX ^ thanks Kapa!

miho•3d ago

Does it work both in dev and prod? I've heard people using base64 encoded strings in the env vars to encode JSON secrets

martinsos•3d ago

@Zuck the solution above that kappa suggested is a bit yucky though. Ok, file is on the server, so nobody should be able to access it, but it is also likely in your version control (git) I guess, and while also nobody should be able to access that if it is private repo, it is not great, any of these. Ideally you would keep secrets like these separate from your code, and usually the best option is to provide them via ENV vars, which also allows easily switcihng between dev and prod envs and similar. So yeah, ideally you would save it into ENV vars. If JSON is sometihng like { apiKey: "foo", secret: "bar" }, then you can just create two env vars, one called googleVertexApiKey="foo", another googleVertexSecret="bar", import them both in the server, and construct JSON object on your own easily from those. Or, you can try to have just one single env var wihch is actually a whole JSON object seralized to string, but y eah that can be tricky because it can be a problem for .env file reading logic to read that, so one solution in that case is to encode it as base64 string, put that in env var, and then in your server code you get the env var, decode it from base64, parse it as JSON, and there you go, you have your JSON object. I don't know why google loves so much giving people these JSON files, I have seen people arelady being confused by this and tryign to put those files in sensitive locations which is not great. @Zuck I assumed here that stuff in this file is secret, maybe I am wrogn though?

Gaming

Programming

Import JSON in env.server ?