When using AnQi CMS for website content management, we often get the details of documents through/api/archive/detailthe interface. Among them,data.contentThe field carries the core content of the article. Many developers or operators who are new to it are curious about whether the field returns plain text or formatted rich text?Can it directly include images or videos and other multimedia content?
the content of HTML documents
According to the API document description of Anqi CMS and the returned data example, we can clearly see,data.contentthe document content returned by the field isa string in HTML formatFor example, in the return example of getting document details,data.data.contenthas a value of"<p>欢迎使用AnqiCMS</p>"This clearly indicates that the content has been<p>Enclosed in tags, this is a standard HTML paragraph tag. In addition, in the interface for publishing documents,/anqiapi-archive/220.htmlthe request data example also includes,contentthe field is also structured in HTML"<p>欢迎使用anqicms</p>"This further confirms that the content is stored and transmitted in HTML format.
This design concept endows the content with great flexibility, allowing rich text content edited through the Anqi CMS backend editor, such as bold, italic, lists, paragraph styles, hyperlinks, etc., to be fully transmitted through this field.This means you do not need to perform complex text parsing on the front-end to restore the format, you can directly render this HTML string as web content, which greatly simplifies front-end development work.
Embedding rich media content
As for images or other rich media content, the answer is also affirmative, they can be included indata.contentThe field returns the HTML. When you edit articles in the Anq CMS backend, images, videos, audio, or other embedded content you insert are usually converted to corresponding HTML tags (such as<img>Tags used for images,<video>or<iframe>Tags used for video embedding, and as part of the main content of the article stored in thiscontentWithin the field. This means that after you receive this HTML on the frontend, you can render it directly.The browser will automatically parse and display the rich media elements such as images, videos, etc., without the need to retrieve or concatenate them separately.For example, an article content that includes images, indata.contentit may contain<img src="https://example.com/image.jpg" alt="描述">such tags.
It is worth noting that the documentation of Anqi CMS still existsimages/logoandthumbFields such as these are usually used to store the cover image, thumbnail, or a list of related images, which provide independent image URLs.data.contentThe image in the field is inline with the article body, displayed as part of the article content stream. Although both involve images, they have different functions and uses.
Attention points in practical application
While usingdata.contentWhen dealing with fields, there are some practical suggestions. First of all, since the content is in HTML format, when rendering on the front-end, you need to ensure that your page or component can correctly parse and display HTML tags.In many modern frontend frameworks, this is usually done through specific instructions (such as Vue.js's v-htmlor React'sdangerouslySetInnerHTMLTo implement this. Secondly, for security reasons, especially when a website allows users to post content, it is very important to filter the received HTML appropriately (for example, using XSS cleaning libraries) to prevent potential cross-site scripting attacks.The AnQi CMS itself should have already been secured in the backend, but an additional layer of protection in the frontend is always a good practice.Finally, for images and other media resources, Anqi CMS usually handles their storage paths to ensure they are loaded correctly during rendering, and you will usually receive the complete image URL.
In summary, of Anqi CMS'sdata.contentThe field provides a powerful and flexible content carrier for us.It returns the detailed content of the document in HTML format and can directly carry various rich media information such as images, videos, and so on.This greatly simplifies the front-end content display logic, making the content presentation of the website richer and more vivid.
Frequently Asked Questions (FAQ)
1.data.contentIs the content returned by the field always in HTML format?
Yes, from the design and examples of Anqi CMS's API,data.content(including document, category, and single-page content details) The content returned by the field is always encapsulated in HTML tags. Even if you only enter plain text in the background, the system will wrap it in<p>Tags or basic HTML structures are returned so that the front end can render them uniformly.
2. Ifdata.contentContains images or videos, how can the front end handle them to display correctly?
due todata.contentReturns a complete HTML string, front-end can directly insert this string into the page DOM (for example, using native JavaScript'selement.innerHTML = response.data.contentor in modern front-end frameworks such as Vue.js'sv-htmlor React'sdangerouslySetInnerHTML). The browser will automatically parse and render the contents of it.<img>/<video>Elements such as media, so that rich media content can be displayed correctly.
3.data.contentand imagesarchiveDetailin the interfaceimagesWhat is different about the images provided by the field?
data.contentThe image referred to is an inline image inserted in the article body through a rich text editor, which is an integral part of the article's main content. AndarchiveDetailthe interface inimagesfield (andlogoandthumbUsed to store the cover image of an article, the thumbnail of the article list page, or a set of album images.These images exist independently of the main content of the article, are often used for list display, page layout, or as feature images of the article, rather than appearing directly in the main text flow.