sunnuntai 16. marraskuuta 2008

C# ja JavaScript

Usein tulee vastaan tilanteita jolloin selainohjelman tekeminen esim. yrityksen sisäiseen käyttöön tuntuu järkevältä. Selaimet ovat mm. erittäin hyviä käsittelemään isoja määriä kuvia. Ne mukavasti lataavat kuvat streamaamalla ja pysyvät interaktiivisina isojenkin kuva määrien kanssa.

Nettiselain on kuitenkin tehty turvalliseksi ja niistä ei ole pääsyä asiakaskoneeseen. Paikallisessa käytössä se on kuitenkin usein toivottua ja tarpaallista.
Internet Explorer kylläkin tarjoaa ActiveX:n kautta pääsyn Windowsiin, mutta siihen on myös toinenkin keino.

C# tai ylipäätään kaikki .NET kielet tarjoavat WebBrowser komponentin, jolla voidaan omaan .NET ohjelmaan upottaa webbiselain ja kirjottaa sen päälle omaa koodia. Kuitenkin on lievästi hankalaa saada HTML sivulta tietoa .NET ohjelmaasi. Usein varmasti haluaisit saada tiedon esim. siitä onko käyttäjä painanut nappia ja mitä asetuksia hän on sivulle laittanut.

Eli voidaksemme käyttää .NET:iä laajentamaan selaimen toimintaa pitää meidän kirjoittaa oma .NET ohjelma. Ohjelman pitää sisältää WebBrowser komponentti, joka löytyy System.Windows.Forms.WebBrowser
http://msdn.microsoft.com/en-us/library/system.windows.forms.webbrowser.aspx

C# koodia

using System;
using System.Collections.Generic;
using System.Drawing;
using System.Windows.Forms;

namespace WebpageTest
{
public partial class MainForm : Form
{
WebBrowser m_wb = new WebBrowser();

public MainForm()
{
InitializeComponent();

m_wb.DocumentCompleted +=
new WebBrowserDocumentCompletedEventHandler(
this.wb_OnDocumentComplete );
m_wb.ObjectForScripting = new JavaScript();
m_wb.Dock = DockStyle.Fill;
this.Controls.Add( m_wb );

try
{
m_wb.Url = new Uri( Application.StartupPath +
"/example.html");
}
catch ( Exception e )
{
MessageBox.Show ( e.Message );
}
}

public void wb_OnDocumentComplete(object sender,
System.EventArgs e)
{
m_wb.Document.InvokeScript ("testDotNet", null );
}
}
}


Ohjelma on yksinkertainen, mutta käydään silti joitain kohtia läpi.
m_wb.DocumentCompleted += 
new WebBrowserDocumentCompletedEventHandler(
this.wb_OnDocumentComplete );

Kun HTML tiedosto on ladattu siitä lähetetään DocumentCompleted tapahtuma. Tämä rivi kertoo ohjelmalle, että haluamme tapahtuman käsiteltävän funktiossa wb_OnDocumentComplete(). Tämä on tärkeää, koska emme halua yrittää kutsua JavaScript funktioita ennen, kuin sivu on ladattu.

m_wb.ObjectForScripting = new JavaScript();

Rivi kertoo WebBrowser komponentille, että mihin olioon internet sivulla oleva scripti voi päästä käsiksi.

m_wb.Document.InvokeScript ("testDotNet", null );

DocumentComplete tapahtuman käsittelevässä funktiossa oleva rivi. Komentaa WebBrowseria ajamaan scriptiä. Tässä tapaauksessa ajamme testDotNet() funktion ilman funktioparametreja.

.NET ohjelma tarvitsee vielä JavaScript olion. Eli olion, joka näkyy nettisivulla olevalle JavaScriptille. Olion nimi voi olla mitä vain, mutta itse käytän nimeä JavaScript.

C# koodia


using System;
using System.Windows.Forms;

namespace WebpageTest
{
[System.Runtime.InteropServices.ComVisible(true)]
public class JavaScript
{
public JavaScript()
{
}

public void testJS( int iId )
{
MessageBox.Show( iId.ToString() );
}
}
}


Luokka on simppeli, jossa on vain yksi methodi testJS( int id ). Tätä methodia voidaan kutsua nettisivulta. Huomaa, että luokan pitää olla näkyvissä COM:lle.
[System.Runtime.InteropServices.ComVisible(true)]


Lopuksi vielä pieni nettisivu, joka osaa käyttää .NET koodia. Huomaa, että sivu on ajettava .NET ohjelmasi kautta, jotta oma koodisi toimii.

HTML koodia


<html>
<head>
<title>.NET example</title>
<style type="text/css">
p.option
{
cursor:pointer;
}
</style>
<script type="text/javascript">
function testDotNet()
{
alert ("Dot net made this function call.");
}

function OnClick(id)
{
window.external.testJS( id )
}
</script>
</head>
<body>
<p class="option" onClick="OnClick(1);">Option 1</p>
<p class="option" onClick="OnClick(2);">Option 2</p>
<p class="option" onClick="OnClick(3);">Option 3</p>
</body>
</html>

Ei kommentteja: