V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
monsterooo
V2EX  ›  程序员

[硬广]好消息 Coderlan 支持内嵌模式了👐

  •  1
     
  •   monsterooo · 2020-04-28 18:25:17 +08:00 · 1161 次点击
    这是一个创建于 1668 天前的主题,其中的信息可能已经有所发展或是发生改变。

    亲爱的开发者你好,Coderlane自从去年三月上线以来。我们收到了一些反馈和意见,我们一直在努力的改进和跟新产品功能,现在有个好消息 Coderlane 支持内嵌使用了。

    通过iframe将 Coderlane 嵌入到你的网站中,你将拥有一个支持多种主流语言编译与执行的在线编程环境、支持配套的测试框架、漂亮的单元测试输出。

    s-preview

    预览图片

    下面一起来看看怎么将 coderlane 引入到你的网站吧。

    首介绍一下完整的引入 url

    https://coderlane.net/embed?language=默认语言&initCode=每种语言的初始化代码&initTest=每种语言的初始化测试
    

    接下来通过 javascript 动态创建一个 iframe,然后使用初始化代码和初始化测试参数

    var url = 'https://coderlane.net/embed?';
    var initCode = {
      javascript: '',
      java: '',
      cpp: '',
      c: '',
      ruby: '',
      go: '',
      python2: '',
      python3: '',
      rust: ''
    }
    var initTest = {
      javascript: '',
      java: '',
      cpp: '',
      c: '',
      ruby: '',
      go: '',
      python2: '',
      python3: '',
      rust: ''
    }
    // 默认选中语言
    url += 'language=ruby';
    // 初始化代码
    url += '&initCode=' + encodeURIComponent(JSON.stringify(initCode));
    // 初始化测试
    url += '&initTest=' + encodeURIComponent(JSON.stringify(initTest));
    
    var iframe = document.createElement('iframe');
    iframe.src = url;
    iframe.style = "width: 100%; height: 100%";
    // 创建 iframe 元素到页面中
    document.body.appendChild(iframe);
    

    关于initCodeinitTest部分,可以参考支持语言部分获得

    iframe 实际调用演示

    <iframe src="https://coderlane.net/embed?language=javascript&initCode=%7B%22javascript%22%3A%22function%20Solution()%20%7B%0A%20%20return%20%22Hello%20World!%22%3B%0A%7D%22%2C%22java%22%3A%22class%20Solution%20%7B%0A%20%20public%20static%20String%20helloWorld()%7B%0A%20%20%20%20return%20%22Hello%20World!%22%3B%0A%20%20%7D%0A%7D%22%7D&initTest=%7B%22javascript%22%3A%22const%20expect%20%3D%20require(%22chai%22).expect%3B%0Adescribe(%22Hello%20World%22%2C%20function()%20%7B%0A%20%20%20%20it('should%20be%20Hello%20World%20overwrite'%2C%20function()%20%7B%0A%20%20%20%20%20%20%20%20expect(Solution()).to.equal('Hello%20World!')%3B%0A%20%20%20%20%7D)%0A%7D)%22%2C%22java%22%3A%22import%20org.junit.Test%3B%0Aimport%20static%20org.junit.Assert.assertEquals%3B%0Aimport%20org.junit.runners.JUnit4%3B%0A%0Apublic%20class%20MainTest%20%7B%0A%20%20%40Test%0A%20%20public%20void%20testHelloWorld()%20%7B%0A%20%20%20%20assertEquals(%22Hello%20World!%22%2C%20Solution.helloWorld())%3B%0A%20%20%7D%0A%7D%22%7D%0A" border="0" frameborder="no" />

    感谢阅读,如果有任何问题欢迎反馈交流

    目前尚无回复
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   4154 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 24ms · UTC 05:32 · PVG 13:32 · LAX 21:32 · JFK 00:32
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.