Is There a Good Way to Compile Solidity on the Frontend?

Question

By using web3deploy on remix, it is one click to copy, and one click function for you to allow someone on the the frontend to deploy a contract you are hosting via MetaMask.

If you wanted to make that contract variable, so the data: {bytecode} field could vary based on some variables in the Solidity code, you would need to compile it and then update the data: field of your web3.js deployment.

Is there a way to make solc work on the frontend? Is there a service that lets you compile Solidity remotely?

Update: I got Eric Tang's project to compile in the browser, but I haven't figured out how to only output the bytecode, nor what regex to turn the solidity contract code into one big string.

Answer 1

I believe Remix just uses solc-js. You could do the same.

EDIT

You might want browser-solc, which is a "browserified" version of solc-js.

EDIT 2

Example usage:

<script src="browser-solc.min.js" type="text/javascript"></script>
<script>
window.onload = function() {
  BrowserSolc.loadVersion("soljson-v0.4.21+commit.dfe3193c.js", function (compiler) {
    var source = 'pragma solidity ^0.4.20;\ncontract Test { function Test() public { } }';
    var contract = compiler.compile(source, 0).contracts[':Test'];
    console.log(contract.bytecode);
  });
}
</script>