Silverlight:分包下载及SEO优化方案

一、按模块分包

一般大型的Silverlight应用,都会按模块分解成多个silverlight project,编译后就有多个xap包,然后在需要用到的场景按需加载。我近期开发的这个项目不需要全站Silverlight,而是aspx混合silverlight,说得更白点,就是把相应的子模块xap包嵌入aspx.

这样分包就简单多了:直接用js控制dom元素,修改object元素中的source,动态设置成不同的xap即可实现无刷新的加载不同模块。(这比网上主流的方式:用WebClient动态下载xap包,最终再反射加载,个人觉得更简单。当然,这种方式不适用于整站Silverlight的项目)

二、按需反射加载xap中的页面

上面讨论的办法,只是解决了按需加载不同的xap文件,但是如果一个xap中有多个页面,如何确定加载某个xap后,显示其中的哪个页面呢?

答案:参数传入+反射

silvelright以object标签嵌入html时,可以指定一些传入参数,类似下面这样:

<object data="data:application/x-silverlight-2," type="application/x-silverlight-2"
            width="100%" height="100%">
            <param name="source" value="ClientBin/Basic.xap" />
            <param name="onError" value="onSilverlightError" />
            <param name="background" value="white" />
            <param name="minRuntimeVersion" value="4.0.50826.0" />
            <param name="autoUpgrade" value="true" />
            <param name="initParams" value="page=Basic.City" />
            <a href="http://go.microsoft.com/fwlink/?LinkID=149156&v=4.0.50826.0" style="text-decoration: none">
                <img src="http://go.microsoft.com/fwlink/?LinkId=161376" alt="Get Microsoft Silverlight"
                    style="border-style: none" />
            </a>
        </object>

注意其中的<param name="initParams" value="page=Basic.City"/>这表明我们想让City页面在加载成功后显示。

那么,SL中如何接受这个参数呢?看下面的代码:

        private void Application_Startup(object sender, StartupEventArgs e)
        {
            //检测有无传入参数
            if (e.InitParams != null && e.InitParams.ContainsKey("page"))
            {
                string _pageName = e.InitParams["page"];
                //根据page参数,动态反射加载相应的实例
                Assembly asm = this.GetType().Assembly;
                UserControl _page = asm.CreateInstance(_pageName) as UserControl;
                this.RootVisual  = _page;
            }
            else
            {
                //如果没有参数传入,则显示默认页面
                this.RootVisual = new Airport();
            }
        }

三、SEO优化

这是RIA应用经常会遇到的一个问题,前面提到的处理方法并未涉及这一块,默认情况下:xap模块的动态加载,以及根据参数动态反射加载不同页面,都不会改变浏览器的地址,所以搜索引擎会始终认为这是一个页面,最终也只能收录一个网址。

为了对搜索引擎更友好,可以在地址栏的#部分做些手脚,最终要到达的效果:

如果动态加载Basic.xap模块,且显示该模块中的City页面时,我们可以让地址栏类似: http://localhost:1223/Default.aspx#Basic|Basic.City

切换到User.xap模块(即用户管理模块),且显示该模块中的User页面时,我们可以让地址栏类似:http://localhost:1223/Default.aspx#User|User.User

这样,虽然都是同一个default.aspx页面,但是搜索引擎却认为这是二个不同的url,会搜录二个地址。

default.aspx完整代码如下:

