I want to know how to return an HTML interface through a webhook?

Questions
1

I want to know how to return an HTML interface through a webhook. I want to use the n8n webhook node and HTML node to access the pages of several remaining apps. Is this possible?

QQ_1732719504665
QQ_1732719504665707×280 11.3 KB

2

I cannot share my workflow here by pasting it。

3

QQ_1732720170298
QQ_1732720170298835×470 20.1 KB

4

I also want to use the vue.js framework to render this HTML. I’m not sure if this is possible. Is there any expert who can help me answer this question? Thank you very much.

5

Yeah that works, but by default the response will be JSON. You can change that to ‘text’ and return HTML:

image
image2670×918 190 KB

6

Thank you very much, but I have encountered another problem. I referenced Vue and element ui as the basic HTML framework.
But it’s not optimistic. I saw a prompt saying ‘Type ctrl+space for completion. Use {{}} for expressions andtags for CSS. JS intags are included but not executed in n8n.’ Does this mean that vue.js cannot run here?

7

Hey @jiangzai,

As vue typically needs to be complied you would need to return each of your built files as webhooks, Making simple web interfaces with plain html / javascript is possible and you can include things like jQuery or bootstrap if needed but I wouldn’t try or recommend returning a full web app.

Are you able to share a bit more about what you are actually trying to do?

8

tysm, it helped me a lot

9

YOUR GOAL :-

you have a Webhook → HTML Node and you want the webhook URL to show an html web page

instead of plain json .

SOLUTION:-

  • CREATE WEBHOOK NODE
  • METHOD : GET
  • RESPONSE NODE AS LAST NODE AND MENTION THE WEBHOOK NODE AS REPLY IN “RESPONCE NODE TYPE” also MENTION “WAIT UNTIL LAST NODE RUN”
  • THEN SET YOUR HTML NODE AND DRAG THE OUTPUT TO RESPONCE NODE .!!!.
  • FINISH YOUR WORKFLOW IS READY :hugs: