Server Action Library and data on the page

About the Server Actions library and data transfer.

Create a Server Action in the library and create a table (or create a variable).

Create a Server Action and call the library Server Action from there. If you don’t assign a name, the data won’t be transferred. If a name is assigned in the exec, the data will be visible in the branch with that name.

Now I call the library Server Action in Globals. And I assign the name “seoo”.

Next, when configuring the SEO tags in main.ejs, I will see “seoo” simply as a variable, but I will also see what is created in the library Server Action. I have highlighted this in red.

However, the data does not appear in the tag this way. Neither using the path global_seo_query.description nor using the path seoo.global_seo_query.description. It turns out that data created in library Server Actions is not accessible on the website page.

If I move the data from the library Server Action to Globals, everything works.

Sorry, i've re-read your post 3 times, but i don't understand what exactly are you doing and what are you trying to achieve.

I’m creating SEO tags on the page. Previously, I retrieved a table from the database for this purpose. This was done in globals.json. In the SEO tags on the page, I specified the path to this data as global_seo_query.description, etc. Everything worked fine.

Now I tried moving the database query to the Server Actions library and calling this server action in globals.json. And now the data isn’t available on the page.

global:

Server action in library (new approach):

Maybe it's better to check the docs about library actions: Creating Reusable Actions with Server Connect Library

Exec only outputs data, while Include allows you to pick data from within the action. Please check the article above, it explains how and when to use both.

1 Like

Thank you very much. I didn't know about “include”.

However, in your example, when using “exec”, the data is displayed in the “exec” section when the API is called in the browser. In other words, the data is transmitted to the parent server action. But there's no way to access it on the page, right?

Not quite sure what you mean here? Any data outputted in the server action when running it in the browser is available to be used on any page.

Here's a library action with some steps inside:

Here's a server action using this library action as exec:

And here's the data bindings dialog on the page, where the server action is used, you can see all the data outputted by the exec is available:

I did server action in library:

I execute it in Globals:

I try to use data in description tag:

i did not see variable defined in library server action:

But i see “exec_name” what i used when calling exec….

IF i use “include” when calling library server action i can see variable from that sc:

This is what was my problem. Now I can use “include”, but as i understand “exec“ should transfer data too….

To use the server side bindings you need to select a server action on the page.
Please check the docs: Sever Side Rendering with NodeJS | Wappler Docs

1 Like

Thanks for the link. It doesn't answer my question, but since using “include” instead of “exec” solves my problem for now, let's leave it at that.

However, the link discusses a topic that’s relevant to me. Is it possible to create custom meta tags? I need meta tags that point to the website’s versions in different languages in the following format:

link rel="alternate" hreflang="website.com/de/"
link rel="alternate" hreflang="website.com/en/"

Is this possible? So far, I’ve managed to generate this on the client side, but in that case, these tags aren’t in the head section and are useless.

So what exactly did you do? Why are these tags not in the head?

I do this:

<link rel="alternate" hreflang="" dmx-bind:hreflang=“code” dmx-bind:href="‘https://’ + browser.location.host + ‘/’ + code + browser.location.pathname.replace(/^\\/ \[^\\/\]+/, ‘’)“ dmx-repeat:repeat1=”conn_langs.data.langs">

I'm adding this to the layout page. If it's placed in the header section, everything works and the tags appear. However, if I move it to the head section (where it's supposed to be), it no longer works.

is it possible to create custom meta tag with dynamic data? Like ‘description‘ or ‘canonical‘?

Yes, of course it's possible.
All you need to do is make sure the app root is set to page, not to body, so this way the dynamic data in the head tags is rendered:

Any attribute can become dynamic by adding dmx-bind: in front of it. Example:
dmx-bind:id
dmx-bind:content
dmx-bind:href

etc.

Thank you so much for your help!!!

Both of my issues have been resolved.

Changing the App Root to Page and adding this code:

<link rel="alternate" hreflang="/" dmx-bind:hreflang="{{'https://' + browser.location.host + '/' + code + browser.location.pathname.replace(/^\\/\[^\\/\]+/, '')}}" dmx-repeat:repeat1="conn_langs.data.langs">

solved the problem with the SEO tag for different languages.

:star_struck: :star_struck: :star_struck:

1 Like

Best practice is to render your SEO server side otherwise you will see unrendered expressions appear in search results snippets. Then specify the server side data Action in the Layout page and select your meta values from it.

Otherwise you could end up with (displaying in Google etc):

"{{title}} offer various services..."

Please see my reply: SEO tags for different languages - #4 by Teodor

Anyway you can also use server side rendering for meta tags:
https://docs.wappler.io/t/sever-side-rendering-with-nodejs/21650/

2 Likes

Finally i uderstand how it should be: