Integrazione di un sito Web mobile in un'app mobile

3

Sto cercando di sviluppare nuovamente un sito web per dispositivi mobili in modo da poterlo integrare in un'app mobile sviluppata da un altro reparto, ma che comunque la mantenga funzionante sul Web. L'app ha il proprio menu, quindi è ridondante lasciare il menu sul sito mobile.

Abbiamo preso in considerazione la semplice rimozione del menu, delle intestazioni e dei piè di pagina dal sito e di fornire i collegamenti alle pagine all'altro dipartimento in modo che possano aggiungerli al menu dell'app. Questo ovviamente lascia il nostro sito web senza menu.

Ho preso in considerazione la creazione di una nuova pagina principale, che ha un menu simile all'app e il caricamento delle pagine in frame o utilizzando jquery .load () o ASP include ... I frame mi daranno la funzionalità Voglio che sia più simile alle pagine di apertura dell'app in un browser che usa il suo menu nativo, ma i frame sono così ... degli anni '90.

Qual è la soluzione migliore che utilizza gli standard moderni?

    
posta ShemSeger 24.07.2014 - 19:50
fonte

3 risposte

4

Non usare i frame;) Quello che potresti fare è fornire i collegamenti all'altro dipartimento e alla fine dell'URL impostare qualche tipo di variabile GET ex mysite.com?commingFromApp=true E poi sul sito web potresti fare un metodo, stampare il menu sul sito web, e se commingFromApp non è vero, stampare il menu e se è vero non stamparlo perché l'utente sta arrivando dall'app e non dovrebbe vedere il Menu

    
risposta data 24.07.2014 - 20:46
fonte
0

Variabili URL e CSS

Questa è la soluzione che ho trovato usando il suggerimento di user1741807 per usare una variabile GET:

L'app del portale sarà su OSX, Android e Windows, e semplicemente collegherà al nostro sito web mobile e la visualizzerà in un browser nidificato, quindi ho usato l'URL per creare un cookie e poi ho usato CSS per nascondere il menu.

Il nostro sito Web mobile è scritto in ASP classico, PHP e HTML, quindi ho scritto uno script diverso per ogni lingua. Inizialmente avevo pianificato di scrivere uno script in Javascript, ma quando ho scoperto quanto fosse facile fare ciò che volevo in ASP e PHP ho deciso di scartare Javascript. Più tardi ho capito che avevo alcune pagine che non erano in ASP o in PHP e alla fine ho dovuto scrivere comunque il Javascript.

Il codice sottostante nasconderà il menu solo quando la home page viene visitata dal link che contiene la variabile nel menu dell'app e rimarrà per tutto il tempo in cui dura la sessione, ma non nasconderà il menu quando visitato da un browser senza la variabile.

La variabile alla fine della stringa URL: ? display = portal

ASP classico

Asp ha una funzione che può facilmente ottenere variabili da un URL: request.querystring ()

Ho inserito il seguente codice su index.asp per impostare il cookie, quindi inserire il codice Request.Cookies () sul resto delle nostre pagine asp.

<%
fromPortalApp = request.querystring("display")
If fromPortalApp = "portal" Then
    Response.Cookies("display")="portal"
Else
    Response.Cookies("display")="web"
End If

portalCheck = Request.Cookies("display")
If portalCheck = "portal" Then
    MenuDisplay = "none"
Else
    MenuDisplay = "normal"
End If
%>

<style>
#topbar {
    display:<%=MenuDisplay%>;
}
</style>

PHP

Nelle pagine PHP non avevo bisogno di impostare il cookie, quindi ho solo dovuto includere uno script per controllarlo:

<?php 
if (isset($_COOKIE["display"])){
    $sessionDisplay = $_COOKIE["display"];
    if ($sessionDisplay == "portal"){
        $portalcheck = "none";
    } elseif ($sessionDisplay == "web"){
        $portalcheck = "normal";
    } 
} else {
    $portalcheck = "normal";
}
?>
<style>
#topbar {
    display:<?php echo $portalcheck; ?>;
}
</style>

Pure Javascript

Javascript è stato difficile, abbiamo alcune pagine HTML su un server diverso in un sottodominio diverso, quindi ho dovuto usare una funzione scritta per ottenere le variabili, un'altra funzione per scrivere i cookie, una terza funzione per ottenere i cookie , quindi scrivi una quarta funzione per modificare il CSS e nascondere il #topbar div con il menu. Le funzioni set e get cookies sono appena uscite da w3schools.

function getUrlVars() {
    var vars = {};
    var parts = window.location.href.replace(/[?&]+([^=&]+)=([^&]*)/gi,    function(m,key,value) {
        vars[key] = value;
    });
    return vars;
}

function setCookie(cname, cvalue, exdays) {
    var d = new Date();
    d.setTime(d.getTime() + (exdays*24*60*60*1000));
    var expires = "expires="+d.toGMTString();
    document.cookie = cname + "=" + cvalue + "; " + expires;
}

function getCookie(cname) {
    var name = cname + "=";
    var ca = document.cookie.split(';');
    for(var i=0; i<ca.length; i++) {
        var c = ca[i];
        while (c.charAt(0)==' ') c = c.substring(1);
        if (c.indexOf(name) != -1) return c.substring(name.length,c.length);
    }
    return "";
}

var portalcheck = getUrlVars()["display"];
var hostcheck = window.location.hostname;
if(portalcheck=="portal" && hostcheck=="darius.uleth.ca"){
    setCookie("display", "portal")
} else if (hostcheck=="darius.uleth.ca"){
    setCookie("display", "web")
}

window.onload = init;

function init(){
    var topbar = document.getElementById("topbar");
    var portalcookie = getCookie("display");

    if(portalcookie=="portal" && hostcheck=="darius.uleth.ca"){
        topbar.style.display= "none";
        document.getElementById("content").style.margin="0";
    } else if (portalcookie=="web"){
        topbar.style.display= "normal";
    }
}
    
risposta data 05.08.2014 - 18:14
fonte
0

Se l'app mobile è un'app PhoneGap (o almeno qualcosa con una webview incorporata), è possibile definire un valore nell'interfaccia JavaScript (cioè, all'interno del collegamento tra Java / ObjC alla vista Web) per testare contro . Quando viene eseguito per la prima volta il codice JavaScript nella pagina HTML, verificare se tale valore è stato assegnato. Se lo è, è l'app mobile. Se non è così, è la pagina web. Quindi regola i menu di conseguenza.

    
risposta data 05.08.2014 - 18:39
fonte

Leggi altre domande sui tag