परिनियोजनं तथा ऑनलाइन

i18n.site एकपृष्ठीय-अनुप्रयोग -आर्किटेक्चरं स्वीकुर्वति, तथा च वेबसाइट्-प्रवेशपृष्ठं वेबसाइट्-सामग्री च स्वतन्त्रतया परिनियोजितं भवति ।

उपरिष्टाद् अनुवादं चालयित्वा md/out/dev निर्देशिकायाः अधः htm तथा v निर्देशिकाः उत्पद्यन्ते ।

अत्र 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 परिवर्तनं कुर्वन्तु

अनुवादं प्रकाशयितुं च md निर्देशिकायां i18n.site --npm अथवा i18n.site -n चालयन्तु ।

यदि भवान् प्रकाशनार्थं निरन्तरं एकीकरणवातावरणस्य उपयोगं करोति तर्हि nodejs संस्थापनस्य आवश्यकता नास्ति केवलं लॉग-इन-प्रकाशन-अनुमतिः ~/.npmrc वातावरणे प्रतिलिख्यताम् ।

यदि भवान् main.yml मध्ये v: इत्यस्य संकुलनाम परिवर्तयति तर्हि प्रथमं .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 निर्देशिकायां सामग्रीं v: मध्ये सेट् कृतस्य URL उपसर्गमार्गे विन्यस्यताम् ।

अन्ते /.v तः 1s पर्यन्तं समाप्तस्य मार्गस्य संग्रहसमयं विन्यस्यताम् , अन्यथा नवनिर्गतसामग्री तत्क्षणं अभिगन्तुं न शक्यते ।

अन्यमार्गाणां कृते सञ्चयसमयः एकवर्षं वा अधिकं वा सेट् कर्तुं शक्यते यत् अनावश्यकं अनुरोधं न्यूनीकर्तुं शक्यते ।

s3 कृते सामग्रीं होस्ट् कुर्वन्तु

सामग्रीं स्वयमेव होस्ट् कर्तुं, स्वस्य सर्वरस्य उपयोगस्य अतिरिक्तं, अन्यः CDN विकल्पः S3 +

S3 S3 सर्वरे प्रवेशं कर्तुं rclone

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 उत्तमाः विकल्पाः सन्ति।

यतः जालपुटे एकपृष्ठीय-अनुप्रयोग- आर्किटेक्चरस्य उपयोगः भवति, अतः . तः index.html यावत् न समाविष्टाः URL-मार्गाः पुनः लिखितुं स्मर्यताम् ।

वेबसाइट् प्रविष्टिपृष्ठं केवलं एकवारं परिनियोजितुं आवश्यकं भवति, अनन्तरं सामग्री-अद्यतनार्थं वेबसाइट्-प्रविष्टि-पृष्ठस्य पुनः परिनियोजनस्य आवश्यकता नास्ति ।

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 गोदामं च बन्धयन्तु ।

प्रक्रिया अधोलिखिते चित्रे दर्शिता अस्ति : १.

संस्था i18n-demo मध्ये प्रवेशं दातुं कृपया Add Account नुदन्तु ।

यदि भवान् अन्यस्य संस्थायाः गोदामस्य बाध्यं कृतवान् अस्ति तर्हि नूतनसङ्गठनस्य प्रदर्शनात् पूर्वं द्विवारं अधिकृत्य Add Account नुदितव्यं भवेत् ।

तदनन्तरं, warehouse 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 !

एकपृष्ठीय-अनुप्रयोगानाम् अनुकूलतायै मार्गं पुनः लिखितुं भवान् edge computing इत्यस्य उपयोगं कर्तुं शक्नोति उदाहरणार्थं, 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';
})

यतः record MX तथा record CNAME सह-अस्तित्वं न प्राप्नुयात्, यदि भवान् एकस्मिन् समये डोमेन-नाम-ईमेल-प्राप्तिम् इच्छति तर्हि record A -इत्यत्र स्तर CNAME -पर्यन्तं स्क्रिप्ट्-सहकार्यं कर्तुं आवश्यकम् cname_flatten

तदतिरिक्तं, यतोहि मुख्यभूमिचीनदेशे क्लाउड्विक्रेतृणां विदेशेषु यातायातशुल्कं तुल्यकालिकरूपेण महत् भवति, यदि भवान् व्ययस्य अनुकूलनं कर्तुम् इच्छति तर्हि भवान् DNS Cloud स्य निःशुल्कं भौगोलिकसंकल्पं तथा Cloudflare for SaaS 's कस्टम् डोमेननाम (यथा अधः दर्शितम्) उपयोक्तुं शक्नोति यातायातविपथनम्──मुख्यभूमिचीनदेशे यातायातमार्गनिर्धारणं Baidu Cloud CDN , अन्तर्राष्ट्रीययातायातं गच्छति cloudflare .

एते परिनियोजन-अनुकूलन-समाधानाः अधिकजटिलाः सन्ति, भविष्ये पृथक्-पृथक् अध्यायेषु प्रवर्तयिष्यन्ते ।

सामान्य डोमेन नाम पुनर्निर्देशन

यदि भवान् स्वस्य मुख्यजालस्थलरूपेण जालस्थलं जनयितुं i18n.site उपयोगं करोति तर्हि सामान्यतया भवतां pan-domain पुनर्निर्देशनं विन्यस्तं कर्तव्यं भवति, अर्थात् *.xxx.com ( www.xxx.com सहितम्) -इत्यत्र xxx.com अभिगमं पुनः निर्दिशति

एषा आवश्यकता अलीबाबा मेघ CDN EdgeScript ( English document / Chinese document ) इत्यस्य साहाय्येन प्राप्तुं शक्यते |

अलीबाबा CDN इत्यस्मिन् डोमेन् नाम योजयन्तु तथा च अलीबाबा क्लाउड् CDN इत्यस्मिन् डोमेन् नाम *.xxx.com तः CNAME पर्यन्तं दर्शयन्तु !

यथा, उपरि चित्रे *.i18n.site इत्यस्य pan-domain name redirection configuration इत्येतत् निम्नलिखितम् अस्ति ।

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

स्रोतभाषानिर्देशिका, .i18n/conf.yml विन्याससञ्चिकायां fromTo मध्ये en इत्यस्य अनुरूपम्

i18n:
  fromTo:
    en: zh

कृपया अनुवादस्य विन्यासं पश्यन्तु i18