跨瀏覽器的剪貼板訪問解決方案


在IE中,JS可以直接訪問剪貼板,但是firefox,chrome等其它"高級"瀏覽器,就沒這么幸運了。網上流傳的所謂兼容firefox/IE的剪貼板訪問javascript代碼,都是N年前的往事了。

根據http://mozilla.com.cn/post/49413/ 上的說法:

----------------------------------

火狐不允許網頁操作用戶的剪切板,因為有安全問題,網頁可能盜用你復制的密碼等等。

以前可以通過修改設置提權,允許網頁獲得高權限,操作剪切板,目前火狐已經取消了這個接口。不再允許,所以修改了設置也無效,目前還是自己通過快捷鍵復制吧。

----------------------------------

看來通過"純js"來達到“一統天下”,至少在剪貼板這一問題上,已經是不可能了.

幸好,我們還有Flash/Silverlight這一類插件可以解決這一問題。Flash和Silverlight都內置了剪貼板的訪問接口,zClip就是利用flash來解決這一問題的免費項目:

http://www.steamdev.com/zclip/

其原理是在目標元素上疊加一個透明的flash,點擊目標元素時,其實就是把flash激活了,然后通過flash內部的剪貼板訪問接口實現 復制到剪貼板 功能.

整個flash 1K + js 7K,一共約8K大小,已經能圓滿解決該問題。

但是事情並沒有就此止步,如果你還想進一步減少附加文件的大小,或者檢驗"自己動手,豐衣足食"的樂趣,下面給出了Silverlight的解決方案:

一、創建一個新Silverliight項目,里面就放一個MainPage,然后在MainPage.xaml.cs里,把對剪貼板的讀寫方法暴露出來

using System;
using System.Windows;
using System.Windows.Browser;
using System.Windows.Controls;

namespace ClipboardTools
{
    public partial class MainPage : UserControl
    {
        public MainPage()
        {
            InitializeComponent();
        }

        /// <summary>
        /// 設置剪貼板文本
        /// </summary>
        /// <param name="text"></param>
        /// <returns></returns>
        [ScriptableMember()]
        public bool SetText(string text)
        {
            try
            {
                Clipboard.SetText(text);
                return true;
            }
            catch (Exception e)
            {
                System.Diagnostics.Debug.WriteLine(e.Message);
                return false;
            }
        }

        /// <summary>
        /// 獲取剪貼板文本
        /// </summary>
        /// <returns></returns>
        [ScriptableMember()]
        public string GetText()
        {
            try
            {
                return Clipboard.GetText();
               
            }
            catch (Exception e)
            {
                System.Diagnostics.Debug.WriteLine(e.Message);
                return "";
            }
        }


        /// <summary>
        /// 測試剪貼板里是否有內容
        /// </summary>
        /// <returns></returns>
        [ScriptableMember()]
        public bool ContainsText()
        {
            return Clipboard.ContainsText();
        }
       
    }
}

 然后在App.xaml.cs里注冊一下:

        private void Application_Startup(object sender, StartupEventArgs e)
        {
            MainPage mp = new MainPage();
            this.RootVisual = mp;
            HtmlPage.RegisterScriptableObject("JsHandler", mp);
        }

 如果是Silverlight5,注冊把下面這個選項勾上,以允許一些需要高權限的操作在瀏覽器中運行

二、web頁面上使用代碼示例:

<!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>Clipboard</title>
    <style type="text/css">
        html, body { height: 100%; overflow: auto;margin: 0;padding:0 }
        #silverlightControlHost { height: 0px;width: 0px; }
        button{ width: 75px;margin-left:5px}
    </style>
</head>
<body>
    <div id="silverlightControlHost">
        <object data="data:application/x-silverlight-2," type="application/x-silverlight-2"
            width="100%" height="100%">
            <param name="source" value="ClientBin/Clipboard.xap" />
            <param name="onError" value="onSilverlightError" />
            <param name="background" value="white" />
            <param name="minRuntimeVersion" value="5.0.61118.0" />
            <param name="onLoad" value="SilverlightLoaded" />
            <param name="autoUpgrade" value="false" />
        </object>
      </div>
    <script type="text/javascript">
      var slCtl = null;
        function SilverlightLoaded(sender) {
            slCtl = sender.getHost();
        }

        function setText(text) {
            if (slCtl != null) {
                var s = slCtl.Content.JsHandler.SetText(text);
                if (s) {
                    alert(text + "\n\n已復制到剪貼板!");
                    return true;
                } else {
                    alert("復制到剪貼板失敗!");
                    return true;
                }
            }
            alert("Silverlight加載失敗!");
            return false;
        }


        function getText() {
            if (slCtl != null) {
                return slCtl.Content.JsHandler.GetText();
            }
            return "";
        }

        
    </script>
    <div style="margin:10px">
        <input type="text" id="txtSrc" value="Sample Text"/>
        <button id="btnCopy" onclick="setText(document.getElementById('txtSrc').value)">copy</button>
        <button id="btnSet" onclick="alert(getText())">get</button>
    </div>
</body>
</html>

silverlight編譯后的xap約4K,js代碼不足1K,一共5k左右 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM