网络请求数据拦截并翻译

当用户触发ajax请求时,它可以针对ajax请求中的某个参数,进行获取,并进行翻译,将翻译后的文本赋予这个参数,然后再放开请求。

  1. 它可以针对 xhr、 fetch 方式的网络请求生效。
  2. 它可以针对 get、post 方式的请求生效。

使用场景

搜索场景,原本是中文的页面,翻译为英文后,给美国人使用,美国人使用时,进行搜索,输入的是英文,然后点击搜索按钮,发起搜索。
然后此会拦截网络请求,将请求中用户输入的搜索文本的内容提取出来,识别它输入的是中文还是英文,如果不是本地的语种中文,那就将其翻译为中文,然后再赋予此请求的这个参数中,然后再放开这次请求。
这样请求真正到达服务端接口时,服务端接受到的搜索的文本内容实际就是翻译后的中文文本,而不是用户输入的英文文本。

使用方式

  1. translate.network.rules = [
  2. {
  3. url: /https://www.guanleiming.com/a/b/.html/,
  4. methods: ['GET', 'POST'],
  5. params: ['a','b1']
  6. },
  7. {
  8. url: /https://www.guanleiming.com/c/d/.html/,
  9. methods: ['GET'],
  10. params: ['a','b1']
  11. },
  12. ];
  13. translate.network.use(); //启用

translate.network.rules 设置的是一个规则数组,每个数组有三个参数:

因为 translate.network.rules 这是一个数组形态,凡事符合其中任意一个规则,都会触发拦截翻译。

此设置建议放在 translate.execute();的上面。

自动进行翻译的触发条件

  1. 当前用户有进行切换语言,比如本地语种设置了简体中文,你当前切换为英文进行浏览时。
  2. 请求中某个参数的值,其文本语言跟本地语种不一致,比如本地语种是简体中文,而参数的值的文本是英语。
  3. 设置的 translate.network.rules 匹配上

这三种情况都满足时,才会进行拦截并翻译这个指定参数的值

版本

需要使用 translate.js v3.15.12.20250603 及更高版本