如何在Velo by Wix中通过后端修改页面文本内容

可行性说明 #

该操作完全可实现，且刚好匹配你避免前端直接接触敏感接口、敏感数据的需求。整套逻辑所有敏感数据的查询、处理都在后端完成，前端仅能拿到最终可直接展示的文本内容，不会泄露任何敏感信息。

具体实现步骤 #

1. 创建后端Web模块 #

首先在Velo编辑器的「后端」面板新建.jsw后缀的Web模块文件，例如命名为userSecret.jsw。这类后端文件中的函数仅允许你站点的前端代码调用，Velo会自动做请求来源校验，不会对外暴露原始接口路径。
后端示例代码如下：

// backend/userSecret.jsw
import { currentUser } from 'wix-members-backend';
import { Permissions, webMethod } from 'wix-web-module';
// 配置仅已登录用户可调用该方法
export const getProcessedDisplayText = webMethod(Permissions.LoggedIn, async () => {
  const loginUserId = currentUser.id;
  // 此处写你敏感数据的查询、处理逻辑，例如从私有数据库拉取对应用户的保密信息
  // 示例：const userSensitiveData = await wixData.query("UserPrivateInfo").eq("_owner", loginUserId).find().then(res => res.items[0]);
  // 所有敏感计算、脱敏逻辑全部在后端完成，仅返回最终要展示的文本即可
  const finalDisplayText = `您的本月专属额度为：${userSensitiveData.quota}元`;
  return { finalDisplayText };
});

2. 前端调用后端方法修改页面文本 #

在对应页面的前端代码中导入上述后端方法，调用后直接将返回的展示文本赋值给页面对应的文本组件即可，前端全程不会接触原始敏感数据：

// 对应页面的前端代码
import { getProcessedDisplayText } from 'backend/userSecret.jsw';

$w.onReady(async () => {
  try {
    const res = await getProcessedDisplayText();
    // 假设你页面上用来展示保密信息的文本组件ID为 secretDisplay
    $w('#secretDisplay').text = res.finalDisplayText;
  } catch (error) {
    // 异常情况处理，例如用户未登录、无权限查询
    $w('#secretDisplay').text = "请登录后查看该信息";
  }
});

注意事项 #

• 所有敏感数据的查询、计算、脱敏逻辑必须全部放在后端完成，返回给前端的仅能是最终可直接展示的字符串，不要返回任何多余的原始敏感字段
• 必须给后端Web方法配置严格的权限校验，除了登录限制外，必要时可在方法内增加额外的身份校验逻辑
• Velo会自动对.jsw模块的调用做安全校验，不要主动对外泄露后端模块文件名、方法名即可

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