Поделиться через


Пошаговое руководство. Внедрение локализованных ресурсов в файл JavaScript

Обновлен: Ноябрь 2007

В этом пошаговом руководстве описывается порядок включения в сборку файла ECMAScript (JavaScript) в качестве внедренного ресурса, а также включения локализованных строк в файл JavaScript. Файл JavaScript внедряется в сборку при необходимости распространения компонента клиентского сценария вместе с ней. Чтобы использовать ссылки на файл JavaScript в веб-приложении, необходимо зарегистрировать в нем сборку. Внедрение локализованных ресурсов осуществляется при необходимости изменения значений, которые используются в файле JavaScript, для различных языковых и региональных параметров.

Обязательные компоненты

Для выполнения процедур, описанных в данном руководстве, требуются следующие компоненты:

  • Microsoft Visual Studio 2008.

    Bb398868.alert_note(ru-ru,VS.90).gifПримечание.

    Использование Visual Web Developer, экспресс-выпуск не допускается, поскольку в Visual Web Developer, экспресс-выпуск не поддерживается создание проекта библиотеки классов, необходимого для данного пошагового руководства.

Создание сборки, содержащей внедренный файл JavaScript

Сначала выполняется создание сборки (DLL-файл), содержащей файл JavaScript, который необходимо обрабатывать в качестве ресурса. Для этого следует создать проект библиотеки классов Visual Studio, в результате выполнения которого создается сборка.

