stonefisher
stonefisher

Vue应用多语言支持工程化最佳实践

前言

VoerkaI18n是一款非常优秀的全新的开源国际化多语言解决方案，主要特性包括：

  • 全面工程化解决方案，提供初始化、提取文本、自动翻译、编译等工具链支持。
  • 符合直觉，不需要手动定义文本Key映射。
  • 强大的插值变量格式化器机制，可以扩展出强大的多语言特性。
  • 支持babel插件自动导入t翻译函数。
  • 支持nodejs、浏览器(vue/react/solid)等、React Native等任意JS场景
  • 采用工具链与运行时分开设计，发布时只需要集成很小的运行时。
  • 高度可扩展的复数、货币、数字等常用的多语言处理机制。
  • 翻译过程内，提取文本可以自动进行同步，并保留已翻译的内容。
  • 可以动态在线添加支持的语言
  • 支持发布后的在线打语言包补丁，修复翻译错误
  • 支持调用在线自动翻译对提取文本进行翻译。
  • 核心运行时@voerkai18n/runtime超过90%的测试覆盖率
  • 支持·TypeScript·开发

本节主要介绍如何在Vue 3应用中使用VoerkaI18n。

创建Vue 3应用一般采用Vite或Vue Cli来创建工程。在Vue3应用中引入voerkai18n来添加国际化应用需要由两个插件来简化应用。

  • @voerkai18n/vue

    Vue插件，在初始化Vue应用时引入，提供访问当前语言、切换语言、自动更新等功能。

  • @voerkai18n/vite

    Vite插件，在vite.config.js中配置，用来实现自动文本映射和t函数的自动导入等功能。

@voerkai18n/vue和@voerkai18n/vite两件插件相互配合，安装配置好这两个插件后，就可以在Vue文件使用多语言t函数。

第一步：基本流程

Vue应用启用VoerkaI18n国际化功能的完整工程化流程如下：

  • 调用voerkai18n init初始化多语言工程
  • 调用voerkai18n extract提取要翻译的文本
  • 调用voerkai18n translate进行自动翻译或人工翻译
  • 调用voerkai18n compile编译语言包
  • 在Vue应用中引入@voerkai18n/vue和@voerkai18n/vite插件
  • 在源码中使用t函数进行翻译

完整的工程化流程请参见工程化，以下简要介绍如何在Vue应用中使用VoerkaI18n。

第二步：启用@voerkai18n/vite插件

@voerkai18n/vite插件作用是：

  • 可以根据idMap.ts映射文件将源码中的t("xxxxx")转换为t("<数字>")的形式，从而实现消除翻译内容的冗余内容。
  • 实现自动导入t函数的功能，省却手动导入的麻烦。

@voerkai18n/vite插件的安装非常简单，只需要在vite.config.(ts|js)中添加如下内容：


import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import Inspect from 'vite-plugin-inspect'
import Voerkai18nPlugin from "@voerkai18n/vite"
 
export default defineConfig({
  plugins: [    
    Inspect(),                // 可选    
    Voerkai18nPlugin(),       // 新增加
    vue()
  ],
})
  • @voerkai18n/vite插件仅在开发和构建阶段作用。事实上，如果不在乎文本内容的冗余，不安装此插件也是可以工作正常的。
  • vite-plugin-inspect仅用于调试，可以在http://localhost:3000/__inspect/查看当前工程中的@voerkai18n/vite是否正确地进行自动导入和idMap.ts映射，供开发阶段进行调试使用。
  • @voerkai18n/vite插件的完整使用说明。

第三步：配置@voerkai18n/vue插件

@voerkai18n/vue插件用来自动注入t函数、切换语言等功能。

安装方法如下：

import { createApp } from 'vue'
import './style.css'
import App from './App.vue'
// 导入插件
import i18nPlugin from '@voerkai18n/vue'
// 导入当前作用域
import { i18nScope } from './languages'

// 等待i18nScope初始化完成
i18nScope.ready(()=>{
  const app = createApp(App)
  // 应用插件
  app.use<VoerkaI18nPluginOptions>(i18nPlugin as any,{
      i18nScope
  })
  app.mount('#app')
})

