我来帮你搞定这个问题，分两步走：先把单行JSON转成结构化的易读格式，再把里面的URL字段变成可点击链接。

第一步：后端格式化单行JSON #

首先在Java代码里把API返回的单行JSON转成带缩进的结构化格式，推荐用Jackson或者Gson库，这里以Jackson为例：

import com.fasterxml.jackson.databind.ObjectMapper;
import com.fasterxml.jackson.databind.SerializationFeature;

// 假设你已经从API拿到了单行JSON字符串rawJson
ObjectMapper mapper = new ObjectMapper();
// 开启缩进输出，生成结构化JSON
mapper.enable(SerializationFeature.INDENT_OUTPUT);
// 解析JSON为通用对象
Object jsonObj = mapper.readValue(rawJson, Object.class);
// 输出格式化后的JSON字符串
String prettyPrintJson = mapper.writeValueAsString(jsonObj);

// 把格式化后的JSON传到JSP页面，比如存入request属性
request.setAttribute("formattedJson", prettyPrintJson);

如果用Gson的话，代码逻辑类似：

import com.google.gson.Gson;
import com.google.gson.GsonBuilder;

Gson gson = new GsonBuilder().setPrettyPrinting().create();
Object jsonObj = gson.fromJson(rawJson, Object.class);
String prettyPrintJson = gson.toJson(jsonObj);

第二步：前端将URL转为可点击链接 #

在JSP页面里，用JavaScript处理格式化后的JSON，把"url":"xxx"格式的内容替换成可点击链接，同时保留JSON的结构和缩进：

<!-- 用来展示JSON的容器 -->
<div id="json-container" style="padding: 1rem; background-color: #f5f5f5; border-radius: 4px;"></div>

<script>
// 从后端获取格式化后的JSON，用<c:out>避免双引号转义问题
const rawFormattedJson = "<c:out value='${formattedJson}'/>";

// 正则匹配JSON中的url字段值，处理不带http协议的情况
const urlPattern = /"url":"([^"]+)"/g;
const jsonWithLinks = rawFormattedJson.replace(urlPattern, (match, url) => {
    // 给没有协议的URL补全http://，避免跳转成相对路径
    const fullUrl = url.startsWith('http') ? url : `http://${url}`;
    // 返回替换后的HTML链接
    return `"url":"<a href='${fullUrl}' target='_blank' style='color: #0066cc;'>${url}</a>"`;
});

// 用<pre>标签保留缩进和换行，同时渲染HTML链接
document.getElementById('json-container').innerHTML = `<pre>${jsonWithLinks}</pre>`;
</script>

额外优化：JSON语法高亮（可选） #

如果想让JSON看起来更专业，可以用highlight.js做语法高亮，步骤如下：

1. 引入highlight.js的CSS和JS
2. 调整前端代码：

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.7.0/styles/github.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.7.0/highlight.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.7.0/languages/json.min.js"></script>

<div id="json-container" style="padding: 1rem; background-color: #f5f5f5; border-radius: 4px;"></div>

<script>
const rawFormattedJson = "<c:out value='${formattedJson}'/>";
const urlPattern = /"url":"([^"]+)"/g;
let jsonWithLinks = rawFormattedJson.replace(urlPattern, (match, url) => {
    const fullUrl = url.startsWith('http') ? url : `http://${url}`;
    return `"url":"<a href='${fullUrl}' target='_blank' style='color: #0066cc;'>${url}</a>"`;
});

// 创建代码标签并绑定语法高亮类
const preElement = document.createElement('pre');
const codeElement = document.createElement('code');
codeElement.className = 'language-json';
codeElement.innerHTML = jsonWithLinks;
preElement.appendChild(codeElement);
document.getElementById('json-container').appendChild(preElement);

// 执行高亮渲染
hljs.highlightAll();
</script>

注意事项 #

• 如果JSON里的URL包含特殊字符（比如转义后的引号），可以适当调整正则表达式，不过一般API返回的URL都会做转义处理，无需额外担心。
• 传递JSON到JSP时，一定要用<c:out>标签包裹，避免JSON中的双引号破坏JS语法结构。

内容的提问来源于stack exchange，提问作者GopherGopher