Внедрение в сборку файла клиентского сценария и ресурсов

  1. Создайте новый проект библиотеки классов Visual Studio с именем LocalizingScriptResources.

  2. Добавьте в проект ссылки на сборки System.Web и System.Web.Extensions.

  3. Добавьте в проект новый файл JScript с именем CheckAnswer.js.

  4. Добавьте следующий код в файл CheckAnswer.js.

    function CheckAnswer()
    {
        var firstInt = $get('firstNumber').innerText;
        var secondInt = $get('secondNumber').innerText;
        var userAnswer = $get('userAnswer');
    
        if ((Number.parseLocale(firstInt) + Number.parseLocale(secondInt)) == userAnswer.value)
        {
            alert(Answer.Correct);
            return true;
        }
        else
        {
            alert(Answer.Incorrect);
            return false;
        }
    }
    
    function CheckAnswer()
    {
        var firstInt = $get('firstNumber').innerText;
        var secondInt = $get('secondNumber').innerText;
        var userAnswer = $get('userAnswer');
    
        if ((Number.parseLocale(firstInt) + Number.parseLocale(secondInt)) == userAnswer.value)
        {
            alert(Answer.Correct);
            return true;
        }
        else
        {
            alert(Answer.Incorrect);
            return false;
        }
    }
    

    В сценарии выполняется проверка вводимого пользователем результата сложения двух чисел. Для оповещения пользователя о правильности ответа используется функция alert сценария. Сообщение, отображаемое в диалоговом окне функции alert, считывается из локализованного ресурса без выполнения обратной передачи на сервер.

    Местозаполнитель Answer используется в сценарии для определения файлов ресурсов, в которых содержатся локализованные строки. Местозаполнитель Answer определяется в этой процедуре ниже.

  5. В окне Свойства файла CheckAnswer.js установите для свойства Действие при построении значение Внедренный ресурс.

    Задать внедренный ресурс для файла сценария

  6. Добавьте в проект класс ClientVerification.

  7. Замените код в файле класса ClientVerification следующим кодом:

    Imports System.Web.UI
    Imports System.Web.UI.WebControls
    Imports System.Resources
    
    Public Class ClientVerification
        Inherits Control
    
        Private _button As Button
        Private _firstLabel As Label
        Private _secondLabel As Label
        Private _answer As TextBox
        Private _firstInt As Int32
        Private _secondInt As Int32
    
    
        Protected Overrides Sub CreateChildControls()
            Dim random = New Random()
            _firstInt = random.Next(0, 20)
            _secondInt = random.Next(0, 20)
    
            Dim rm = New ResourceManager("LocalizingScriptResources.VerificationResources", Me.GetType().Assembly)
            Controls.Clear()
    
            _firstLabel = New Label()
            _firstLabel.ID = "firstNumber"
            _firstLabel.Text = _firstInt.ToString()
    
            _secondLabel = New Label()
            _secondLabel.ID = "secondNumber"
            _secondLabel.Text = _secondInt.ToString()
    
            _answer = New TextBox()
            _answer.ID = "userAnswer"
    
            _button = New Button()
            _button.ID = "Button"
            _button.Text = rm.GetString("Verify")
            _button.OnClientClick = "return CheckAnswer();"
    
            Controls.Add(_firstLabel)
            Controls.Add(New LiteralControl(" + "))
            Controls.Add(_secondLabel)
            Controls.Add(New LiteralControl(" = "))
            Controls.Add(_answer)
            Controls.Add(_button)
        End Sub
    
    End Class
    
    using System;
    using System.Collections.Generic;
    using System.Text;
    using System.Web.UI;
    using System.Web.UI.HtmlControls;
    using System.Web.UI.WebControls;
    using System.Resources;
    
    
    namespace LocalizingScriptResources
    {
        public class ClientVerification : Control
        {
            private Button _button;
            private Label _firstLabel;
            private Label _secondLabel;
            private TextBox _answer;
            private int _firstInt;
            private int _secondInt;
    
            protected override void CreateChildControls()
            {
                Random random = new Random();
                _firstInt = random.Next(0, 20);
                _secondInt = random.Next(0, 20);
    
                ResourceManager rm = new ResourceManager("LocalizingScriptResources.VerificationResources", this.GetType().Assembly);
                Controls.Clear();
    
                _firstLabel = new Label();
                _firstLabel.ID = "firstNumber";
                _firstLabel.Text = _firstInt.ToString();
    
                _secondLabel = new Label();
                _secondLabel.ID = "secondNumber";
                _secondLabel.Text = _secondInt.ToString();
    
                _answer = new TextBox();
                _answer.ID = "userAnswer";
    
                _button = new Button();
                _button.ID = "Button";
                _button.Text = rm.GetString("Verify");
                _button.OnClientClick = "return CheckAnswer();";
    
                Controls.Add(_firstLabel);
                Controls.Add(new LiteralControl(" + "));
                Controls.Add(_secondLabel);
                Controls.Add(new LiteralControl(" = "));
                Controls.Add(_answer);
                Controls.Add(_button);
            }
        }
    }
    

    Этот код используется для создания пользовательского элемента управления ASP.NET. В нем содержатся два элемента управления Label, а также элементы управления TextBox и Button. В коде отображаются два случайных целых числа, а также текстовое поле для ввода ответа. При нажатии кнопки вызывается функция CheckAnswer.

  8. Добавьте в проект файл ресурсов и присвойте ему имя VerificationResources.resx.

  9. Добавьте строковый ресурс Correct со значением «Правильный ответ».

  10. Добавьте строковый ресурс Incorrect со значением «Неверный ответ».

  11. Добавьте строковый ресурс Verify со значением «Проверить ответ».

    Этот ресурс не извлекается с помощью клиентского сценария. Вместо этого ресурс используется для установки значения свойства Text элемента управления Button при его создании.

  12. Сохраните и закройте файл VerificationResources.resx.

  13. Добавьте в проект файл ресурсов с именем VerificationResources.it.resx.

    В этом файле будут содержаться ресурсы на итальянском языке.

  14. Добавьте строковый ресурс Correct со значением «Si, la risposta e’ corretta».

  15. Добавьте строковый ресурс Incorrect со значением «No, la risposta e’ sbagliata».

  16. Добавьте строковый ресурс Verify со значением «Verificare la risposta».

    Как и созданный на русском языке ресурс «Verify», этот ресурс не извлекается с помощью клиентского сценария. Вместо этого он используется для установки значения свойства Text элемента управления Button при его создании.

  17. Сохраните и закройте файл VerificationResources.it.resx.

  18. Добавьте следующую строку в файл AssemblyInfo. В атрибуте ScriptResourceAttribute можно задать любое имя типа, соответствующее используемому в клиентском сценарии имени типа. В этом примере задается имя Answer.

    <Assembly: System.Web.UI.WebResource("LocalizingScriptResources.CheckAnswer.js", "application/x-javascript")> 
    <Assembly: System.Web.UI.ScriptResource("LocalizingScriptResources.CheckAnswer.js", "LocalizingScriptResources.VerificationResources", "Answer")> 
    
    [assembly: System.Web.UI.WebResource("LocalizingScriptResources.CheckAnswer.js", "application/x-javascript")]
    [assembly: System.Web.UI.ScriptResource("LocalizingScriptResources.CheckAnswer.js", "LocalizingScriptResources.VerificationResources", "Answer")]
    
    Bb398868.alert_note(ru-ru,VS.90).gifПримечание.

    Файл AssemblyInfo.vb находится в узле Мой проектобозревателя решений. Если в узле Мой проект не отображаются файлы, в меню Проект, выберите Показать все файлы. Файл AssemblyInfo.cs находится в узле Свойстваобозревателя решений.

    Определение WebResource должно включать используемое по умолчанию пространство имен сборки, а также имя JS-файла. Определение ScriptResource не включает расширения локализованных RESX-файлов.

  19. Выполните построение проекта.

    По завершении компиляции создается сборка с именем LocalizingScriptResources.dll. В эту сборку в качестве ресурсов внедряются код JavaScript из файла CheckAnswer.js и ресурсы из двух RESX-файлов.

    Также создается вспомогательная сборка LocalizingScriptResources.resources.dll, в которой содержатся ресурсы серверного кода на итальянском языке.