@voerkai18n/vue插件本质上是为每一个Vue组件自动混入t函数。

第四步：使用t翻译函数

Vue应用使用多语言本质是调用import { t } from 'langauges导入的t函数来进行翻译。





// 直接使用t函数，不需要导入

// 直接使用

重点：

  • 在

    小结

    • @voerkai18n/vue插件为Vue单文件组件提供自动注入t函数，可以在

你可能感兴趣的:(voerkai18n,vue.js,前端,javascript,国际化,多语言,i18n,vue)

  • 【vue3】el-table表头和表格文字都居中 晚睡要秃头 前端框架Vuehtml5javascript前端vueelementui
    1、表头文字居中：:cell-style="{textAlign:'center'}"查询2、表格内文字居中：:header-cell-style="{textAlign:'center'}"
  • 前端Vue面试八股常考题（二） LuxTorch 前端面试题vue.js前端面试
    文章目录1、VueRouter如何配置404页面？1.基础配置步骤2.高级用法2、Vue中的过滤器有哪些应用场景？Vue3如何替代？1.过滤器的核心功能2.典型应用场景3.Vue3中的替代方案3、Vue中computed和methods的区别是什么？示例对比4、什么是Vue的前端路由？如何实现？1.核心实现方式：VueRouter2.VueRouter配置步骤3.VueRouter核心功能特性5、
  • 手把手教你入门vue+springboot开发（十三）--无感token前端实现 段鸿潭 java前端vue.jsspringboot
    文章目录前言一、前端代码实现1.登录处理2.刷新token请求增加3.请求拦截器修改4.响应拦截器修改5.测试结果二、代码逻辑优化前言上一篇我们研究了无感token刷新的实现方案以及后端代码实现，本篇我们将详细研究一下前端代码实现，前端代码实现过程中也有很多细节的地方需要注意，重点要关注前端代码编码过程中的业务逻辑处理。一、前端代码实现1.登录处理Login.vue文件中：//调用接口,完成登录l
  • 为什么要学习 next.js 框架 + Vercel 部署平台，因为我想把自己的 app 分享给别人。 waterHBO 学习javascript开发语言
    前端开发太卷？不如给你的React换个“豪华座驾”和“F1赛道”**如果你像我一样，从create-react-app的时代一路走来，你一定经历过那种“甜蜜的烦恼”：React给了你一个超强的V8引擎，但造车剩下的所有事——从方向盘(路由)、底盘(项目结构)到导航系统(数据管理)——都得你自己撸。结果就是，每个项目开始前，你都在重复发明轮子，在Webpack的配置地狱里苦苦挣扎。好消息是，时代变了
  • 开源项目收集 叶虽 开源项目mongodb数据库mysqlspringbootvue
    全网各类开源项目收集1、SpringBoot+Vue完整的外卖系统，手机端和后台管理，附源码！2、JEECG-BOOT适合SAAS项目、企业信息管理系统，办公统计管理3、J-IM即时通讯系统1、SpringBoot+Vue完整的外卖系统，手机端和后台管理，附源码！flash-waimai一个完整的外卖系统，包括手机端，后台管理，api基于springboot和vue的前后端分离的外卖系统包含完整的
  • jQuery-Json-AJAX-跨域 了解化 jqueryjsonajax
    一、jQuery1.简介用于简化JavaScript代码开发主要作用：对于前端来说，写更少代码、做更多事情2、JQuery入门2.1操作选择器$("p")选取元素。$("p.intro")选取所有class="intro"的元素。$("p#demo")选取所有id="demo"的元素。事件及其事件绑定JavaScript的事件与jQuery事件区别:jQuery事件就是将JavaScript事件名
  • ECharts后台读取数据动态生成折线图：实时数据可视化解决方案 窦菲芊Harriet
    ECharts后台读取数据动态生成折线图：实时数据可视化解决方案【下载地址】ECharts后台读取数据动态生成折线图该项目提供了一种高效的方法，利用PHP从数据库中读取数据，并通过JSON格式传输到前端，结合ECharts库动态生成折线图。通过AJAX技术，数据能够实时刷新，确保折线图始终反映最新数据变化。项目集成了ECharts和jQuery，简化了开发流程，适合需要实时数据可视化的场景。只需将
  • 二次开发源码 借贷系统uniapp/借贷认证系统/小额信贷系统/工薪贷APP/资金贷系统h5 csdndddsd uniapp借贷系统开发小额贷系统app工薪贷系统安装搭建信用贷认证系统h5资金贷系统安装搭建教程借贷系统安装搭建借贷系统二次开发
    前端：UNIAPP后端：ThinkPHP数据库：Mysql前端使用的uniapp可以打包APPH5小程序系统提供了完善的网络借贷体系，为金融中介平台提供从获客到贷后管理全流程服务，解决了借贷手续繁琐、流程缓慢等问题此源码为运营中版本，具有极高稳定性，防注入，防攻击，修复全部已知后门漏洞仅供学习演示、二次开发专用，禁止一切违法行为的利用！可提现金额(元)￥{{qbMoney}}充值提现余额明细余额变
  • Nuxt.js学习(二) --- Nuxt目录结构详解、Nuxt常用配置项、Nuxt路由配置和参数传递... 庭前云落 前端---Nuxt.JSvuejavajavascriptreactjs
    [TOC]1、Nuxt目录结构详解Nuxt项目文件目录结构|--.nuxt//Nuxt自动生成，临时的用于编辑的文件，build|--assets//用于组织未编译的静态资源入LESS、SASS或JavaScript|--components//用于自己编写的Vue组件，比如滚动组件，日历组件，分页组件|--layouts//布局目录，用于组织应用的布局组件，不可更改。|--middleware/
  • vue-31（Nuxt.js 中的数据获取：asyncData和fetch） 清幽竹客 VUEjavascriptvue.js前端
    Nuxt.js中的数据获取：asyncData和fetchNuxt.js为您的应用程序提供了强大而便捷的数据获取方式，尤其是在处理服务器端渲染（SSR）时。数据获取的两个主要方法是asyncData和fetch。了解每种方法的细微差别以及何时使用它们，对于构建高效和性能卓越的Nuxt.js应用程序至关重要。本课将深入探讨这些方法的细节，探索它们的功能、用例和差异。理解asyncDataasyncD
  • vue-32（部署一个 Nuxt.js 应用程序） 清幽竹客 VUEjavascriptvue.js前端
    部署一个Nuxt.js应用程序部署Nuxt.js应用程序是使您的创作向世界开放的最后一步。它包括为生产环境准备应用程序、选择合适的托管平台以及配置部署流程。本课程将指导您完成部署Nuxt.js应用程序的关键方面，确保顺利高效的发布。准备部署在部署您的Nuxt.js应用之前，优化它以适应生产环境至关重要。这涉及几个关键步骤：构建应用第一步是为生产环境构建您的Nuxt.js应用。这个过程会编译您的代码
  • Nuxt.js页面目录结构详解：从入门到精通 柏廷章Berta
    Nuxt.js页面目录结构详解：从入门到精通nuxtTheIntuitiveVueFramework.项目地址:https://gitcode.com/gh_mirrors/nu/nuxt什么是Nuxt.js的pages目录Nuxt.js采用基于文件系统的路由机制，pages目录是Nuxt项目中最核心的目录之一。该目录下的每个Vue组件文件都会自动映射为一个应用路由，这种设计极大地简化了路由配置工
  • 一种文档与代码双轨处理的RAG架构方案 木鱼时刻 大模型人工智能深度学习
    1.目标如何构建一个能同时高效处理文档和代码的RAG系统？本文提出的融合架构，旨在解决这一核心挑战。2.整体架构概览该系统的顶层设计思想是专业分工，统一调度。它将复杂的知识处理流程拆解为清晰的模块，各模块各司其职，最终由一个核心服务进行统一编排。+-------------------+|前端||(DifyWeb界面)|+-------------------+|+----------------
  • 『uniapp』i18n 国际化（保姆级图文） 发现你走远了 uniapp企业级开发知识专栏uni-appi18n国际化vue-i18n
    目录预览效果项目根目录新建i18n文件夹安装vue-i18n指定版本main.js中引入i18n页面展示总结欢迎关注『uniapp』专栏，持续更新中欢迎关注『uniapp』专栏，持续更新中预览效果中文英文项目根目录新建i18n文件夹其中各个语言的json文件
  • 什么是WebAssembly（WASM） MonkeyKing.sun wasm区块链
    WebAssembly（WASM）是一种高性能的低级编程语言字节码格式，可在网页和非网页环境中运行，支持多语言编译，运行速度接近原生代码。它在区块链中的作用是：作为智能合约的执行引擎，被多条非以太坊链（如Polkadot、EOS、CosmWasm）采用。Polkadot和EOS是使用WebAssembly的两个代表性区块链平台，它们与Solidity+EVM（以太坊生态）形成鲜明对比。一、什么是W
  • JavaScript深入理解与实战：作业6详解 红廉骑士兽
    本文还有配套的精品资源，点击获取简介：本次作业深入探讨了JavaScript编程语言的基础语法、函数与闭包、对象与原型链、事件与DOM操作、异步编程、ES6新特性、框架与库的使用、性能优化以及调试与测试。JavaScript在Web开发中扮演关键角色，通过学习上述知识点，学生将能够提升Web应用开发技能，优化代码性能，并进行有效的代码调试与测试。1.JavaScript基础语法介绍与实战1.1Ja
  • HtmlEx：HTML高级开发与实战指南 浮华ya
    本文还有配套的精品资源，点击获取简介：HTML是创建网页的基础，而"HtmlEx"项目旨在提升开发者的HTML技能。内容包括HTML5新特性，CSS和JavaScript的深入集成，表单元素的使用和验证，多媒体支持，Web组件，SEO优化，无障碍性实践，HTML模板语言使用，以及与后端框架的集成。通过实践讲解，让开发者在网页开发中更加得心应手。1.HTML基本结构与元素1.1HTML文档结构解析H
  • Vue2（二）绑定样式、条件渲染、列表渲染、监视数据原理 DogEgg_001 Vue2vue.js前端javascript
    目录一、绑定样式1.绑定class样式2.绑定style样式二、条件渲染1.v-show渲染方式2.v-if渲染方式三、列表渲染1.v-for（1）遍历数组*（2）遍历对象*（3）遍历字符串（4）遍历指定次数2.Key原理和作用3.列表过滤4.列表排序四、Vue监测数据变化的原理1.不能监测到变化的情况（1）无法检测通过索引修改数组的操作*（2）无法检测数组和对象的新增2.Vue监测数据的原理（1
  • Vue列表渲染与数据监测原理 tianzhiyi1989sq vue.jsjavascript前端
    一、v-for指令详解v-for是Vue中最常用的指令之一，用于遍历展示列表数据。它的基本语法是：v-for="(val,key)inxxx":key="key"，其中in也可以替换为of。1.1基本用法v-for可以遍历多种数据类型：人员列表{{index}}:{{p.name}}-{{p.age}}车辆信息{{key}}:{{val}}字符信息{{index}}:{{char}}数字{{ind
  • ECMAScript 2019（ES2019）：数组与对象操作的精细化升级 DT—— ECMAScript历史进程javascript前端
    1.版本背景与发布发布时间：2019年6月，由ECMAInternational正式发布，标准编号为ECMA-26210thEdition。历史意义：作为ES6之后的第四次年度更新，ES2019聚焦于数组、对象和字符串操作的精细化改进，提升开发效率和代码可读性。时代背景：随着前端框架的成熟和Node.js的普及，开发者对数组扁平化、对象转换等高频操作的需求激增，ES2019的发布回应了这些痛点。2
  • 大话前端：Vue和React的生命周期
    Vue和React的生命周期可以比作一棵树的生命周期，从种子到成熟树木的整个过程。种子阶段（初始化）:Vue:这是创建Vue实例的过程，类似于树木的种子埋入土壤，开始萌芽。在这个阶段，Vue会初始化事件和生命周期，然后进入模板编译阶段。React:类似地，React组件的初始化阶段就像是种子的萌芽。这里涉及到组件的构造函数、getDefaultProps和getInitialState方法，它们为
  • vue面试题整理1 weixin_42339193 vue.js前端javascript
    一、基础概念题1、Vue响应式原理是什么？如何检测数组变化？Vue的响应式原理主要是通过使用JavaScript的对象属性访问器（getters和setters）、依赖收集（dependencytracking）以及异步更新策略来实现的。以下是其核心概念：数据劫持/代理：Vue2.x使用Object.defineProperty方法将数据对象的所有属性转换为getter/setter形式。当属性被
  • Vue 与react 生命周期对比 weixin_42339193 vue.jsreact.js前端
    目录一、Vue2生命周期二、Vue3生命周期三、React生命周期四、ReactHooks生命周期替代方案五、三者对比总结六、关键差异分析七、最佳场景一、Vue2生命周期vue2的生命周期分为创建、挂载、更新、销毁四个阶段，共8个钩子beforeCreate→created→beforeMount→mounted→beforeUpdate→updated→beforeDestroy→destroy
  • 利用ShadowRoot 实现样式隔离 Helson@lin javascriptchromedevtools
    ShadowRootShadowDOMAPI的ShadowRoot接口是一个DOM子树的根节点，它与文档的主DOM树分开渲染。ShadowRoot的模式——可以是open或者closed。这定义了shadowroot的内部实现是否可被JavaScript访问及修改—也就是说ShadowRoot的特性图片来源：掘金（https://juejin.cn/post/6979489951108825095
  • Vue 列表渲染&数据更新 爱菜鸟高高飞 vue每日一更前端vue.jselementuijavascript
    一.基本使用基本列表人员列表（遍历数组）{{p.name}}-{{p.age}}汽车信息（遍历对象）{{k}}-{{value}}测试遍历字符串（用得少）{{char}}-{{index}}测试遍历指定次数（用得少）{{index}}-{{number}}Vue.config.productionTip=falsenewVue({el:'#root',data:{persons:[{id:'001
  • Vue计算属性与监视属性 tianzhiyi1989sq vue.js前端javascript
    1.1什么是计算属性？计算属性是Vue中一个非常实用的特性，它允许我们基于已有的数据属性计算出新的属性值。简单来说，计算属性就是通过data中已定义的属性计算得来的属性。原理：Vue底层使用defineProperty方法提供的getter和setter来实现计算属性。1.2计算属性的特点缓存机制：计算属性会缓存计算结果，只有依赖的属性发生变化时才会重新计算响应式：当依赖的数据变化时，计算属性会自
  • Vue - 监测数据的原理、Vue.set、vm.$set 企鹅d vue.js前端javascript
    监测数据的原理目录监测数据的原理一、更新时的问题二、Vue检测对象三、Vue检测数组3.1push添加3.2shift删除3.3splice替换3.4原理四、Vue.set4.1追加属性4.2案例五、总结5.1代码练习5.2总结一、更新时的问题为什么我们要研究一下Vue监测数据的原理？以防我们后续在给data赋值或者修改data中数据时导致修改不成功比如下面这个例子：初识vue人员列表<bu
  • 一款wordperss AI免费插件自动内容生成+前端AI交互+文章批量采集 Linkreate 前端人工智能wordpresswordpressAI插件wordpress免费插件wordpress自动发文自动发文源码
    一款LinkreatewordperssAI自动内容生成+前端AI会话窗口交互+文章批量采集免费插件1.SEO优化文章生成关键词驱动的内容生成：用户可以输入关键词或长尾关键词，插件会根据这些关键词生成高质量的SEO优化文章。文章结构清晰，语言自然流畅，符合SEO标准，能够有效提升网站内容的搜索引擎排名。自定义文章长度和要求：用户可以根据需要指定文章的长度（字数）以及对文章的额外要求，例如内容风格、
  • Vue条件渲染与列表渲染 io无心 web前端Vuevue
    条件渲染v-if写法：v-if="表达式"v-else-if="表达式"v-else="表达式"适用于：切换频率较低的场景。特点：不展示的DOM元素直接删除。注意：v-if可以与：v-else-if、v-else一起使用，但要求结构不能被打断。v-show写法：v-show='表达式'。适用于：切换频率较高的场景。特点：不展示的DOM元素会被隐藏。备注：使用v-if时，元素可能无法获取到，二使用v
  • 中小团队零成本搭建PHP任务管理系统：4大核心工具实测推荐 php
    引言在现代软件开发和团队协作中，高效的任务管理系统是提升生产力的核心要素。PHP作为全球最受欢迎的服务器端编程语言之一，凭借其成熟的生态系统、丰富的框架选择和强大的社区支持，成为构建任务管理系统的理想选择。一个优秀的PHP任务管理系统不仅能够实现任务的全生命周期管理，还能通过智能化的功能提升团队协作效率，降低项目管理成本。构建这样一个系统需要考虑多个层面：从底层的数据库设计到前端的用户体验，从安全
  • html 周华华 html
    js 1，数组的排列 var arr=[1,4,234,43,52,]; for(var x=0;x<arr.length;x++){    for(var y=x-1;y<arr.length;y++){      if(arr[x]<arr[y]){     &
  • 【Struts2 四】Struts2拦截器 bit1129 struts2拦截器
    Struts2框架是基于拦截器实现的，可以对某个Action进行拦截，然后某些逻辑处理，拦截器相当于AOP里面的环绕通知，即在Action方法的执行之前和之后根据需要添加相应的逻辑。事实上，即使struts.xml没有任何关于拦截器的配置，Struts2也会为我们添加一组默认的拦截器，最常见的是，请求参数自动绑定到Action对应的字段上。   Struts2中自定义拦截器的步骤是：
  • make:cc 命令未找到解决方法 daizj linux命令未知make cc
    安装rz sz程序时，报下面错误：   [root@slave2 src]# make posix cc   -O -DPOSIX -DMD=2 rz.c -o rz make: cc：命令未找到 make: *** [posix] 错误 127   系统：centos 6.6 环境：虚拟机   错误原因：系统未安装gcc，这个是由于在安
  • Oracle之Job应用 周凡杨 oracle job
    最近写服务，服务上线后，需要写一个定时执行的SQL脚本，清理并更新数据库表里的数据，应用到了Oracle 的 Job的相关知识。在此总结一下。   一：查看相关job信息    1、相关视图  dba_jobs  all_jobs  user_jobs  dba_jobs_running 包含正在运行
  • 多线程机制 朱辉辉33 多线程
    转至http://blog.csdn.net/lj70024/archive/2010/04/06/5455790.aspx 程序、进程和线程： 程序是一段静态的代码，它是应用程序执行的蓝本。进程是程序的一次动态执行过程，它对应了从代码加载、执行至执行完毕的一个完整过程，这个过程也是进程本身从产生、发展至消亡的过程。线程是比进程更小的单位，一个进程执行过程中可以产生多个线程，每个线程有自身的
  • web报表工具FineReport使用中遇到的常见报错及解决办法（一） 老A不折腾 web报表finereportjava报表报表工具
    FineReport使用中遇到的常见报错及解决办法（一） 这里写点抛砖引玉，希望大家能把自己整理的问题及解决方法晾出来，Mark一下，利人利己。   出现问题先搜一下文档上有没有，再看看度娘有没有，再看看论坛有没有。有报错要看日志。下面简单罗列下常见的问题，大多文档上都有提到的。   1、address pool is full： 含义：地址池满，连接数超过并发数上
  • mysql rpm安装后没有my.cnf 林鹤霄 没有my.cnf
    Linux下用rpm包安装的MySQL是不会安装/etc/my.cnf文件的， 至于为什么没有这个文件而MySQL却也能正常启动和作用，在这儿有两个说法， 第一种说法，my.cnf只是MySQL启动时的一个参数文件，可以没有它，这时MySQL会用内置的默认参数启动， 第二种说法，MySQL在启动时自动使用/usr/share/mysql目录下的my-medium.cnf文件，这种说法仅限于r
  • Kindle Fire HDX root并安装谷歌服务框架之后仍无法登陆谷歌账号的问题 aigo root
    原文：http://kindlefireforkid.com/how-to-setup-a-google-account-on-amazon-fire-tablet/   Step 4: Run ADB command from your PC   On the PC, you need install Amazon Fire ADB driver and instal
  • javascript 中var提升的典型实例 alxw4616 JavaScript
    // 刚刚在书上看到的一个小问题,很有意思.大家一起思考下吧 myname = 'global'; var fn = function () { console.log(myname); // undefined var myname = 'local'; console.log(myname); // local }; fn() // 上述代码实际上等同于以下代码 m
  • 定时器和获取时间的使用 百合不是茶 时间的转换定时器
    定时器:定时创建任务在游戏设计的时候用的比较多   Timer();定时器 TImerTask();Timer的子类  由 Timer 安排为一次执行或重复执行的任务。       定时器类Timer在java.util包中。使用时，先实例化，然后使用实例的schedule(TimerTask task, long delay)方法，设定
  • JDK1.5 Queue bijian1013 javathreadjava多线程Queue
    JDK1.5 Queue LinkedList： LinkedList不是同步的。如果多个线程同时访问列表，而其中至少一个线程从结构上修改了该列表，则它必须 保持外部同步。（结构修改指添加或删除一个或多个元素的任何操作；仅设置元素的值不是结构修改。）这一般通过对自然封装该列表的对象进行同步操作来完成。如果不存在这样的对象，则应该使用 Collections.synchronizedList 方
  • http认证原理和https bijian1013 httphttps
    一.基础介绍         在URL前加https://前缀表明是用SSL加密的。 你的电脑与服务器之间收发的信息传输将更加安全。         Web服务器启用SSL需要获得一个服务器证书并将该证书与要使用SSL的服务器绑定。 http和https使用的是完全不同的连接方式，用的端口也不一样,前者是80，后
  • 【Java范型五】范型继承 bit1129 java
    定义如下一个抽象的范型类，其中定义了两个范型参数，T1，T2   package com.tom.lang.generics; public abstract class SuperGenerics<T1, T2> { private T1 t1; private T2 t2; public abstract void doIt(T
  • 【Nginx六】nginx.conf常用指令(Directive) bit1129 Directive
    1. worker_processes    8; 表示Nginx将启动8个工作者进程，通过ps -ef|grep nginx,会发现有8个Nginx Worker Process在运行   nobody 53879 118449 0 Apr22 ? 00:26:15 nginx: worker process
  • lua 遍历Header头部 ronin47 lua header 遍历　
    local headers = ngx.req.get_headers()   ngx.say("headers begin", "<br/>")   ngx.say("Host : ", he
  • java-32.通过交换a,b中的元素，使[序列a元素的和]与[序列b元素的和]之间的差最小(两数组的差最小)。 bylijinnan java
    import java.util.Arrays; public class MinSumASumB { /** * Q32.有两个序列a,b，大小都为n,序列元素的值任意整数，无序. * * 要求：通过交换a,b中的元素，使[序列a元素的和]与[序列b元素的和]之间的差最小。 * 例如: * int[] a = {100,99,98,1,2,3
  • redis 开窍的石头 redis
    在redis的redis.conf配置文件中找到# requirepass foobared 把它替换成requirepass 12356789 后边的12356789就是你的密码 打开redis客户端输入config get requirepass 返回 redis 127.0.0.1:6379> config get requirepass 1) "require
  • [JAVA图像与图形]现有的GPU架构支持JAVA语言吗？ comsci java语言
          无论是opengl还是cuda，都是建立在C语言体系架构基础上的，在未来，图像图形处理业务快速发展，相关领域市场不断扩大的情况下，我们JAVA语言系统怎么从这么庞大，且还在不断扩大的市场上分到一块蛋糕，是值得每个JAVAER认真思考和行动的事情       
  • 安装ubuntu14.04登录后花屏了怎么办 cuiyadll ubuntu
    这个情况，一般属于显卡驱动问题。 可以先尝试安装显卡的官方闭源驱动。 按键盘三个键：CTRL + ALT  +  F1 进入终端，输入用户名和密码登录终端： 安装amd的显卡驱动 sudo  apt-get  install  fglrx 安装nvidia显卡驱动 sudo  ap
  • SSL 与 数字证书 的基本概念和工作原理 darrenzhu 加密ssl证书密钥签名
    SSL 与 数字证书 的基本概念和工作原理 http://www.linuxde.net/2012/03/8301.html SSL握手协议的目的是或最终结果是让客户端和服务器拥有一个共同的密钥，握手协议本身是基于非对称加密机制的，之后就使用共同的密钥基于对称加密机制进行信息交换。 http://www.ibm.com/developerworks/cn/webspher
  • Ubuntu设置ip的步骤 dcj3sjt126com ubuntu
    在单位的一台机器完全装了Ubuntu Server，但回家只能在XP上VM一个，装的时候网卡是DHCP的，用ifconfig查了一下ip是192.168.92.128,可以ping通。 转载不是错： Ubuntu命令行修改网络配置方法 /etc/network/interfaces打开后里面可设置DHCP或手动设置静态ip。前面auto eth0，让网卡开机自动挂载. 1. 以D
  • php包管理工具推荐 dcj3sjt126com PHPComposer
    http://www.phpcomposer.com/   Composer是 PHP 用来管理依赖（dependency）关系的工具。你可以在自己的项目中声明所依赖的外部工具库（libraries），Composer 会帮你安装这些依赖的库文件。 中文文档  入门指南  下载  安装包列表 Composer 中国镜像
  • Gson使用四（TypeAdapter） eksliang jsongsonGson自定义转换器gsonTypeAdapter
    转载请出自出处：http://eksliang.iteye.com/blog/2175595 一.概述        Gson的TypeAapter可以理解成自定义序列化和返序列化 二、应用场景举例        例如我们通常去注册时（那些外国网站），会让我们输入firstName，lastName,但是转到我们都
  • JQM控件之Navbar和Tabs gundumw100 htmlxmlcss
    在JQM中使用导航栏Navbar是简单的。 只需要将data-role="navbar"赋给div即可： <div data-role="navbar"> <ul> <li><a href="#" class="ui-btn-active&qu
  • 利用归并排序算法对大文件进行排序 iwindyforest java归并排序大文件分治法Merge sort
      归并排序算法介绍，请参照Wikipeida zh.wikipedia.org/wiki/%E5%BD%92%E5%B9%B6%E6%8E%92%E5%BA%8F 基本思想： 大文件分割成行数相等的两个子文件，递归（归并排序）两个子文件，直到递归到分割成的子文件低于限制行数 低于限制行数的子文件直接排序 两个排序好的子文件归并到父文件 直到最后所有排序好的父文件归并到输入
  • iOS UIWebView URL拦截 啸笑天 UIWebView
    本文译者：candeladiao，原文：URL filtering for UIWebView on the iPhone说明：译者在做app开发时，因为页面的javascript文件比较大导致加载速度很慢，所以想把javascript文件打包在app里，当UIWebView需要加载该脚本时就从app本地读取，但UIWebView并不支持加载本地资源。最后从下文中找到了解决方法，第一次翻译，难免有
  • 索引的碎片整理SQL语句 macroli sql
    SET NOCOUNT ON DECLARE @tablename VARCHAR (128) DECLARE @execstr VARCHAR (255) DECLARE @objectid INT DECLARE @indexid INT DECLARE @frag DECIMAL DECLARE @maxfrag DECIMAL --设置最大允许的碎片数量,超过则对索引进行碎片
  • Angularjs同步操作http请求with $promise qiaolevip 每天进步一点点学习永无止境AngularJS纵观千象
    // Define a factory app.factory('profilePromise', ['$q', 'AccountService', function($q, AccountService) { var deferred = $q.defer(); AccountService.getProfile().then(function(res) {
  • hibernate联合查询问题 sxj19881213 sqlHibernateHQL联合查询
    最近在用hibernate做项目，遇到了联合查询的问题，以及联合查询中的N+1问题。 针对无外键关联的联合查询，我做了HQL和SQL的实验，希望能帮助到大家。（我使用的版本是hibernate3.3.2）   1 几个常识：  （1）hql中的几种join查询，只有在外键关联、并且作了相应配置时才能使用。  （2）hql的默认查询策略，在进行联合查询时，会产
  • struts2.xml wuai struts
    <?xml version="1.0" encoding="UTF-8" ?> <!DOCTYPE struts PUBLIC "-//Apache Software Foundation//DTD Struts Configuration 2.3//EN" "http://struts.apache