精华内容
下载资源
问答
  • 什么是终端web开发

    千次阅读 2019-03-30 20:14:01
    任何基于TCP/IP模型应用层协议的Web应用的请求方,都可视为“Web终端”,与此相对的就是Web Service。终端的核心价值Web Service的表现形式与交互形式。 来讨论终端,就暂且不说Web Service的事情了。所以这里就...

    一句话概括:其实Web原本并非跨终端,但应用场景多了,就变成了”跨终端“。

    既然说是Web,我就把范围划定在互联网相关的技术栈内。

    任何基于TCP/IP模型应用层协议的Web应用的请求方,都可视为“Web终端”,与此相对的就是Web Service。终端的核心价值是Web Service的表现形式与交互形式。

    来讨论终端,就暂且不说Web Service的事情了。
    所以这里就涉及硬件、软件和网络协议三个部分。

    硬件

    这个非常好理解,就是我们日常使用的各种智能设备,包括电脑、平板、智能手机等传统设备。但仅仅是这样还不够,电视盒子、智能手环、智能灯饰等智能家居都在“Web终端”的范围内。

    为什么这么说?

    传统设备自不必多说。新兴的物联网智能设备,我可以总结为:通过用户操作,使用传统的或较新的网络传输技术(包括WLAN、蓝牙、红外、RFID等),向对应的Web Service发出请求,等待请求应答,并根据应答内容向用户反馈信息。

    是不是有点物联网的意思?

    软件

    这是大家印象最深刻的部分,尤其是在移动设备带动响应式交互大行其道的今天。做Web开发的程序员,尤其是前端,需要同时考虑页面在多种浏览器和多种设备的兼容性,因此响应式布局确实是跨终端Web的一个体现。

    但我认为这还不够,因为对于互联网而言,Web的终端不只有浏览器,还有其他应用程序。最简单的,比如一个Web Service同时提供Web站点和iOS App两种服务,再比如魔兽世界网游,我的账号数据被同时提供给游戏客户端和Web版的英雄榜,这里面的区别就是软件终端的不同。

    网络协议

    让事情变得简单一点,先考虑TCP/IP模型中应用层的协议。考虑这些是因为,这些协议支撑起来的应用都遵循”客户-服务器“范式。

    这些协议的存在让同一个Web Service支持不同软件终端成为可能,比如HTTP协议支持浏览器直接访问服务,也支持App中调用API向服务端申请服务,比如DHCP协议支持给不同操作系统的PC、平板、智能手机、电视盒子、其他智能家居提供IP地址,SNMP协议的跨系统、跨设备的支持更不用说,等等。

    从应用层再深入思考,比如运输层、网络层的协议,是与硬件平台和传输信道紧密相关的。

    跨终端Web

    回到最开始,”跨终端Web“,我觉得这真的不是单一一门技术就能做完的事情。

    根据实际需求,终端分硬件和软件两个层次,每个层次包含多种类型,每种类型用到的技术又各不相同,所以”终端“的差异是不可避免、无法消除的。

    但我们开发者也是人,也想尽可能的省事,于是就有了跨终端的Web:

    以通信协议为基础,以Web服务的最终表现形式与交互形式为核心的,基于各类操作系统的软件技术集。

     

    展开全文
  • 这里负责此项目的Lib / site-packages / IPython / html / notebookapp.py中的代码(通过以敏感方式搜索源代码“终端”来定位文件):def init_terminals(self):try:from .terminal import initializeinitialize...

    这里是负责此项目的Lib / site-packages / IPython / html / notebookapp.py中的代码(通过以敏感方式搜索源代码“终端”来定位文件):

    def init_terminals(self):

    try:

    from .terminal import initialize

    initialize(self.web_app)

    self.web_app.settings['terminals_available'] = True

    except ImportError as e:

    log = self.log.debug if sys.platform == 'win32' else self.log.warn

    log("Terminals not available (error was %s)", e)

    您可以看到,控制台日志中应该有一条消息,指明出现了什么问题(您可能需要使用ipython笔记本–log-level =< level>来增加日志冗长度)。在我的情况下,它说:

    Terminals not available (error was No module named fcntl)

    正在导入的html.terminal模块似乎提供了一个基于Web的IPython交互式控制台。

    展开全文
  • 开源web终端ssh解决方案

    千次阅读 2016-09-30 15:24:23
    1. 首先来说一下为什么web ssh? 许多人不是说,有了 xshell , secureRT , putty 等众多的 ssh 终端,为嘛还要弄个 web 的 ssh ,不是够二的吗?难道为了装像么? 有个 web 的 ssh ,的确...

    1. 首先来说一下为什么要 web ssh?

    许多人不是说,有了 xshell secureRT putty 等众多的 ssh 终端,为嘛还要弄个 web ssh ,不是够二的吗?难道是为了装像么?

    有个 web ssh ,的确没有多大作用,的确无法代替 ssh 客户端,但是你想过没有,类似于 xshell secureRT putty ,在运维管理中确实有很多麻烦,不同的用户,需要不同的登录名,授权等等管理,而且存在一定的风险,比如个人电脑被攻击等等安全问题?

    2. 是否有解决方案呢?

    其实,很多公司目前都会用堡垒机,跳板机等一系列安全措施来防止系统非法访问,有不少公司都已经实现了登录系统需要手机验证码了,当然这个会更安全 , 确实为一种安全解决方案。

    3. 是否还有其他解决方案呢?

    那么,这里我推荐一个可以替代运维堡垒机的功能的一个软件,那就是这里的 gateone

    在说运维堡垒机之前,先来了解下什么是运维堡垒机?

    运维堡垒机的理念起源于跳板机

    理念一:唯有控制才能真正解决问题

    理念二:系统账号无法确认用户身份

    理念三:人为操作难免会出问题

    可以看到,运维堡垒机具有对 运维人员的身份认证、对运维操作的访问控制和审计等功能 (来自看百度百科的解释 http://baike.baidu.com/view/4274690.htm

    4.推荐方案

    可以看到,运维堡垒机好处很多,有效的控制了运维风险,而今天给大家介绍的 gateone ,就是一套自己的开源堡垒机解决方案。

    5. Gateone 的简介

    个人认为 gateone 是一个高端大气上档次的 web ssh ,同类产品中,其他不是体验不好,就是界面看着不顺眼,有的还带着细微的 bug ,知道遇到了 gateone ,才觉得 web ssh 原来可以这么好用。

    不妨看看都有哪些web的ssh终端

    https://github.com/aluzzardi/wssh

    https://code.google.com/p/shellinabox

    http://code.google.com/p/web-shell

    https://github.com/antonylesuisse/qweb

    GateOne 是一款 使用 HTML5 技术编写的网页版 SSH 终端模拟器

    · 基于现代的 HTML5 技术, 无需任何浏览器插件

    · 支持 多个 SSH 进程

    · 可以嵌入到其他任意应用程序中。

    · 支持 使用 JavaScript Python 甚至纯 CSS 编写的插件

    · 支持 SSH 进程副本,打开多个进程而无需重复输入密码。

    · 支持各种 服务器端的日志功能 ,支持 Keberos-based 单点登录甚至活动目录。

    · 支持操作日志记录,具有操作记录回放功能

    项目地址 https://github.com/liftoff/GateOne

    开发语言 python

    当前版本 1.1



    Shell In A Box(发音是shellinabox)是一款基于Web的终端模拟器,由Markus Gutschke开发而成。它有内置的Web服务器,在指定的端口上作为一个基于Web的SSH客户端而运行,可以为你提供一个Web终端模拟器,以便使用任何支持AJAX/JavaScript和CSS的浏览器,远程访问和控制你的Linux服务器SSH外壳,不需要像FireSSH这些任何额外的浏览器插件。


    展开全文
  • 使用vue-command开发web终端,不知道能不能完成,在此记录遇到的坑。 基本没有什么资料,找到的都英文,如果有朋友们遇到好的资料,请留言分享,万分感谢。 1、安装 直接按照官网给出的命令安装vue-command ...

    使用vue-command开发web终端,不知道能不能完成,在此记录遇到的坑。

    基本没有什么资料,找到的都是英文,如果有朋友们遇到好的资料,请留言分享,万分感谢。

    1、安装

    直接按照官网给出的命令安装vue-command

    npm i vue-command --save

    2、简单示例

    安装完成后在vue新建页面,引入vue-command和对应的css

    <template>
      <vue-command :commands="commands" />
    </template>
    
    <script>
    import VueCommand, { createStdout } from 'vue-command'
    import 'vue-command/dist/vue-command.css'
    
    export default {
      components: {
        VueCommand
      },
    
      data: () =>  ({
        commands: { 
          'hello-world': () => createStdout('Hello world') 
        }
      })
    }
    </script>

    简单的示例,完全是官网的例子,可以运行,得到的基本是这样的。

    很简单,然后就没有然后了,对于一个拿来党来说,太难了

    自己根据api添加事件,名称,终端标志等。

    <template>
      <vue-command :commands="commands" title="收入分摊终端模块" :history=history :not-found="notFound" :pointer="pointer" @input="inputLater" @execute="executing">
        <template slot="prompt" slot-scope="prompt">
          <span class="term-ps" >
          {{ prompter }}
          </span>
        </template>
      </vue-command>
    
    </template>
    
    <script>
      import VueCommand from 'vue-command'
      import 'vue-command/dist/vue-command.css'
    
      import NanoEditor from './NanoEditor.vue'
    
      export default {
        data() {
          return {
            pointer: 3,
            prompter: '[RAS~]$',
            notFound: '您输入的指令不存在,请重新输入.',
            history: [],
            commands: {
              nano: () => NanoEditor
            }
          }
        },
        components: {
          VueCommand
        },
        methods:{
          inputLater(a){
            console.log(111)
            console.log(a)
          },
          executing(e,k) {
            console.log('executing')
            console.log(e)
            console.log(k)
          }
        }
      }
    </script>
    

    与后台交互的例子

    父页面

    <template>
      <vue-command
        ref="terminal"
        :commands="commands"
        :history="history"
        :hide-bar="hideBar"
        :is-in-progress="isInProgress"
        :not-found="notFound"
        :pointer="pointer"
        :stdin="stdin"
        :stdout="stdout"
        :intro="intro"
        :show-intro="showIntroFlag"
        :show-help="showHelpFlag"
        title="终端模块"
        @input="inputLater"
        @execute="executing"
        @executed="executed"
      >
        <template slot="prompt" slot-scope="prompt">
          <span class="term-ps" >
            {{ prompter }}
          </span>
        </template>
      </vue-command>
    
    </template>
    
    <script>
    import VueCommand, { createStdout, createStderr, createDummyStdout } from 'vue-command'
    import 'vue-command/dist/vue-command.css'
    import NanoEditor from './NanoEditor.vue'
    import ChuckNorris from './ChuckNorris'
    
    const PROMPT = '[RAS~]$'
    export default {
      components: {
        VueCommand
      },
      data() {
        return {
          showHelpFlag: true,
          showIntroFlag: true,
          intro: '一些东西需要执行',
          isInProgress: false,
          hideBar: false,
          stdout: '',
          stdin: '',
          pointer: 3,
          prompter: '[RAS~]$',
          notFound: '您输入的指令不存在,请重新输入.',
          history: [],
          commands: {
            cd: undefined,
            norris: () => ChuckNorris,
            nano: () => NanoEditor,
            'hello': () => createStdout('Hello world'),
            'help': () => createStdout(`Available programms:<br><br>
            &nbsp;cd [dir]<br>
            &nbsp;clear<br>
            &nbsp;hello-world<br>
            &nbsp;klieh<br>
            &nbsp;loading [--amount n] [--timeout n]<br>
            &nbsp;nano<br>
            &nbsp;norris<br>
            &nbsp;pokedex pokemon --color<br>
            &nbsp;pwd<br>
            &nbsp;reverse text<br>
          `)
          }
        }
      },
      created() {
        this.commands.cd = ({ _ }) => {
          if ((_[1] === 'home' || _[1] === 'home/') && this.prompt === PROMPT) {
            this.prompt = `${PROMPT}home`
    
            return createDummyStdout()
          }
    
          // Navigate from home to root
          if ((_[1] === '../' || _[1] === '..') && this.prompt === `${PROMPT}home`) {
            this.prompt = PROMPT
    
            return createDummyStdout()
          }
    
          // Navigate to self
          if (_[1] === '.' || _[1] === './' || typeof _[1] === 'undefined') {
            return createDummyStdout()
          }
    
          return createStderr(`cd: ${_[1]}: No such file or directory`)
        }
      },
      methods: {
        setHistory(data) {
          this.$refs.terminal.history.push(data)
        },
        inputLater(a) {
          console.log(111)
          console.log(a)
        },
        executing(e, k) {
          this.setIsInProgress = true
          // this.isInProgress = true
          this.stdin = '执行中....'
          this.stdout = '执行了'
          createStdout('执行中....')
          console.log('executing')
          console.log(e)
          console.log(k)
        },
        executed(e, k) {
          // this.isInProgress = false
          this.setIsInProgress = true
          console.log('executed')
          console.log(e)
          console.log(k)
        }
      }
    }
    </script>
    

    子页面

    <template>
      <div>
        <span v-if="!isLoading && !isError">{{ joke }}</span>
        <span v-if="isLoading && !isError">Loading ...</span>
        <span v-if="isError">There was an error getting the joke</span>
      </div>
    </template>
    
    <script>
    const API = 'https://www.baidu.com'
    const API_TIMEOUT = 5000 // 5 seconds
    
    export default {
      inject: ['terminate'],
    
      data: () => ({
        abortController: new AbortController(),
        isError: false,
        isLoading: true,
        joke: ''
      }),
    
      async mounted() {
        // Abort getting joke when API request takes longer than defined in "API_TIMEOUT"
        setTimeout(() => {
          if (this.isLoading) {
            this.abortController.abort()
          }
        }, API_TIMEOUT)
    
        try {
          const response = await fetch(API, { signal: this.abortController.signal })
          if (!response.ok) {
            this.setIsError(true)
            this.terminate()
    
            return
          }
    
          const { value } = await response.json()
          this.joke = value
        } catch (error) {
          this.setIsError(true)
        } finally {
          this.isLoading = false
          this.terminate()
        }
      },
    
      methods: {
        setIsError(isError) {
          this.isError = isError
        }
      }
    }
    </script>
    

    3、遇到的问题

    a.使用prompt,根据官网示例,运行后控制台报错

    Duplicate presence of slot "prompt" found in the same render tree - this will likely cause render er

    这个遍历使用slot,可以使用作用域插槽,直接代码

    <template slot="prompt" slot-scope="prompt">
        <span class="term-ps"  >
          {{ prompter }}
        </span>
    </template>

    b.prompt使用时候不能重复使用这个单词,比如上个代码段{{prompter}} 这个不能定义为prompt ,不知道什么原因

    c.这个真不适合我这种新手

    建议还是用xterm吧

    展开全文
  • 好久都没来写博客,最近忙啥去了呢?...1.首先来说一下为什么web ssh? 许多人不是说,有了xshell,secureRT,putty等众多的ssh终端,为嘛还要弄个web的ssh,不是够二的吗?难道为了装像么? 有个web的ssh,的...
  • 什么是web前端

    2021-01-18 17:15:08
    web前端是什么? 最初的前端应该是叫前台。就是做一些静态页面,p图工作也不难,没有什么代码逻辑。 当初就是这种想法,但是真正接触到这方面时发现并不是这样。和我当初想的相差太多了。 从狭义上讲,前端工程师...
  • 新书《跨终端 Web

    2021-01-10 03:54:16
    小屏幕终端是我们重新思考业务本质和核心人机交互流程的机会,其挖掘出的本质会改变其他终端;三是针对未来人机交互,现在移动设备引领人机交互的变革潮流,通过必备特性虚拟或增强现实&#...
  • 终端Web之HybridApp

    2021-03-03 15:11:32
    Hybrid并不是什么新概念,最早可以追溯到Symbian时代,直到iOS和Android出现之后才充分展现出价值。Hybrid既利用了NativeApp丰富的设备API(DeviceAPI),又能拥有MobileWeb的跨平台、高效开发、快速发布的能力,...
  • web前端到底是什么

    2021-01-16 17:27:45
    web前端起飞第一篇:web前端到底是什么? 大多数人对于web前端的认识 前端开发就是写页面、切切图,工作也不难,前端没有后端厉害,前端可有可无,后端才是王道。 包括我在刚接触前端的时候也有过这样的想法,不过...
  • 什么是WEB3.0?

    2019-09-16 20:20:46
    什么是WEB3.0?业内专家诠释:即"WEB3.0=互联网+通讯服务(Internet+Instant Communications)",即通过互联网与通讯的融合,用户可以用所有智能终端(固定电话、移动电话、PC、IPTV、其他智能终端)轻松享受看得见、...
  • 什么是Web server

    2017-08-30 15:42:01
    在硬件部分,一个网络服务器一个用来存储网站的组成文件(比如说 HTML 文档,图片,CSS 样式表,和 JavaScript 文件)以及交付它们到终端用户的设备的计算机。它跟互联网连接并可以通过域名像 mozilla.org 来被...
  • 什么是响应式web设计

    2019-10-03 09:40:23
    什么是响应式web设计 现在开发一个产品,基本上都会需要兼顾 PC端和 移动端。 一般有两种思路: 1.为每个终端做一个特定的版本,并给2级域名,根据终端环境调用不同的版本代码。 2.一个网站能够兼容多个终端 ...
  • 试读《跨终端Web

    2014-08-12 23:15:22
    本月的试读又开始了,粗略的看了一下本月提供的几本书,作为前端开发的我毫不犹豫选了《跨终端Web》,百度,阿里,腾讯我梦想的公司但......  看了本书试读后我明白了什么是差距,发现自己“井底之蛙”,还有...
  • 项目要求,需要在web使用ssh或者控制台,就找有没有好的方法...在这里我本来想的直接在python里调用终端命令执行,但是单独使用的时候可以,集成起来就不好用了,为什么不好用后面说,先说几种常用的终端命令的执行。
  • 什么是WEB3.0

    2008-01-07 09:21:00
    by:http://it.zaobao.com/pages8/commerce071205.html什么是WEB3.0?业内专家诠释:即"WEB3.0=互联网+通讯服务(Internet+Instant Communications)",即通过互联网与通讯的融合,用户可以用所有智能终端(固定电话、...
  • Web前端什么的?

    千次阅读 2019-03-05 18:13:50
    在早期点,web前端不叫...从广义上来讲,所以用户终端产品与视觉和交互有关的部分,都前端工程师的专业领域。 前端工程师最核心的技能:HTML,CSS,Javascript。前端最接近用户的工程师。 下图为前端工程师...
  • Archipelago基于Web技术的开源终端仿真器。 为什么? 群岛受到启发。 在Hyper处于Beta和v1版本时,我开始将其用作默认终端。 到目前为止,它我使用过的最酷,最漂亮,最小且可扩展的终端模拟器。 但是,我发现...
  • 举例: 比如我们建立了一个简单计算器的web service, 那么别人可以通过使用 SOAP message进行对数据的请求, 当我们的计算器web service接收到用户的请求的时候, 我们会先在终端对用户的请求进行处理,之后同样的...
  • 终端Web之Hybrid App

    2015-06-02 10:26:00
    Hybrid并不是什么新概念,最早可以追溯到Symbian时代,直到iOS和Android出现之后才充分展现出价值。 Hybrid简史 1. 背景 Hybrid既利用了Native App丰富的设备API(Device API),又能拥有M...
  • 什么是web应用程序

    千次阅读 2017-07-04 14:48:41
    服务器:向终端(客户端)提供服务的计算机。 .1.1 服务器一般的特点: (1) 7*24 全天候都在运行的计算机,当然也会出现维护的时候; (2) 服务器的性能要出色,包括CPU/内存/磁盘读写。 (3) 服务器要连接...
  • web 中的session是什么?

    2017-08-23 18:32:29
    在计算机专业术语中,Session指一个终端用户与交互系统进行通信的时间间隔,通常指从注册进入系统到注销退出系统之间所经过的时间。 具体到Web中的Session指的就是用户在浏览某个网站时,从进入网站到浏览器关闭所...
  • 随着Web前端行业的不断发展,不仅在功能形式上越来越多样,对前端人员的技术要求也越来越高,因此想转行Web前端行业的人开始会有一些担忧和顾虑,那Web前端有什么优点?Web前端怎么入门? Web前端有什么优点? 前端...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 896
精华内容 358
关键字:

web终端是什么