如何在单击 asp.net 按钮时复制到客户端剪贴板
How to copy to client clipboard on asp.net button click
我目前正在为项目使用 ASP.NET 4.7 webforms,我正在尝试将后端生成的数据复制到用户客户端计算机。
换句话说,当用户提交表单时,需要将后台生成的代码复制到用户剪贴板。
这是我的尝试。
Application.aspx.cs
.
.
.
protected void Submit(object sender, EventArgs e)
{
try
{
ClientScript.RegisterStartupScript(GetType(), "hwa", "copyToClipboard("+encodedValue+");", true);
}
catch (Exception ex)
{
}
}
Application.aspx
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Application.aspx.cs" Inherits="azureCopyToClipboard.Application" %>
<!DOCTYPE html>
<form id="form1" runat="server">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<div>
<asp:Button ID="SubmitButton" runat="server" class="btn btn-primary " OnClick="Submit" Text="Submit" />
</div>
</body>
</html>
<script type="text/javascript">
function copyToClipboard(textToCopy) {
var textArea;
function isOS() {
//can use a better detection logic here
return navigator.userAgent.match(/ipad|iphone/i);
}
function createTextArea(text) {
textArea = document.createElement('textArea');
textArea.readOnly = true;
textArea.contentEditable = true;
textArea.value = text;
document.body.appendChild(textArea);
}
function selectText() {
var range, selection;
if (isOS()) {
range = document.createRange();
range.selectNodeContents(textArea);
selection = window.getSelection();
selection.removeAllRanges();
selection.addRange(range);
textArea.setSelectionRange(0, 999999);
} else {
textArea.select();
}
}
function copyTo() {
document.execCommand('copy');
document.body.removeChild(textArea);
}
createTextArea(textToCopy);
selectText();
copyTo();
}
</script>
</form>
我正在使用 ClientScript.RegisterStartupScript 调用客户端函数以将编码值粘贴到用户剪贴板...但是由于现代浏览器安全原因,此尝试无效,我也没有获得任何客户端附加到此问题的错误。
我正在努力让这个解决方案同时支持移动和非移动。
不幸的是,大多数浏览器不允许您在没有适当的用户操作(例如在按钮单击事件中)的情况下写入剪贴板。否则,它可能被用于恶意目的;任何网站都可以将他们想要的任何内容写入您的剪贴板,只需访问该网站即可。在你的例子中,你的按钮点击失去了它自己的事件上下文,因为你进行了一个异步 HTTP 操作,并且在你的服务器响应的成功回调函数中,你没有再写入剪贴板的权限。
我的建议是,大多数网站正在做的是;在漂亮的大模态 window 中显示结果代码,带有漂亮的“复制到剪贴板”按钮。
我目前正在为项目使用 ASP.NET 4.7 webforms,我正在尝试将后端生成的数据复制到用户客户端计算机。
换句话说,当用户提交表单时,需要将后台生成的代码复制到用户剪贴板。
这是我的尝试。
Application.aspx.cs
.
.
.
protected void Submit(object sender, EventArgs e)
{
try
{
ClientScript.RegisterStartupScript(GetType(), "hwa", "copyToClipboard("+encodedValue+");", true);
}
catch (Exception ex)
{
}
}
Application.aspx
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Application.aspx.cs" Inherits="azureCopyToClipboard.Application" %>
<!DOCTYPE html>
<form id="form1" runat="server">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<div>
<asp:Button ID="SubmitButton" runat="server" class="btn btn-primary " OnClick="Submit" Text="Submit" />
</div>
</body>
</html>
<script type="text/javascript">
function copyToClipboard(textToCopy) {
var textArea;
function isOS() {
//can use a better detection logic here
return navigator.userAgent.match(/ipad|iphone/i);
}
function createTextArea(text) {
textArea = document.createElement('textArea');
textArea.readOnly = true;
textArea.contentEditable = true;
textArea.value = text;
document.body.appendChild(textArea);
}
function selectText() {
var range, selection;
if (isOS()) {
range = document.createRange();
range.selectNodeContents(textArea);
selection = window.getSelection();
selection.removeAllRanges();
selection.addRange(range);
textArea.setSelectionRange(0, 999999);
} else {
textArea.select();
}
}
function copyTo() {
document.execCommand('copy');
document.body.removeChild(textArea);
}
createTextArea(textToCopy);
selectText();
copyTo();
}
</script>
</form>
我正在使用 ClientScript.RegisterStartupScript 调用客户端函数以将编码值粘贴到用户剪贴板...但是由于现代浏览器安全原因,此尝试无效,我也没有获得任何客户端附加到此问题的错误。
我正在努力让这个解决方案同时支持移动和非移动。
不幸的是,大多数浏览器不允许您在没有适当的用户操作(例如在按钮单击事件中)的情况下写入剪贴板。否则,它可能被用于恶意目的;任何网站都可以将他们想要的任何内容写入您的剪贴板,只需访问该网站即可。在你的例子中,你的按钮点击失去了它自己的事件上下文,因为你进行了一个异步 HTTP 操作,并且在你的服务器响应的成功回调函数中,你没有再写入剪贴板的权限。
我的建议是,大多数网站正在做的是;在漂亮的大模态 window 中显示结果代码,带有漂亮的“复制到剪贴板”按钮。