Complex: having API call within widget

<baris>

Well the request from nodebb doesn't seem to send a proper client_id. The request url looks like this https://api.unsplash.com/photos/random?client_id=$ What is the code you use in the widget?

eeeee

@baris

const key='q_8d...' // redacted key
 fetch(
`https://api.unsplash.com/photos/random?client_id=${key}`
)

<baris>

Try with

const key='q_8d...' // redacted key
 fetch(
'https://api.unsplash.com/photos/random?client_id=' + key
)

The {} is probably getting replaced by benchpressjs because it thinks it is a variable.

eeeee

@baris
It works! Thanks so much!

As a side question, is Benchpress.js really worth Nodebb using?, clearly its irritating if you have to be careful with brackets.

So pleased to get this sorted though!

phenomlab

@eeeee said in Complex: having API call within widget:

clearly its irritating if you have to be careful with brackets.

Not at all. It just means you need to refractor your code to suit the environment you are using. Benchpress is the standard for NodeBB.

Also, as I mentioned on sudonix, another issue is the security implications of allowing remote code to run inside a widget.

Poorly constructed code can easily introduce severe vulnerabilities on the target site which you wouldn’t actually see.

It’s due to that reason that by default you cannot execute arbitrary code in the post editor unless you override that which is at your risk.

eeeee

Update: It was really worth getting to bottom of this as other Widget code I once tried hadn't worked either. It didnt contain an API call, but did have an if statement with { } braces after.
Refactoring that code, (you can have one statement inline if without the braces) , and now that works.
This Benchpress anomoly (if I can call it that) is worth being aware of, as even simpler widgets can be affected by any {} !

Further update: Reading up on Benchpress.js, I realise now that @baris wrote it! So sorry if I put my foot in it by questioning it! I read the documents on escaping the { } to retain the raw meaning of { }
I tried
if(){{ ...}}
if(){ {{ ... }} }
if(){{ { ... } }}
But couldnt find a way to get the code to work
So went back to the inline if with no braces.

<baris>

Actually benchpressjs(was called that templates.js before) was written by @psychobunny first and then rewritten by @PitaJ https://community.nodebb.org/topic/11025/introducing-our-new-templating-engine

eeeee

@phenomlab said in Complex: having API call within widget:

Benchpress is an industry accepted standard which is why it's used in thousands of other projects aside from NodeBB.

@phenomlab is it though? I'm wondering if you were thinking about Bootstrap being an industry standard, because Benchpress isn't used anywhere else than Nodebb from what I can see?

Using { in this template language is an unfortunate choice of symbol IMO.
Historically this template language used some form of < > tags.
The { substitutions conflict with widget js code if you're not careful.

phenomlab

@eeeee said in Complex: having API call within widget:

@phenomlab is it though?

Sorry - I did actually mean Markdown and I've modified the original post.

PitaJ

Benchpress/templates.js has always used a single { to wrap variable substitution.

I agree before is not commonly used, but using { is an industry standard for format strings and templates.

Not sure what documents you read about escaping, it appears I don't actually have that documented. But to escape you should be able to add a single backslash before the opening {:

if (something) \{ stuff() }

But even just putting a semicolon in there should work

if (something) { stuff(); }