Super newbie help: how can I use the API to publish my NocoDB data on a node.js website?

APIs
1

My website is made with Ghost CMS. It’s node.js based. So I guess i must use the Javascript options.

I tried including the snippet code provided in NocoDB. But nothing shows on my website. Looked into the swagger thing. But code sample are only in Curl.

  1. Do I need to put the xcToken too? Where?
  2. Do I need to add more code to call data? How?
  3. Is there a full tutorial on how to handle api request in javascript with nocodb?
<script>
 
const options = {
  method: 'GET',
  headers: {
    'xc-auth': 'eyJhbGciOiJIUzI1NiIsInR5cCICI6ImZiZWF1dmFpc0BnbWFpbC5jb20iLCJmaXJzdG5hbWUiOm51bGwsImxhc3RuYW1lIjpudWxsLCJpZCI6InVzX2JmcWczazhhbnc1aTl5Iiwicm9sZXMiOiJvcmctbGV2ZWwtY3JlYXRvcixzdXBlciIsInRva2VuX3ZlcnNpb24iOiIzZTRmZTVmN2NjY2RmNGEzZTRkNmU0MDcwMTJjNzUyMzExNDhmOTEwYjA2NmViZmQyODc0ODgzNDA5ZmY3MjI1NTUxYzQ4OTBiNjc5ZjY5YiIsImlhdCI6MTY5OTY0MTgyMywiZXhwIjoxNjk5Njc3ODIzfQ.yPaczTsnmR0hqnHmqCPimaZ0JtICdYnyDdzHugqi-NA'
  }
};

fetch('https://nocodb.mynocodbsite.com/api/v1/db/data/noco/p_6xnrc3tumf5odf/Index%20des%20prix/views/Index-des-prix?offset=0&limit=25&where=', options)
  .then(response => response.json())
  .then(response => console.log(response))
  .catch(err => console.error(err));

¸</script>
2

Anyone having a tutorial? A place to start?

3

Hi Hacking47,

Your fetch call is looks good, it should print out the response to developer console (F12 or Inspect in right-click menu and look for Console tab).

An easier way for a beginner would be using embed, you can share any table you want (for reference Share view | NocoDB) and click button near Copy URL to get iframe code which you can directly embed to your page.

If you want to directly fetch and use APIs (as you’re doing now) you can check this or similar tutorials.

1 Like
4

Thanks Mermit
However iframe is really not the way I need to go. Because I need to output only part of the data and style it differently.

Thanks for sharing the tutorial. But I couldnt make it work tough. It’s not enough related to Nocodb. For example, where do I insert my token?

Would you have a more guided/basic tutorial to share? Something with Nocodb more in mind?

5

Here’s what I have so far. I have a Unauthorized access message from the console. But I dont know where to implement the xc-auth token in the code.

// api url
const api_url = 
	"https://nocodb.mydomain.com/api/v1/db/data/v1/Project/MyTablelimit=25&shuffle=0&offset=0";

// Defining async function
async function getapi(url) {

	// Storing response
	const response = await fetch(url);

	// Storing data in form of JSON
	var data = await response.json();
	console.log(data);
	if (response) {
		hideloader();
	}
	show(data);
}
// Calling that async function
getapi(api_url);

// Function to hide the loader
function hideloader() {
	document.getElementById('loading').style.display = 'none';
}
// Function to define innerHTML for HTML table
function show(data) {
	let tab = 
		`<tr>
		<th>Name</th>
		<th>Office</th>
		<th>Position</th>
		<th>Salary</th>
		</tr>`;

	// Loop to access all rows 
	for (let r of data.list) {
		tab += `<tr> 
	<td>${r.name} </td>
	<td>${r.office}</td>
	<td>${r.position}</td> 
	<td>${r.salary}</td>		 
</tr>`;
	}
	// Setting innerHTML as tab variable
	document.getElementById("employees").innerHTML = tab;
}