Results 1 to 5 of 5

Thread: Integrating Extjs App into existing PHP Projects, customize index.html

  1. #1

    Default Integrating Extjs App into existing PHP Projects, customize index.html

    Hi community,

    Is there a "best practice" of Integrating Extjs App into existing PHP Projects? (Eg, Symfony or any other framework)
    I have my own tweaks of doing this, but I loose some functionality, especially in the "Theming" part or what

    Is there a documentation or a best-practice approach to this?

    OR... is there a way to customize the index.html that sencha cmd is generating?

    Any advise is appreciated.

    Thanks!
    Management means doing the things right,
    Leadership means doing the right things.
    www.interpid.eu

  2. #2
    Sencha - Forum Administrator
    Join Date
    Sep 2017
    Posts
    1,005

    Default

    Hi there- sorry for the delay. I have passed this along to the support team and requested that they help you out as soon as possible.

    Thanks,
    Michele

  3. #3

    Default

    Any updates on this one, or maybe a "timeline" when can we see and update on this topic?
    Management means doing the things right,
    Leadership means doing the right things.
    www.interpid.eu

  4. #4
    Sencha - Support Team bjdurham85's Avatar
    Join Date
    Mar 2014
    Posts
    962

    Default

    Hi klodoma1,

    I haven't seen an official guide for this before but have been able to solve what I think you're ultimately after. The crux being that Cmd cannot effectively serve the PHP so you need a way to make API calls while building your application as well as testing/production, that correct?

    Here's what I've done on a few different projects:

    Starting with the app.json we'll add a custom parameter (more on how this is consumed later) that we'd ideally swap out based on the build target:

    PHP Code:
    "development": {
        
    "urlPrefix"   "http://project.path.local/",
        
    "tags": [
            
    // You can add this tag to enable Fashion when using app watch or
            // you can add "?platformTags=fashion:1" to the URL to enable Fashion
            // without changing this file.
            //
            // "fashion"
        
    ]
    },
    "production": {
        
    "urlPrefix" "https://project.path.production/",
        
    "output": ....
    }, 

    Then, in your given store you just need to prefix the urlPrefix that Cmd luckily turns into an app-accessible reference:
    PHP Code:
    Ext.define('Admin.store.Campaigns', {
        
    extend  'Ext.data.Store',

        
    alias   'store.campaigns',
        
    storeId 'Campaigns',

        
    model   'Admin.model.Campaigns',autoLoadfalse,
    proxy   : {
        
    type            'ajax',
        
    url             Ext.manifest.urlPrefix "campaigns/list/read",    .......

    That covers the front-end for the most part. The next issue to handle is that it's coming in cross-domain and you'll need to expect an OPTIONS pre-flight as well as the actual GET/POST. Your back-end will have to allow both of these to pass. You can opt to ignore this in a production environment if it's same-server but if you have a separate API server you'll still need to setup accordingly.

    Here is a snippet of the access-control headers I've used but you can tweak as needed.

    PHP Code:
    if (isset($_SERVER['HTTP_ORIGIN'])) {
       
    header("Access-Control-Allow-Origin: {$_SERVER['HTTP_ORIGIN']}");
       
    header('Access-Control-Allow-Credentials: true');
       
    header('Access-Control-Max-Age: 86400');    // cache for 1 day
    }

    // Access-Control headers are received during OPTIONS requests
    if ($_SERVER['REQUEST_METHOD'] == 'OPTIONS') {

       if (isset(
    $_SERVER['HTTP_ACCESS_CONTROL_REQUEST_METHOD']))
          
    header("Access-Control-Allow-Methods: GET, POST, OPTIONS");

       if (isset(
    $_SERVER['HTTP_ACCESS_CONTROL_REQUEST_HEADERS']))
          
    header("Access-Control-Allow-Headers: {$_SERVER['HTTP_ACCESS_CONTROL_REQUEST_HEADERS']}");

       exit(
    0);

    Hope this helps.

    Cheers!
    Bryan

  5. #5
    Ext JS Premium Member tangix's Avatar
    Join Date
    Mar 2010
    Location
    Stockholm, Sweden
    Posts
    741

    Default

    Just want to chime in here since we develop Ext JS apps and serve them using CodeIgniter PHP framework. Granted, theming is a problem, so is localization.
    Basically we use the index.html produced by Sencha Cmd and then inject configuration using CodeIgniter's view model. We also inject the Ext.Remote endpoint information using this method.
    You can see one of our projects here: https://solidworks.virtualtester.com

Similar Threads

  1. Integrating ExtJS views in other/larger HTML pages
    By charlie17 in forum Sencha Cmd
    Replies: 3
    Last Post: 13 Mar 2015, 7:47 AM
  2. Adding extjs ui elements into existing html
    By tjhons in forum Ext: Q&A
    Replies: 2
    Last Post: 28 Jan 2012, 11:18 PM
  3. Integrating ext designer projects with codeigniter
    By boblacaster in forum Ext Designer: Help & Discussion
    Replies: 1
    Last Post: 16 Aug 2011, 10:01 AM
  4. Integrating With Existing Code
    By haden in forum Ext 3.x: Help & Discussion
    Replies: 1
    Last Post: 17 Apr 2011, 2:31 PM

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •