Развертывание И Онлайн
i18n.site использует одностраничную архитектуру приложения , а входная страница и содержимое веб-сайта развертываются независимо.
После запуска вышеуказанного перевода каталоги htm и v будут созданы в каталоге md/out/dev .
Здесь dev означает, что он построен на основе файла конфигурации .i18n/htm/dev.yml .
dev каталог :
Каталог htm — это входная страница веб-сайта.
Каталог v содержит содержимое веб-сайта с номерами версий.
Локальный предварительный просмотр не учитывает номер версии и скопирует все файлы в каталог out/dev/v/0.1.0 .
Для официального выпуска измененные файлы будут скопированы в каталог с новым номером версии.
Укажите Файл Конфигурации С -c
Различные файлы конфигурации создадут соответствующие каталоги в каталоге out .
Например, .i18n/htm/main.yml создаст каталог out/main .
dev.yml и main.yml — конфигурации по умолчанию.
dev — это сокращение от development , обозначающее среду разработки, используемое для локального предварительного просмотра, а также файл конфигурации по умолчанию.
ol — это сокращение от online , обозначающее онлайн-среду, которая используется для официального выпуска. Это также файл конфигурации по умолчанию при использовании параметров командной строки -n по npm для выпуска.
Вы также можете создать другие файлы конфигурации. Используйте --htm_conf в командной строке, чтобы указать имя файла конфигурации, который будет использоваться:
например:
i18n.site --htm_conf dist --save
Здесь --save представляет номер версии выпуска обновления.
Публикация контента на npmjs.com
Публикация контента в npmjs.com является рекомендуемым решением по умолчанию (см. раздел Высокая доступность внешнего интерфейса ).
npm Логин & Сообщение
Установите nodejs , войдите с npm login .
Отредактируйте md/.i18n/htm/main.yml и измените значение md: YOUR_NPM_PACKAGE в качестве собственного имени пакета npm Подойдет любое незанятое имя пакета npmjs.com
Затем измените md/.i18n/htm/main.package.json
Запустите i18n.site --npm или i18n.site -n в каталоге md , чтобы перевести и опубликовать.
Если вы используете среду непрерывной интеграции для публикации, нет необходимости устанавливать nodejs Просто скопируйте разрешения для входа и публикации ~/.npmrc в среду.
Если вы измените имя пакета v: в main.yml , сначала удалите .i18n/v/main , а затем опубликуйте его.
Прокси-Сервер, Опубликованный npm
Если пользователи в материковом Китае сталкиваются с проблемами сети и не могут опубликовать npm пакетов, они могут установить переменную среды https_proxy для настройки прокси-сервера.
Предполагая, что порт вашего прокси-сервера равен 7890 , вы можете написать:
https_proxy=http://127.0.0.1:7890 i18n.site -n
Самостоятельный Контент
Если вы хотите разместить контент самостоятельно, сначала отредактируйте md/.i18n/htm/main.yml и измените v: //unpkg.com/i18n.site на префикс URL-адреса, например v: //i18n-v.xxx.com .
Войдите в каталог md и запустите
i18n.site --htm_conf ol --save
или аббревиатура
i18n.site -c ol -s
Затем настройте содержимое каталога md/out/main/v на путь префикса URL, установленный в v: .
Наконец, настройте время кэширования пути 1s заканчивающегося на /.v , иначе к недавно выпущенному контенту будет невозможно получить немедленный доступ.
Время кэширования для других путей может быть установлено на один год или более, чтобы уменьшить количество ненужных запросов.
Размещайте Контент На s3
Для самостоятельного размещения контента, помимо использования собственного сервера, еще одним распространенным вариантом является использование S3 + CDN .
Вы можете использовать rclone для входа на сервер S3 , затем обратиться к следующему сценарию и изменить его и скопировать только дополнительные изменения в S3 для каждого выпуска.
i18n.site -c ol -s
s3=your-s3
bucket=your-bucket
ver=$(head -1 .i18n/v/main/v.hash | cut -c 2-)
rclone copy --overwrite-dir out/main/htm/v/$ver $s3:/$bucket/$ver
rclone copy out/main/v/.v "$s3:/$bucket/"
Не забудьте настроить CDN , чтобы время кэширования пути, заканчивающегося на /.v было равно 1s , иначе к недавно выпущенному содержимому будет невозможно получить немедленный доступ.
Опубликовать Веб-Сайт
Веб-сайт можно развернуть где угодно. Хороший выбор — github page и cloudflare page .
Поскольку веб-сайт использует архитектуру одностраничного приложения , не забудьте переписать пути URL-адресов, которые не содержат . до index.html .
Страницу входа на веб-сайт необходимо развернуть только один раз, и нет необходимости повторно развертывать страницу входа на веб-сайт для последующих обновлений содержимого.
Развертывание На Странице github
Сначала нажмите здесь github чтобы создать организацию . В качестве примера можно привести следующее имя организации: i18n-demo .
Затем создайте склад i18n-demo.github.io в этой организации (замените i18n-demo на название созданной вами организации):
При публикации содержимого предыдущей статьи было создано out/main/htm Пожалуйста, войдите в этот каталог и запустите :
ln -s index.html 404.html
Поскольку github page не поддерживает перезапись URL-пути, вместо него используется 404.html .
Затем выполните следующую команду в каталоге htm (не забудьте заменить i18n-demo/i18n-demo.github.io.git адресом вашего склада) :
git init
git branch -M main
git remote add origin [email protected]:i18n-demo/i18n-demo.github.io.git
git push -u origin main -f
После отправки кода подождите, пока развертывание github page завершится успешно (как показано ниже), прежде чем вы сможете получить к нему доступ.
Демо-страницу см.:
https://i18n-demo.github.io
Развертывание На Странице cloudflare
cloudflare page По сравнению с github page , он обеспечивает перезапись пути, более дружелюбен к материковому Китаю и более доступен.
Развертывание cloudflare page обычно основано на развертывании github page описанном выше.
Создайте проект и привяжите склад i18n-demo.github.io выше.
Процесс показан на рисунке ниже:
Нажмите Add Account чтобы предоставить доступ к организации i18n-demo .
Если вы привязали склад другой организации, возможно, вам придется дважды нажать Add Account для авторизации, прежде чем отобразится новая организация.
Далее выберите склад i18n-demo.github.io , затем нажмите Begin setup и используйте значения по умолчанию для последующих шагов.
После первой привязки вам нужно подождать несколько минут, прежде чем вы сможете получить к нему доступ.
После развертывания вы можете привязать собственное доменное имя.
После привязки имени собственного домена перейдите к имени домена, чтобы настроить перезапись пути одностраничного приложения, как показано ниже:
Правила на рисунке выше следующие. Замените i18n.site в первой строке ниже на имя домена, которое вы привязали.
(http.host in {"i18n.site"}) and not (
substring(http.request.uri.path,-3) in {".js" ".gz"} or
substring(http.request.uri.path,-4) in {".htm" ".rss" ".css" ".svg" ".ico" ".png" ".xml" ".txt"} or
substring(http.request.uri.path,-5) in {".html" ".avif" ".json"} or
ends_with(http.request.uri.path,".webmanifest")
)
Кроме того, настройте правила кэширования, как показано ниже, и установите продолжительность кэширования на один месяц.
Пожалуйста, измените соответствие доменного имени на втором шаге на рисунке выше на доменное имя, которое вы связали.
Оптимизация Развертывания Веб-Сайта В Материковом Китае
Если вы хотите улучшить доступность в сетевой среде материкового Китая, сначала зарегистрируйте доменное имя .
Затем воспользуйтесь объектным хранилищем поставщиков облачных CDN + следующий контент out/main/htm .
Вы можете использовать периферийные вычисления, чтобы переписать путь для адаптации к одностраничным приложениям. Например, Baidu Smart Cloud CDN можно настроить следующим образом:
const uri = r.uri, p = uri.lastIndexOf(".");
if (
p < 0 ||
!"|js|css|htm|html|md|avif|json|ico|xml|rss|gz|mp4|png|svg|txt|webmanifest|".includes(
"|" + uri.slice(p + 1) + "|",
)
) {
const ua = r.headersIn["User-Agent"].toLowerCase()
if (/facebookexternalhit|slurp|bot|spider|curl/.test(ua)) {
r.return(
302,
(/baidu|yisou|sogou|360|byte/.test(ua) ? "/zh" : "/en") + r.uri + ".htm",
)
} else {
r.uri = "/index.html"
}
}
r.respHeader(() => {
const t = [], out = r.headersOut;
["Content-MD5", "Age", "Expires", "Last-Modified"].forEach(
i => delete out[i]
)
r.rawHeadersOut.forEach(i => {
const key = i[0].toLowerCase()
if (key.startsWith("x-") || key.startsWith("ohc-")) {
delete out[key]
}
})
out["Cache-Control"] = "max-age=" + 9e5
// Заголовки ответов можно настроить для вывода отладки, например out.XXX = 'MSG';
})
Поскольку запись MX и запись CNAME не могут сосуществовать, если вы хотите одновременно получать электронные письма о доменных именах, вам необходимо использовать сценарий cname_flatten для уровня CNAME в записи A .
Кроме того, поскольку плата за зарубежный трафик поставщиков облачных услуг в материковом Китае относительно высока, если вы хотите оптимизировать затраты, вы можете использовать бесплатное географическое разрешение Huawei Cloud DNS и собственное доменное имя Cloudflare for SaaS (как показано ниже). перенаправление трафика ──Маршрутизация трафика в материковом Китае Baidu Cloud CDN , международный трафик идет cloudflare .
Эти решения по оптимизации развертывания более сложны и в будущем будут представлены в отдельных главах.
Общее Перенаправление Доменного Имени
Если вы используете i18n.site для создания веб-сайта в качестве основного веб-сайта, вам обычно необходимо настроить перенаправление пандомена, то есть перенаправить доступ с *.xxx.com (включая www.xxx.com ) на xxx.com .
Это требование можно выполнить с помощью Alibaba Cloud CDN EdgeScript ( документ на английском языке / Документ на китайском языке ).
Добавьте доменное имя в Alibaba CDN и укажите доменное имя *.xxx.com до CNAME в Alibaba Cloud CDN .
Например, конфигурация перенаправления пан-доменного имени *.i18n.site на рисунке выше выглядит следующим образом:
rewrite(concat('https://i18n.site',$uri), 'redirect',301)
Развертывание С Помощью nginx
Добавьте конфигурацию, подобную следующей, в абзаце server nginx Измените /root/i18n/md/out/main/htm на путь к вашему собственному проекту out/main/htm :
location / {
root /root/i18n/md/out/main/htm;
add_header Cache-Control "max-age=9999999";
if ($uri !~* \.(avif|css|html|ico|js|json|png|svg|txt|webmanifest|xml)$) {
rewrite ^ /index.html last;
}
}
На Основе github action Непрерывной Интеграции
Для настройки github action вы можете обратиться к следующему:
name: i18n.site
on:
workflow_dispatch:
push:
branches:
- main
- dist
jobs:
i18n:
permissions:
repository-projects: write
contents: write
runs-on: ubuntu-latest
steps:
- name: checkout
uses: actions/checkout@v4
- name: https://i18n.site
uses: i18n-site/github-action-i18n.site@main
with:
I18N_SITE_TOKEN: ${{ secrets.I18N_SITE_TOKEN }}
NPM_TOKEN: ${{ secrets.NPM_TOKEN }}
Как видно из конфигурации, этот рабочий процесс запускается при отправке в ветку main и ветку dist .
Рабочий процесс будет использовать файл конфигурации, соответствующий имени ветки, для публикации документа. Здесь в качестве конфигурации публикации будут использоваться соответственно .i18n/htm/main.yml и .i18n/htm/dist.yml .
Мы рекомендуем следующие рекомендации для процесса выпуска документов:
Когда изменения передаются в ветку main , документ запускается для сборки и развертывания на станции предварительного просмотра (станция предварительного просмотра доступна github page ).
После подтверждения правильности документа на сайте предварительной версии код будет объединен и отправлен в ветку dist , а официальная сборка и развертывание перейдут в Интернет.
Конечно, реализация описанного выше процесса требует написания большего количества конфигураций.
Вы можете обратиться к реальному проекту для создания сценариев рабочего процесса github.com/fcdoc/doc
secrets.I18N_SITE_TOKEN и secrets.NPM_TOKEN в конфигурации требуют настройки секретных переменных в базе кода.
I18N_SITE_TOKEN i18n.site/token
NPM_TOKEN — это токен публикации пакета npm в конфигурации. Посетите npmjs.com и создайте токен с разрешениями на публикацию (как показано ниже).
Структура Каталогов
public
Статические файлы веб-сайта, такие как favicon.ico , robots.txt и т. д.
Файлы значков здесь могут быть созданы с расширением realfavicongenerator.net
.i18n
В каталоге .i18n находятся файлы конфигурации, кэш переводов и т. д. i18n.site Подробности см. в следующей главе «Конфигурация» .
en
Каталог исходного языка, соответствующий файлу конфигурации en из fromTo в .i18n/conf.yml
i18n:
fromTo:
en: zh
Пожалуйста, обратитесь к конфигурации перевода i18