如何动态存储/编辑Laravel翻译文件并在Vue.js中使用

一、直接编辑/lang目录下的翻译文件 #

如果要让translator账号用户通过界面编辑/lang/en这类文件，需解决读取、验证、写入、前端同步四个核心问题：

• 读取翻译文件：在Laravel后端编写接口，用File::get()或Lang::getLoader()->load()读取指定语言目录下的.php或.json文件，将内容转为数组返回给前端Vue。示例代码：

  // 读取JSON格式翻译文件
  $content = File::get(resource_path('lang/en/messages.json'));
  $translations = json_decode($content, true);
  
  // 读取PHP格式翻译文件
  $translations = Lang::getLoader()->load('en', 'messages');
  

• 安全验证与权限控制：仅允许translator角色用户访问编辑界面；对提交内容做校验，优先使用.json格式避免PHP代码注入风险，若用.php格式需严格过滤恶意代码。
• 写入文件：后端接收前端提交的翻译数组，转成对应格式写入文件：

  // 写入JSON文件
  File::put(resource_path('lang/en/messages.json'), json_encode($translations, JSON_PRETTY_PRINT));
  
  // 写入PHP文件
  $phpContent = "<?php\n\nreturn " . var_export($translations, true) . ";\n";
  File::put(resource_path('lang/en/messages.php'), $phpContent);
  

• 同步到Vue：使用laravel-vue-i18n等工具直接加载/lang目录文件，或后端将翻译内容打包为JSON注入页面，也可提供接口让Vue动态获取最新翻译。

二、替代方案（更适合用户编辑场景） #

直接操作文件存在代码注入、权限管理复杂等问题，以下是更实用的替代方案：

1. 数据库存储翻译内容 #

创建translations表，字段包含locale（语言码）、key（翻译键）、value（翻译值）、group（分组），将翻译条目存入数据库：

• 后端实现：编写CRUD接口供translator用户管理翻译；自定义Laravel翻译加载器，从数据库读取翻译（可同时加载文件与数据库内容，数据库优先级更高）。示例加载器：

  class DatabaseLoader implements LoaderInterface {
      public function load($locale, $group, $namespace = null) {
          return \App\Models\Translation::where('locale', $locale)
              ->where('group', $group)
              ->pluck('value', 'key')
              ->toArray();
      }
  
      // 实现接口要求的其他方法（addNamespace、loadNamespace等）
  }
  

  在服务提供者的boot方法中注册加载器：

  Lang::extend('database', function ($app) {
      return new DatabaseLoader($app);
  });
  

• Vue端使用：后端提供接口返回指定语言的所有翻译，用vue-i18n插件加载数据，或在页面初始化时将翻译注入全局变量。

2. 集成翻译管理工具 #

针对多人协作翻译场景，可使用专业翻译管理工具，translator用户在工具界面编辑内容，通过API自动同步到项目的/lang目录或数据库，无需手动操作文件。

3. 配置中心存储 #

搭建配置中心存储翻译内容，Laravel与Vue均从配置中心拉取最新翻译。这种方式适合多环境、多项目共享翻译的场景，translator用户在配置中心界面编辑后，后端与前端可实时或定期同步内容。

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