Создание ссылок на внедренные сценарии и ресурсы

Созданную сборку можно использовать на веб-узле ASP.NET с поддержкой AJAX. Благодаря этому обеспечивается чтение значений ресурсов и данных из JS-файла в клиентском сценарии.

Bb398868.alert_note(ru-ru,VS.90).gifПримечание.

При необходимости можно создать проект библиотеки классов и веб-узел в одном решении Visual Studio, однако в данном пошаговом руководстве этот вариант не рассматривается. Создание проектов в отдельных решениях имитирует ситуацию, когда разработчик элемента управления и разработчик страницы работают отдельно друг от друга. Однако для удобства можно создать оба проекта в одном решении и внести небольшие поправки в процедуры в пошаговом руководстве.

Создание ссылок на внедренные сценарии и ресурсы

  1. Создайте веб-узел с поддержкой AJAX в Visual Studio.

  2. Создайте папку Bin в корневой папке веб-узла.

  3. Добавьте в папку Bin сборку LocalizingScriptResources.dll из проекта библиотеки классов.

    Bb398868.alert_note(ru-ru,VS.90).gifПримечание.

    Если проект библиотеки классов и веб-узел созданы в одном решении Visual Studio, можно добавить ссылку из проекта библиотеки классов на веб-узел. Дополнительные сведения см. в разделе Практическое руководство. Добавление ссылки на проект Visual Studio к проекту веб-узла.

  4. Создайте папку Bin и присвойте ей имя it (для итальянского языка).

  5. Добавьте вспомогательную библиотеку LocalizingScriptResources.resources.dll из папки it проекта LocalizingScriptResources в папку it веб-узла.

  6. Добавьте в проект новую веб-страницу ASP.NET.

  7. Замените код страницы следующим кодом:

    <%@ Page Language="VB" AutoEventWireup="true" UICulture="auto" Culture="auto" %>
    <%@ Register TagPrefix="Samples" Namespace="LocalizingScriptResources" Assembly="LocalizingScriptResources" %>
    <script runat="server">
    
        Protected Sub Page_Load(ByVal sender As Object, ByVal e As EventArgs)
            If (IsPostBack) Then
                System.Threading.Thread.CurrentThread.CurrentUICulture = System.Globalization.CultureInfo.CreateSpecificCulture(selectLanguage.SelectedValue)
            Else
                selectLanguage.Items.FindByValue(System.Threading.Thread.CurrentThread.CurrentUICulture.TwoLetterISOLanguageName).Selected = True
            End If
        End Sub
    
        Protected Sub selectLanguage_SelectedIndexChanged(ByVal sender As Object, ByVal e As EventArgs)
            System.Threading.Thread.CurrentThread.CurrentUICulture = System.Globalization.CultureInfo.CreateSpecificCulture(selectLanguage.SelectedValue)
        End Sub
    </script>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head id="Head1" runat="server">
        <title>Client Localization Example</title>
    </head>
    <body>
        <form id="form1" runat="server">
            <asp:DropDownList runat="server" AutoPostBack="true" ID="selectLanguage" OnSelectedIndexChanged="selectLanguage_SelectedIndexChanged">
                <asp:ListItem Text="English" Value="en"></asp:ListItem>
                <asp:ListItem Text="Italian" Value="it"></asp:ListItem>
            </asp:DropDownList>
            <br /><br />
            <asp:ScriptManager ID="ScriptManager1" EnableScriptLocalization="true" runat="server">
            <Scripts>
                <asp:ScriptReference Assembly="LocalizingScriptResources" Name="LocalizingScriptResources.CheckAnswer.js" />
            </Scripts>
            </asp:ScriptManager>
            <div>
            <Samples:ClientVerification ID="ClientVerification1" runat="server" ></Samples:ClientVerification>
            </div>
        </form>
    </body>
    </html>
    
    <%@ Page Language="C#" AutoEventWireup="true" UICulture="auto" Culture="auto" %>
    <%@ Register TagPrefix="Samples" Namespace="LocalizingScriptResources" Assembly="LocalizingScriptResources" %>
    <script runat="server">
    
        protected void Page_Load(object sender, EventArgs e)
        {
            if (IsPostBack)
            {
                System.Threading.Thread.CurrentThread.CurrentUICulture = System.Globalization.CultureInfo.CreateSpecificCulture(selectLanguage.SelectedValue);
            }
            else
            {
                selectLanguage.Items.FindByValue(System.Threading.Thread.CurrentThread.CurrentUICulture.TwoLetterISOLanguageName).Selected = true;
            }
        }
    
        protected void selectLanguage_SelectedIndexChanged(object sender, EventArgs e)
        {
            System.Threading.Thread.CurrentThread.CurrentUICulture = System.Globalization.CultureInfo.CreateSpecificCulture(selectLanguage.SelectedValue);
        }
    </script>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <title>Client Localization Example</title>
    </head>
    <body>
        <form id="form1" runat="server">
            <asp:DropDownList runat="server" AutoPostBack="true" ID="selectLanguage" OnSelectedIndexChanged="selectLanguage_SelectedIndexChanged">
                <asp:ListItem Text="English" Value="en"></asp:ListItem>
                <asp:ListItem Text="Italian" Value="it"></asp:ListItem>
            </asp:DropDownList>
            <br /><br />
            <asp:ScriptManager ID="ScriptManager1" EnableScriptLocalization="true" runat="server">
            <Scripts>
                <asp:ScriptReference Assembly="LocalizingScriptResources" Name="LocalizingScriptResources.CheckAnswer.js" />
            </Scripts>
            </asp:ScriptManager>
            <div>
            <Samples:ClientVerification runat="server" ></Samples:ClientVerification>
            </div>
        </form>
    </body>
    </html>
    

    Созданный в проекте LocalizingScriptResources элемент управления включается на страницу. В этом элементе управления отображаются два складываемых числа, а также элемент управления TextBox для ввода ответа пользователем. Также отображается кнопка, при нажатии которой вызывается сценарий в функции CheckAnswer. Функция CheckAnswer выполняется в обозревателе и отображает сообщение о правильности ответа.

    Свойству EnableScriptLocalization объекта ScriptManager следует присвоить значение true. Это обеспечивает загрузку локализованных ресурсов в элемент управления ScriptManager. Чтобы отображать строковые значения в соответствии с параметрами обозревателя, установите автоматический выбор языка и региональных параметров пользовательского интерфейса.

    На странице также представлен элемент управления DropDownList, с помощью которого можно изменить языковые настройки, не изменяя параметры обозревателя. При изменении свойства SelectedIndex элемента управления DropDownList свойству CurrentUICulture экземпляра CurrentThread присваивается выбранное значение.

  8. Запустите проект.

    Отображаются два случайных числа, которые необходимо сложить, а также элемент управления TextBox для ввода ответа. Введите ответ и нажмите кнопку Проверить ответ. Отображается сообщение о правильности ответа. По умолчанию сообщение отображается на русском языке.

    Чтобы отображать сообщение на итальянском языке, выберите его в качестве языка обозревателя. Чтобы изменить язык сообщения, выберите соответствующий язык в элементе управления DropDownList или установите его в параметрах обозревателя.

Итог

В этом пошаговом руководстве описывается порядок включения локализованных строк и внедрения в сборку файла JavaScript в качестве ресурса. Для создания ссылок на внедренный файл сценария и обращения к нему веб-приложение должно включать указанную сборку. Отображение локализованных строк осуществляется на основании языковых параметров обозревателя или выбранного пользователем языка.

См. также

Задачи

Общие сведения о локализации ресурсов для библиотек компонентов

Пошаговое руководство. Добавление локализованных ресурсов в файл JavaScript