MrBobDaisy
MrBobDaisy
NNuxt
Created by MrBobDaisy on 6/28/2024 in #❓・help
Server directory API call will only work with 127.0.0.1
Making an API call to GraphQL only works with a hardcoded IP and port number. CMS is using ddev to run the docker container. If we set the URL to https://[sitedomain].ddev.site/api or http://localhost:[portnumber]/api we cannot connect to the API through the server directory. Making the call client side works without issue. Only error from Nuxt is fetch failed. Below is the server API call using Apollo Client, but useFetch gives the same errors.
import { ApolloClient, InMemoryCache } from '@apollo/client';
// Find a way to dinamically import the query based on the page
import { homeQuery } from '../../queries/HomeQuery';

export default defineEventHandler(async (event) => {

try {
const client = new ApolloClient({
// including hardcoded uri from .env to localhost since Nuxt won't pick up
// https://[sitedomain].ddev.site/api or http://localhost:[portnumber]/api
uri: process.env.GQL_HOST,
cache: new InMemoryCache()
});


const result = await client.query({
query: homeQuery,
});


// Just returning title from now since that's the only field in the carbon boilerplate
const title = result.data.entry.title;

return {
title: title
}

} catch (error) {
// Catch all errrors and return the corresponding error message
console.error('Error fetching data:', error);

return {
error: 'Failed to fetch data',
};
}

})
import { ApolloClient, InMemoryCache } from '@apollo/client';
// Find a way to dinamically import the query based on the page
import { homeQuery } from '../../queries/HomeQuery';

export default defineEventHandler(async (event) => {

try {
const client = new ApolloClient({
// including hardcoded uri from .env to localhost since Nuxt won't pick up
// https://[sitedomain].ddev.site/api or http://localhost:[portnumber]/api
uri: process.env.GQL_HOST,
cache: new InMemoryCache()
});


const result = await client.query({
query: homeQuery,
});


// Just returning title from now since that's the only field in the carbon boilerplate
const title = result.data.entry.title;

return {
title: title
}

} catch (error) {
// Catch all errrors and return the corresponding error message
console.error('Error fetching data:', error);

return {
error: 'Failed to fetch data',
};
}

})
2 replies
NNuxt
Created by MrBobDaisy on 6/7/2024 in #❓・help
File size is zero in server/api call?
When I push my form data over to the the server API, the file size of my upload becomes 0 and there's no longer any data in the file?
2 replies
NNuxt
Created by MrBobDaisy on 5/2/2024 in #❓・help
Use external ApiS in Nuxt?
Not sure I'm 100% understanding how to handle external APIs in Nuxt. I need to store a secret key in the .env file and access it later, and make additional queries based on a search from the user. Currently I have a server/api/jobs.js file that holds the initial query, which works great for the initial render. But I'm trying to search for jobs at a different URL in the API call with a query param, set up as server/api/searchCityJobs.js right now. I was doing this in the component previously for testing purposes, but I obviously don't want to expose the private API key. Does anyone have any insight into this?
13 replies