tzfun / vue-web-terminal

A beautiful web-side command line window plugin (simulating a terminal).
https://tzfun.github.io/vue-web-terminal/
Apache License 2.0
234 stars 25 forks source link

I can not paste content by right click. #67

Closed birenjack closed 7 months ago

birenjack commented 7 months ago

Bug description I can not paste content by right click.

Steps to reproduce Steps to reproduce the behavior:

  1. select some text
  2. right click
  3. I can not see my copied text

Screenshot

image

Reproduce environment:

Detailed Description I want copy and paste is like linux system, by the way, the copy and paste function doee not work well in lastest chrome, image look there, I it get empty text when I right click.

so I think, can we use other methods to copy and paste?

tzfun commented 7 months ago

I need you to provide some details to help me locate the problem:

  1. What is the version number of your terminal plug-in? 2.x or 3.x?
  2. What is your chrome version number?

I hope the following information is helpful to you.

Tip 1: Reading the clipboard content in the browser requires two conditions to be met at the same time:

  1. The web page address must be https or localhost
  2. The user clicks to agree to the browser reading the clipboard contents.

Tip 2: When you get the plug-in focus, you can use the native ctrl/command + v to paste content directly into the input box, which is no different from when you usually use other input forms.

tzfun commented 7 months ago

In addition, after testing, there are indeed some problems in using right-click to copy content on some devices (such as Safari). Currently, copy can only use right-click to copy content. The native method ctrl/command + c will be provided in the next version.

birenjack commented 7 months ago

I need you to provide some details to help me locate the problem:

  1. What is the version number of your terminal plug-in? 2.x or 3.x?
  2. What is your chrome version number?

I hope the following information is helpful to you.

Tip 1: Reading the clipboard content in the browser requires two conditions to be met at the same time:

  1. The web page address must be https or localhost
  2. The user clicks to agree to the browser reading the clipboard contents.

Tip 2: When you get the plug-in focus, you can use the native ctrl/command + v to paste content directly into the input box, which is no different from when you usually use other input forms.

the version is 3.x. the chrome version info is here "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/119.0.0.0 Safari/537.36".

I got this, I run my project with ip but not with localhost or 127.0.0.1, so I can not use paste function.

I will test it with https, it may works. thank you.

My teammates wish it works like linux.

wish it can grow more better

birenjack commented 7 months ago

我看了你的源代码,你应该看得懂中文。 这边在鼠标右键的时候,我看代码里面是先放在剪切板里面,然后第二次右键的时候,才去执行这个粘贴的操作。 为啥不可以,第一次点击右键的时候就去粘贴内容到命令行? 我们linux上的使用一般也是选中,然后鼠标右键就是粘贴了。 其次,像linux tab自动补全的功能可以支持么。 或者给我们一个api,我们可以调用,我看现在有一个 tab-key-handler 这个api, 它的回调的第一个参数是Event对象,如果我来实现tab补全的功能,我们可能更希望是返回当前输入的命令对不对。 谢谢老铁

tzfun commented 7 months ago

我看了你的源代码,你应该看得懂中文。 这边在鼠标右键的时候,我看代码里面是先放在剪切板里面,然后第二次右键的时候,才去执行这个粘贴的操作。 为啥不可以,第一次点击右键的时候就去粘贴内容到命令行? 我们linux上的使用一般也是选中,然后鼠标右键就是粘贴了。 其次,像linux tab自动补全的功能可以支持么。 或者给我们一个api,我们可以调用,我看现在有一个 tab-key-handler 这个api, 它的回调的第一个参数是Event对象,如果我来实现tab补全的功能,我们可能更希望是返回当前输入的命令对不对。 谢谢老铁

插件的设定并没有先放在剪切板里再粘贴这个逻辑,在你截图的这一段代码里面,是为了兼容不提供navigator API的浏览器,在这种浏览器中只能模拟从剪切板粘贴到input再从input读取内容来实现读取剪切板内容,但这个逻辑不一定成功,因为可能会被浏览器的脚本限制条件屏蔽(比如chrome、safari),你如果使用的是chrome如果执行到了这一段代码,原因应该是下面其中之一:

  1. 网页不是https协议,chrome频闭了http网页的navigator接口或其中的clipboard接口,只有在https页面才能通过navigator读取剪切板内容
  2. 网页host不是localhost127.0.0.1
  3. 浏览器向用户询问读取剪切板内容时,用户点击了拒绝

