代码之家 › 专栏 › 技术社区 › Francisco Presencia

如何在Javascript(浏览器)中运行PHP?

php javascript

3

Francisco Presencia · 技术社区 · 7 年前

但是等待

如何在Javascript中运行PHP?我是 不要求在服务器中运行PHP 然后将生成的字符串作为Javascript发送到浏览器。我实际上是在谈论Javascript解析和运行PHP。

这在许多地方可能有用:

浏览器的一个小REPL,它不需要每个实例有一个完整的VM。非常适合学习PHP。

我到处找了找 php-parser 和 babel-preset-php

// No server needed, "just" Javascript parsing PHP
alert(php(`<?= "Hello world" ?>`));

编辑:如果你知道比我更好的答案,请随意分享!我对社区的想法很好奇。

2 回复 | 直到 7 年前

1

Francisco Presencia 7 年前

这是可能的!使用问题中提到的两个库,剖析 babel-preset-php 并重用一些部分将PHP转换为Javascript,然后对Javascript进行求值。这是一个工作演示,请随意在 <textearea> 和媒体 run

const $ = sel => document.querySelector(sel);
$('#horrible').addEventListener('submit', e => {
  e.preventDefault();
  eval($('#horrible textarea').value);
});

body, html {
  margin: 0;
}

textarea {
  line-height: 1.5;
  margin: 0;
  height: 2.1em;
  padding: .3em .6em;
  border: 1px solid #ccc;
  background-color: #fff;
  border-radius: .2em;
  transition: all 0.3s;
  width: 90%;
}

button {
  display: inline-block;
  text-align: center;
  margin: 0;
  padding: .3em .9em;
  vertical-align: middle;
  background: #0074d9;
  color: #fff;
  border: 0;
  border-radius: .2em;
  width: auto;
  user-select: none;
  margin: .3em 0;
  cursor: pointer;
  transition: all 0.3s;
  border-radius: .2em;
  height: auto;
  box-shadow: 0 0 rgba(0,0,0,0) inset;
}

<form id="horrible">
<textarea style="min-height:150px">const vars = { icon: &#x27;&#x1F389;&#x27; };
const out = php(&#x60;&#x3C;?= &#x22;for fun! &#x22;.$icon ?&#x3E;&#x60;, vars);
alert(out);</textarea>
<button data-tooltip="Are you sure? Like, 100%? There is no coming back">EVAL()</button>

<script src="https://francisco.io/blog/running-php-in-javascript/php.min.js"></script>

下面是用于生成 php.js

import parser from 'php-parser';
import translator from './translator';
import generator from '@babel/generator';

const run = (code, opts) => {
  // Make a closure so that `out` doesn't collide with the PHP variables:
  let out = '';
  // Define `echo` since it's used in the transpiled JS code for some reason
  opts.echo = opts.echo || (str => out += str);
  // Pretend this is safe. Pro tip: IT IS NOT SAFE
  new Function(...Object.keys(opts), code)(...Object.values(opts));
  return out;
}

export default function (src, opts = {}) {
  const ast = new parser().parseCode(src);
  const file = translator.translateProgram(ast);
  const code = generator(file).code;
  return run(code, opts);
};

2

-1

Jayakumar 7 年前

如果你想用jsvascript写些东西。那么javascript代码必须在php文件中,即如果文件名是temp.php

javascript代码应该在script标记中。

test.php(您的php文件名)

<html>
    <head>
        <script>
            function myFunc(){
                alert('<?php echo date("Y/m/d"); ?>');
            }

        </script>
    </head>
</html>

最初,php服务器执行上述代码并将JS代码视为纯文本。

当涉及到客户端/浏览器时,将如下所示

<html>
    <head>
        <script>
            function myFunc(){
                alert("2018/06/30");
            }

        </script>
    </head>
</html>