Use Laravel frame and PHANTOMJS to achieve screenshot function

Source: Internet
Author: User
Tags button type

See on the Internet about PHANTOMJS implementation screenshots are used in conjunction with node and require the input command to execute. So I want to implement the input URL to intercept and output the image function.

One: Download and install PHANTOMJS

Second: Install background integration Environment Appserv

Three: Install Laravel development Framework

Three: implementation code and considerations

1, Phantomjs very good installation, http://phantomjs.org/official website download to any directory (note: If in order to save trouble, it is best to install to the local environment variable directory, such as), if you do not want to download to this directory, The environment variable that can be downloaded to the computer properties increases the path to the PHANTOMJS placement

2, Appserv integration environment, can go to my Baidu network disk download Appserv program link: Http://pan.baidu.com/s/1bpNHJcV Password: kdx4, manual installation. Of course, this integrated environment is just for ease of deployment, the integration of Appache, simple and convenient. This step can also be omitted if you want to use IIS publishing.

3, laravel frame download, Link: http://pan.baidu.com/s/1dFB26Sp password: ki0f download and then put in the newly installed Appserv folder under the WWW folder.

At this point you can see if there is a successful installation. Enter http://localhost/laravel/public/this path under the browser, because this appserv default is port 80, if not modified at the time of installation, then you need to make sure that IIS does not occupy 80 ports. If the browser has an interface, then the installation is successful. If the interface does not appear, then go to the Control Panel-"Management tools-" service to see if Apache24 and mysql57 have no boot, do not start manually.

At this point the required programs are installed, and the following begins to write code.

First, create a JS file in the bin directory of the Phantomjs folder

Snap.js Code

var page = require (' webpage '). Create (); var args = require (' system '). Args;  var url = args[1]; var filename = args[2];  page.viewportsize={width:1024,height:768};p age.open (URL, function () {     page.render (filename);     

Next to the resources under the Laravel folder under the Views folder to modify the HTML code, I just renamed the Laravel, if renamed, then the browser input address should be changed along with the

<! DOCTYPE html>

In this controllers directory to create a new PHP file, the name must be controller.php end

blogcontroller.php File Code

<?phpnamespace App\http\controllers;use Illuminate\routing\controller;use Illuminate\support\facades\db;class BlogController extends Controller {public    function test1 ()    {        if (isset ($_get[' url '))        {            set_ Time_limit (0);            $url = Trim ($_get[' url ');            $filePath = MD5 ($url). PNG ';            if (Is_file ($filePath))            {                exit ($filePath);            }            $command = "d:/phantomjs/bin/phantomjs d:/phantomjs/bin/snap.js {$url} {$filePath}";  This place is really called PHANTOMJS this program. Use the path to implement the call            @exec ($command);            Exit ($filePath);}}    

The last step is to write a route, the following path is the place to configure the route

The implementation code is

<?php/*|--------------------------------------------------------------------------| Web routes|--------------------------------------------------------------------------| | This file is where you may define all of the routes it is handled| By your application. Just tell Laravel the URIs it should respond| To using a Closure or controller method. Build something great!| */route::get ('/', function () {    return view (' Welcome ');}); route::any (' test1 ', [' uses ' = ' [email protected] ']);   Configure Routing

Now that the code is here, let's look at the implementation, enter any URL and click Generate snapshot, and the image will be generated below.

Finally, the picture is saved in this directory

The screenshot is over, but there are still a lot of things to optimize.

In the realization of this process, really encountered a lot of difficulties. For example, how to integrate PHANTOMJS and laravel frameworks, how to resolve cross-domain issues on the deployment server, and so on.

Example: http://120.77.171.182:8080/laravel&phantomjs/public/, you can see the effect here.

Use Laravel frame and PHANTOMJS to achieve screenshot function

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.