目前大部分浏览器为了满足用户隐私保护合规性政策,读取用户剪切板内容必须在安全的环境得到用户的确认才行。

tzfun commented 7 months ago

第二个tab-key-handler的建议非常不错,可以在下个版本优化该方法。

以我的理解,增加一个修改当前正在输入的指令回调是不是就可以满足你的需求?

birenjack commented 7 months ago

我看了你的源代码,你应该看得懂中文。 这边在鼠标右键的时候,我看代码里面是先放在剪切板里面,然后第二次右键的时候,才去执行这个粘贴的操作。 为啥不可以,第一次点击右键的时候就去粘贴内容到命令行? 我们linux上的使用一般也是选中,然后鼠标右键就是粘贴了。 其次,像linux tab自动补全的功能可以支持么。 或者给我们一个api,我们可以调用,我看现在有一个 tab-key-handler 这个api, 它的回调的第一个参数是Event对象,如果我来实现tab补全的功能,我们可能更希望是返回当前输入的命令对不对。 谢谢老铁

插件的设定并没有先放在剪切板里再粘贴这个逻辑,在你截图的这一段代码里面,是为了兼容不提供navigator API的浏览器,在这种浏览器中只能模拟从剪切板粘贴到input再从input读取内容来实现读取剪切板内容,但这个逻辑不一定成功,因为可能会被浏览器的脚本限制条件屏蔽(比如chrome、safari),你如果使用的是chrome如果执行到了这一段代码,原因应该是下面其中之一:

  1. 网页不是https协议,chrome频闭了http网页的navigator接口或其中的clipboard接口,只有在https页面才能通过navigator读取剪切板内容
  2. 网页host不是localhost127.0.0.1
  3. 浏览器向用户询问读取剪切板内容时,用户点击了拒绝

目前大部分浏览器为了满足用户隐私保护合规性政策,读取用户剪切板内容必须在安全的环境得到用户的确认才行。

是的,截图部分代码的问题我是没有疑问了。 “插件的设定并没有先放在剪切板里再粘贴这个逻辑”, 这句话我理解的不太清楚,我只是想更像linux上一样,选中,然后右键直接就粘贴到命令行上面了,不需要两次,我不太理解为啥要两次才可以粘贴,当时考虑的点是啥,望大佬指点一下。 image 这个是我操作linux的截图,选中,右键,就可以粘贴了

birenjack commented 7 months ago

第二个tab-key-handler的建议非常不错,可以在下个版本优化该方法。

以我的理解,增加一个修改当前正在输入的指令回调是不是就可以满足你的需求?

谢谢哈,感觉应该有操作空间,到时候有这个api的话,我可以试试,谢谢大佬

tzfun commented 7 months ago

我看了你的源代码,你应该看得懂中文。 这边在鼠标右键的时候,我看代码里面是先放在剪切板里面,然后第二次右键的时候,才去执行这个粘贴的操作。 为啥不可以,第一次点击右键的时候就去粘贴内容到命令行? 我们linux上的使用一般也是选中,然后鼠标右键就是粘贴了。 其次,像linux tab自动补全的功能可以支持么。 或者给我们一个api,我们可以调用,我看现在有一个 tab-key-handler 这个api, 它的回调的第一个参数是Event对象,如果我来实现tab补全的功能,我们可能更希望是返回当前输入的命令对不对。 谢谢老铁

插件的设定并没有先放在剪切板里再粘贴这个逻辑,在你截图的这一段代码里面,是为了兼容不提供navigator API的浏览器,在这种浏览器中只能模拟从剪切板粘贴到input再从input读取内容来实现读取剪切板内容,但这个逻辑不一定成功,因为可能会被浏览器的脚本限制条件屏蔽(比如chrome、safari),你如果使用的是chrome如果执行到了这一段代码,原因应该是下面其中之一:

  1. 网页不是https协议,chrome频闭了http网页的navigator接口或其中的clipboard接口,只有在https页面才能通过navigator读取剪切板内容
  2. 网页host不是localhost127.0.0.1
  3. 浏览器向用户询问读取剪切板内容时,用户点击了拒绝

目前大部分浏览器为了满足用户隐私保护合规性政策,读取用户剪切板内容必须在安全的环境得到用户的确认才行。

是的,截图部分代码的问题我是没有疑问了。 “插件的设定并没有先放在剪切板里再粘贴这个逻辑”, 这句话我理解的不太清楚,我只是想更像linux上一样,选中,然后右键直接就粘贴到命令行上面了,不需要两次,我不太理解为啥要两次才可以粘贴,当时考虑的点是啥,望大佬指点一下。 image 这个是我操作linux的截图,选中,右键,就可以粘贴了

这个其实是个人喜好的选择,我设计的时候没有参考linux的实现,是参考windows cmd的复制粘贴功能。

birenjack commented 7 months ago

我看了你的源代码,你应该看得懂中文。 这边在鼠标右键的时候,我看代码里面是先放在剪切板里面,然后第二次右键的时候,才去执行这个粘贴的操作。 为啥不可以,第一次点击右键的时候就去粘贴内容到命令行? 我们linux上的使用一般也是选中,然后鼠标右键就是粘贴了。 其次,像linux tab自动补全的功能可以支持么。 或者给我们一个api,我们可以调用,我看现在有一个 tab-key-handler 这个api, 它的回调的第一个参数是Event对象,如果我来实现tab补全的功能,我们可能更希望是返回当前输入的命令对不对。 谢谢老铁

插件的设定并没有先放在剪切板里再粘贴这个逻辑,在你截图的这一段代码里面,是为了兼容不提供navigator API的浏览器,在这种浏览器中只能模拟从剪切板粘贴到input再从input读取内容来实现读取剪切板内容,但这个逻辑不一定成功,因为可能会被浏览器的脚本限制条件屏蔽(比如chrome、safari),你如果使用的是chrome如果执行到了这一段代码,原因应该是下面其中之一:

  1. 网页不是https协议,chrome频闭了http网页的navigator接口或其中的clipboard接口,只有在https页面才能通过navigator读取剪切板内容
  2. 网页host不是localhost127.0.0.1
  3. 浏览器向用户询问读取剪切板内容时,用户点击了拒绝

目前大部分浏览器为了满足用户隐私保护合规性政策,读取用户剪切板内容必须在安全的环境得到用户的确认才行。

是的,截图部分代码的问题我是没有疑问了。 “插件的设定并没有先放在剪切板里再粘贴这个逻辑”, 这句话我理解的不太清楚,我只是想更像linux上一样,选中,然后右键直接就粘贴到命令行上面了,不需要两次,我不太理解为啥要两次才可以粘贴,当时考虑的点是啥,望大佬指点一下。 image 这个是我操作linux的截图,选中,右键,就可以粘贴了

这个其实是个人喜好的选择,我设计的时候没有参考linux的实现,是参考windows cmd的复制粘贴功能。

感觉可以增加一个option, mode = 'linux', 默认是不填,或者是default, 然后,如果是linux的话,在处理右键操作的时候,允许直接粘贴,怎么样? 以后也可以在这个mode上多扩展,或者兼容,怎么样?

tzfun commented 7 months ago

感觉可以增加一个option, mode = 'linux', 默认是不填,或者是default, 然后,如果是linux的话,在处理右键操作的时候,允许直接粘贴,怎么样? 以后也可以在这个mode上多扩展,或者兼容,怎么样?

这个只是复制粘贴的模式,不太好归类为linux,因为linux并没有官方的term实现标准,你这个应该是某一个terminal实现的功能,并不是所有的linux terminal都是这样的,同时你这个terminal的右键模式会带来一个问题:如果用户只是想复制选中的内容并不想将它粘贴到命令行怎么办?

birenjack commented 7 months ago

感觉可以增加一个option, mode = 'linux', 默认是不填,或者是default, 然后,如果是linux的话,在处理右键操作的时候,允许直接粘贴,怎么样? 以后也可以在这个mode上多扩展,或者兼容,怎么样?

这个只是复制粘贴的模式,不太好归类为linux,因为linux并没有官方的term实现标准,你这个应该是某一个terminal实现的功能,并不是所有的linux terminal都是这样的,同时你这个terminal的右键模式会带来一个问题:如果用户只是想复制选中的内容并不想将它粘贴到命令行怎么办?

okok,那我先关了哈,到时候那个tab的事件改了可以和我说下哈,谢谢大佬指点

tzfun commented 7 months ago

okok,那我先关了哈,到时候那个tab的事件改了可以和我说下哈,谢谢大佬指点

好的,tab-key-handler接口关注另一个issue就可以了

birenjack commented 7 months ago

okok,那我先关了哈,到时候那个tab的事件改了可以和我说下哈,谢谢大佬指点

好的,tab-key-handler接口关注另一个issue就可以了

被老板叼了,老哥,我说等你这个issues直接被叼了,哎