<%@ Page Language="c#" AutoEventWireup="true" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Silverlight SEO优化及分包下载</title>
    <style type="text/css">
        html, body
        {
            height: 100%;
            overflow: auto;
            font-size:12px;
        }
        body
        {
            padding: 0;
            margin: 0;
        }
        #silverlightControlHost
        {
            height: 100%;
            text-align: center;
        }
        #nav
        {
            line-height:30px;
            text-align: center;
            background: #efefef;
            padding: 5px;
        }
        #nav a
        {
            padding: 0px 10px;

        }
    </style>
    <script type="text/javascript" src="Silverlight.js"></script>
    <script type="text/javascript" src="jquery-1.6.4.min.js"></script>
    <script type="text/javascript">
        function onSilverlightError(sender, args) {
            var appSource = "";
            if (sender != null && sender != 0) {
                appSource = sender.getHost().Source;
            }

            var errorType = args.ErrorType;
            var iErrorCode = args.ErrorCode;

            if (errorType == "ImageError" || errorType == "MediaError") {
                return;
            }

            var errMsg = "Unhandled Error in Silverlight Application " + appSource + "\n";

            errMsg += "Code: " + iErrorCode + "    \n";
            errMsg += "Category: " + errorType + "       \n";
            errMsg += "Message: " + args.ErrorMessage + "     \n";

            if (errorType == "ParserError") {
                errMsg += "File: " + args.xamlFile + "     \n";
                errMsg += "Line: " + args.lineNumber + "     \n";
                errMsg += "Position: " + args.charPosition + "     \n";
            }
            else if (errorType == "RuntimeError") {
                if (args.lineNumber != 0) {
                    errMsg += "Line: " + args.lineNumber + "     \n";
                    errMsg += "Position: " + args.charPosition + "     \n";
                }
                errMsg += "MethodName: " + args.methodName + "     \n";
            }

            throw new Error(errMsg);
        }

        //加载Silverlight
        function loadSilverlight(url) {
            if (url.indexOf("#") == -1) {return;}
            var _param = url.split('#')[1];
            var _sl = document.getElementById("sl");
            var _xap = _param.split('|')[0] + ".xap";
            var _page = _param.split('|')[1];
            _sl.innerHTML = "<object data='data:application/x-silverlight-2,' type='application/x-silverlight-2' width='100%' height='100%'><param name='source' value='ClientBin/" + _xap + "' /><param name='onError' value='onSilverlightError' /><param name='background' value='white' /><param name='minRuntimeVersion' value='4.0.50826.0' /><param name='autoUpgrade' value='true' /><param name='initParams' value='page=" + _page + "' /><a href='http://go.microsoft.com/fwlink/?LinkID=149156&v=4.0.50826.0' style='text-decoration: none'><img src='http://go.microsoft.com/fwlink/?LinkId=161376' alt='Get Microsoft Silverlight' style='border-style: none' /></a></object>";
        }

        $().ready(function () {
            loadSilverlight(window.location.href);
        })
    </script>
</head>
<body>
    <form id="form1" runat="server" style="height: 100%">
    <div id="silverlightControlHost">
        <div id="nav">
        Silvelight分包以及SEO示例 (by 菩提树下的杨过 http://yjmyzz.cnblogs.com/):<br/>
            <a href="#Basic|Basic.City" onclick="loadSilverlight(this.href)">城市管理</a> | <a href="#Basic|Basic.Airport" onclick="loadSilverlight(this.href)">航站管理</a> |
            <a href="#User|User.User" onclick="loadSilverlight(this.href)">用户管理</a> | <a href="#User|User.Organization" onclick="loadSilverlight(this.href)">组织机构管理</a>
        </div>
        <div id="sl">
        <object data="data:application/x-silverlight-2," type="application/x-silverlight-2"
            width="100%" height="100%">
            <param name="source" value="ClientBin/Basic.xap" />
            <param name="onError" value="onSilverlightError" />
            <param name="background" value="white" />
            <param name="minRuntimeVersion" value="4.0.50826.0" />
            <param name="autoUpgrade" value="true" />
            <param name="initParams" value="page=Basic.City" />
            <a href="http://go.microsoft.com/fwlink/?LinkID=149156&v=4.0.50826.0" style="text-decoration: none">
                <img src="http://go.microsoft.com/fwlink/?LinkId=161376" alt="Get Microsoft Silverlight"
                    style="border-style: none" />
            </a>
        </object>
        </div>
        <iframe id="_sl_historyFrame" style="visibility: hidden; height: 0px; width: 0px;
            border: 0px"></iframe>
    </div>
    </form>
</body>
</html>

 示例源代码: http://files.cnblogs.com/yjmyzz/ReflectorXap.7z 

时间: 2024-07-31 17:22:41

Silverlight:分包下载及SEO优化方案的相关文章

通过5W2H分析法做SEO优化方案

SEO优化方案,个人站长倒是无所谓,但是对于参加SEO工作或者是SEO接单来说,SEO优化方案它是比不可少的,那么我们怎样书写SEO优化方案呢?这里本人给大家分享5W2H方法来写方案. 什么是5W2H,它是二战中美国陆军兵器修理部首创的一种方法,现广泛应用于企业管理中,具体含义为: WHAT:做什么?目的是什么?我们做SEO优化方案首先就应该确定我们要做什么.提升关键字排名?解决网站降权问题?网站推广?关键词排名达到什么样的程度?等等,做事情之前我们要知道我们做什么,目的是什么?这也是最基本的,

经验分享:SEO优化方案书怎么写

现在很多SEOer进入一个公司的第一件事就是熟悉公司,第二步恐怕就要写优化方案了吧,下面是我进入公司写的SEO方案.如果你是老鸟就一飘而过吧,希望对新手有一定的帮助. 金富网站SEO优化方案 一.网站基本信息 1.搜索引擎收录情况 分析:各大搜索引擎收录良好,快照较慢,解决办法:每天更新网站,发布产品信息或者新闻信息. 2.网站权重及流量分析 网站百度权重截图: 百度首页暂时没有搜索量较高的关键词. 网站流量截图: 网站自开通统计以来,历史最高IP为30,每日平均13,还有待提升. 二.网站优化

浅谈网站SEO优化方案的写作方法(一)

做网站SEO优化写方案很重要,不论是自己网站做seo,还是seo接单帮别人做优化,写一份可行性好的SEO优化方案都是有必要的.那么网站SEO方案该怎么写呢?要注意哪些问题呢?看下文. 现有网站SEO方案写法: 1.首页关键词诊断,现有网站SEO诊断 关键词是一个网站seo优化的重点,从网站的用途来重新审视网站的关键词是做好SEO网站优化方案的基础. 2.网站目录的seo诊断 目录是网站的重要内链组成部分,目录的合理设置是决定网站SEO优化成功的关键. 3.网站目录外的内部链接诊断 内部链接是网站

惠州SEO博客的网站SEO优化方案

下面是叶剑辉对惠州SEO博客写的一份网站SEO优化方案,供各位朋友在制定相关网站SEO优化方案时作参考! 一.网站定位 惠州SEO博客(http://www.huizhouseo.cn/)是一个个人的SEO博客,是惠州SEO叶剑辉用于关注网站SEO与网站运营,并通过其进行网站SEO优化实践与网站运营策划研究. 目标与思路:惠州SEO博客通过各种手段的进行推广,并对网站关键词进行优化,从而带来流量,达到自我实践并自我推广的效果. 确定关键词 由于惠州SEO博客是一个个人的SEO博客,其更多的关注与

浅谈网站SEO优化方案的写作方法(二)

前段时间写了SEO优化方案一,从一些基本SEO优化的方面列举了SEO优化方案的写法.随着SEO市场的发展,简单的SEO方案已经没有竞争力,只有通过探索,写出有创意,执行性高的优化方案,才能在SEO工作和市场竞争中取得胜利,那怎样写出有竞争力的SEO优化方案呢?本文主要从以下五个方面来回答这个问题. 1.从全局出发,布局SEO优化执行方法 写方案,最终能否顺利的执行是最关键的一点.通过对网站,网站价值,网站浏览者的调查了解,整合有必要的SEO优化资源,通过对资源整体的合理布局,不仅能在以后的方案执

个人经验总结seo优化方案的七个关键点

一:网站的定位 网站的定位主要指我们要根据我们做的行业来做好前期的规划,例如:我们是应该选择怎样竞争度的关键词?选择的盈利模式是怎样的? 关键词的挖掘 指我们在网站建设前期挖掘大量的关键词,然后进行针对性的筛选,从筛选中的来确定好早期的目标关键词和长尾关键词,我们在选择目标关键词和长尾关键词的时候一定要考虑两个重要因素. (1).关键词的转化率 (2).关键词的流量我们要选择的关键词一定是要这两个因素都能够达到综合要求才行. 我们根据这2个要求来选择我们的要做的目标关键词和长尾关键词. 盈利模式

干货:一个网站完整详细的SEO优化方案

根据自己的个人经验完成了这篇文章,希望对SEOer有点帮助,高手直接跳过,请勿喷水...一个完整的SEO优化方案主要由四个小组组成:一.前端/页编人员二.内容编辑人员三.推广人员四.数据分析人员接下来,我们就对这四个小组分配工作.首先,前端/页编人员主要负责站内优化,主要从四个方面入手:第一个,站内结构优化合理规划站点结构(1.扁平化结构 2.辅助导航.面包屑导航.次导航)内容页结构设置(最新文章.推荐文章.热门文章.增加相关性.方便自助根据链接抓取更多内容)较快的加载速度简洁的页面结构第二个,

个人总结:如何订制SEO优化方案

在SEO这一行也有三年时间,自己也做方案的心得,不过,有很细节需要我们注意.北京旅行社如下:个人经验总结seo优化方案的七个关键点分享. 一:网站的定位 网站的定位主要指我们要根据我们做的行业来做好前期的规划,例如:我们是应该选择怎样竞争度的关键词?选择的盈利模式是怎样的? 关键词的挖掘 指我们在网站建设前期挖掘大量的关键词,然后进行针对性的筛选,从筛选中的来确定好早期的目标关键词和长尾关键词,我们在选择目标关键词和长尾关键词的时候一定要考虑两个重要因素. (1).关键词的转化率 (2).关键词

金富网站SEO优化方案

摘要: 现在很多SEOer进入一个公司的第一件事就是熟悉公司,第二步恐怕就要写优化方案了吧,下面是我进入公司写的SEO方案.如果你是老鸟就一飘而过吧,希望对新手有一定的帮助. 金富网 现在很多SEOer进入一个公司的第一件事就是熟悉公司,第二步恐怕就要写优化方案了吧,下面是我进入公司写的SEO方案.如果你是老鸟就一飘而过吧,希望对新手有一定的帮助. 金富网站SEO优化方案 一.网站基本信息 1.搜索引擎收录情况 分析:各大搜索引擎收录良好,快照较慢,解决办法:每天更新网站,发布产品信息或者新闻信