Ionic is a great framework to develop mobile apps using html5. We want same application to be used over desktop browser also. Will it be good idea to make a single responsive UI that works best on both desktop browser and mobile browser and make app. OR we should make different development for browser and mobile app.
Ionic是使用html5开发移动应用的一个很好的框架。我们希望同样的应用程序也可以在桌面浏览器上使用。是开发一个在桌面浏览器和移动浏览器上都能运行得最好的响应UI，还是开发一个不同的浏览器和移动应用?
6 个解决方案
#1
25
To expand a little bit on what has already been said, Ionic is is built and tested for mobile only. Internet Explorer for example is not tested and does not properly handle a number of the features in Ionic. Desktop browsers do have different features from their mobile browser counterparts. You would seriously limit the browsers that can use your application on a desktop.
为了进一步扩展已经说过的内容，Ionic只用于移动设备的构建和测试。例如，Internet Explorer没有经过测试，并且不能正确地处理Ionic中的一些特性。桌面浏览器和移动浏览器有不同的特性。您将严重限制在桌面上使用应用程序的浏览器。
Most likely, you should provide two different applications for desktop and mobile. Unless you have the guts or ability to tell your users that they must use Chrome (or Opera) to run your website, you'll want two separate applications. You could still use Ionic for a mobile website though, but without being able to use Cordova's full platform integration (you would be limited to the native HTML APIs provided by the browser). You could certainly retain much of your business logic in a common core that is shared between both applications. That would require creating a shared angular module(s). I have done this in a project with an Ionic app and a normal Angular desktop app (with Bootstrap).
最可能的是，您应该为桌面和移动提供两个不同的应用程序。除非你有勇气或能力告诉你的用户他们必须使用Chrome(或Opera)来运行你的网站，否则你需要两个独立的应用程序。不过，您仍然可以在移动网站上使用Ionic，但不能使用Cordova的完整平台集成(您只能使用浏览器提供的本地HTML api)。您当然可以在两个应用程序之间共享的公共核心中保留大部分业务逻辑。这需要创建一个共享的角模块。我在一个项目中使用了一个Ionic应用程序和一个普通的角度桌面应用程序(使用Bootstrap)。
There are a number of ways to detect if a visitor is coming from a desktop or mobile device. I don't know of a method that is 100% perfect, because they usually rely on the browser's user agent string (and can be spoofed, changed, etc). See http://detectmobilebrowsers.com/ for some common scripts or examples how to implement mobile detection on a server or in a programming language.
有很多方法可以检测访问者是否来自桌面或移动设备。我不知道有哪种方法是100%完美的，因为它们通常依赖于浏览器的用户代理字符串(可以被欺骗、修改等等)。有关如何在服务器或编程语言上实现移动检测的常见脚本或示例，请参见http://detectmobilebrowsers.com/。
#2
24
This question was asked at ng-europe earlier this week. The answer from the ionic guys was to share your services and controllers, but use different views for desktop. Ionic is purely focused on mobile.
这个问题在本周早些时候在ng-欧洲被问到。来自ionic公司的答案是共享你的服务和控制器，但是桌面使用不同的视图。Ionic专注于移动业务。
#3
13
Interestingly, it seems to be possible to produce a desktop version of an Ionic app using a toolkit named 'Electron' which is sort of a desktop equivalent of Cordova/Phonegap, as explained in this article:
有趣的是，似乎有可能利用名为“电子”的工具包开发出一款Ionic应用的桌面版本，这个工具包类似于Cordova/Phonegap，如本文所述:
http://alexbergin.com/2015/streamlining-desktop-and-mobile-app-development
http://alexbergin.com/2015/streamlining-desktop-and-mobile-app-development
Electron (formerly named Atom Shell) packages an embedded Chromium webview to produce a 'real' app. This also means that cross-browser issues are not a concern.
电子(原名Atom Shell)将嵌入的Chromium webview打包成一个“真实”的应用程序，这也意味着跨浏览器的问题不值得关注。
The author of the above article used this successfully with an Ionic app.
这篇文章的作者在一个Ionic应用程序中成功地使用了它。
If you would go down this road then you would probably need to use some responsive techiques to optimize the UX on desktop.
如果你要沿着这条路走下去，那么你可能需要使用一些响应灵敏的技术来优化桌面用户体验。
I haven't tried this so I don't know the pros and cons of this approach but I can imagine there are cases when you just want to quickly throw together a desktop version of an app that you already have.
我还没有尝试过这个，所以我不知道这个方法的利弊，但是我可以想象有这样的情况，你只是想快速地把你已经拥有的一个应用的桌面版本拼凑在一起。
#4
4
My comment became too large. This is to elaborate and add to Jeremy Wilken's excellent answer.
我的评论太大了。这是为了阐述杰里米·威尔肯出色的回答。
It is not only limiting the browsers on a desktop, but showing the mobile-screen on part of the screen real estate looks downright ridiculous (time to rethink what mobile first means :)). The need for proper API cannot be stressed more because the flow (navigation) will most probably vary across more screens in a mobile format than in the PC format though functionality may be the same.
它不仅限制了桌面浏览器，还在屏幕上显示移动屏幕的部分，这简直是荒唐至极(是时候重新思考移动优先的含义了:)。由于流量(导航)在移动格式的屏幕上可能会比PC格式更大，尽管功能可能是相同的，所以对适当的API的需求是不可能有更多的压力的。
I agree with Jeremy's observation that Business logic should be kept separate and exposed as fine grained REST APIS e.g use a Express.js framework based server with MySQL/MongoDB/Redis or any other commercial data store. So, the REST API can be used across Mobile/Phablet/Mini Tablet UI (with Ionic) and Desktop/Laptop UIs (with Bootstrap + AngularJS.). Of course I am a fan of JS, OP can use any language of choice for the server.
我同意Jeremy的观点，即业务逻辑应该保持独立，并作为细粒度REST api e公开。g使用表达。使用MySQL/MongoDB/Redis或任何其他商业数据存储的基于js框架的服务器。因此，REST API可以跨移动/平板/迷你平板UI(带有Ionic)和桌面/笔记本UI(带有Bootstrap + AngularJS)使用。当然我是JS的粉丝，OP可以为服务器选择任何语言。
#5
0
The framework is for mobile hybrid app only although it would work as a normal HTML app.
该框架只适用于移动混合应用程序，尽管它可以作为一个普通的HTML应用程序。
#6
0
I would recommend using ionic for mobile and especially if you are using ionic2 use same code for the desktop in angular2 with just minor alterations
我建议使用ionic来移动，特别是如果你使用ionic2在angular2的桌面使用相同的代码，只是稍微改变一下。
#1
25
To expand a little bit on what has already been said, Ionic is is built and tested for mobile only. Internet Explorer for example is not tested and does not properly handle a number of the features in Ionic. Desktop browsers do have different features from their mobile browser counterparts. You would seriously limit the browsers that can use your application on a desktop.
为了进一步扩展已经说过的内容，Ionic只用于移动设备的构建和测试。例如，Internet Explorer没有经过测试，并且不能正确地处理Ionic中的一些特性。桌面浏览器和移动浏览器有不同的特性。您将严重限制在桌面上使用应用程序的浏览器。
Most likely, you should provide two different applications for desktop and mobile. Unless you have the guts or ability to tell your users that they must use Chrome (or Opera) to run your website, you'll want two separate applications. You could still use Ionic for a mobile website though, but without being able to use Cordova's full platform integration (you would be limited to the native HTML APIs provided by the browser). You could certainly retain much of your business logic in a common core that is shared between both applications. That would require creating a shared angular module(s). I have done this in a project with an Ionic app and a normal Angular desktop app (with Bootstrap).
最可能的是，您应该为桌面和移动提供两个不同的应用程序。除非你有勇气或能力告诉你的用户他们必须使用Chrome(或Opera)来运行你的网站，否则你需要两个独立的应用程序。不过，您仍然可以在移动网站上使用Ionic，但不能使用Cordova的完整平台集成(您只能使用浏览器提供的本地HTML api)。您当然可以在两个应用程序之间共享的公共核心中保留大部分业务逻辑。这需要创建一个共享的角模块。我在一个项目中使用了一个Ionic应用程序和一个普通的角度桌面应用程序(使用Bootstrap)。
There are a number of ways to detect if a visitor is coming from a desktop or mobile device. I don't know of a method that is 100% perfect, because they usually rely on the browser's user agent string (and can be spoofed, changed, etc). See http://detectmobilebrowsers.com/ for some common scripts or examples how to implement mobile detection on a server or in a programming language.
有很多方法可以检测访问者是否来自桌面或移动设备。我不知道有哪种方法是100%完美的，因为它们通常依赖于浏览器的用户代理字符串(可以被欺骗、修改等等)。有关如何在服务器或编程语言上实现移动检测的常见脚本或示例，请参见http://detectmobilebrowsers.com/。
#2
24
This question was asked at ng-europe earlier this week. The answer from the ionic guys was to share your services and controllers, but use different views for desktop. Ionic is purely focused on mobile.
这个问题在本周早些时候在ng-欧洲被问到。来自ionic公司的答案是共享你的服务和控制器，但是桌面使用不同的视图。Ionic专注于移动业务。
#3
13
Interestingly, it seems to be possible to produce a desktop version of an Ionic app using a toolkit named 'Electron' which is sort of a desktop equivalent of Cordova/Phonegap, as explained in this article:
有趣的是，似乎有可能利用名为“电子”的工具包开发出一款Ionic应用的桌面版本，这个工具包类似于Cordova/Phonegap，如本文所述:
http://alexbergin.com/2015/streamlining-desktop-and-mobile-app-development
http://alexbergin.com/2015/streamlining-desktop-and-mobile-app-development
Electron (formerly named Atom Shell) packages an embedded Chromium webview to produce a 'real' app. This also means that cross-browser issues are not a concern.
电子(原名Atom Shell)将嵌入的Chromium webview打包成一个“真实”的应用程序，这也意味着跨浏览器的问题不值得关注。
The author of the above article used this successfully with an Ionic app.
这篇文章的作者在一个Ionic应用程序中成功地使用了它。
If you would go down this road then you would probably need to use some responsive techiques to optimize the UX on desktop.
如果你要沿着这条路走下去，那么你可能需要使用一些响应灵敏的技术来优化桌面用户体验。
I haven't tried this so I don't know the pros and cons of this approach but I can imagine there are cases when you just want to quickly throw together a desktop version of an app that you already have.
我还没有尝试过这个，所以我不知道这个方法的利弊，但是我可以想象有这样的情况，你只是想快速地把你已经拥有的一个应用的桌面版本拼凑在一起。
#4
4
My comment became too large. This is to elaborate and add to Jeremy Wilken's excellent answer.
我的评论太大了。这是为了阐述杰里米·威尔肯出色的回答。
It is not only limiting the browsers on a desktop, but showing the mobile-screen on part of the screen real estate looks downright ridiculous (time to rethink what mobile first means :)). The need for proper API cannot be stressed more because the flow (navigation) will most probably vary across more screens in a mobile format than in the PC format though functionality may be the same.
它不仅限制了桌面浏览器，还在屏幕上显示移动屏幕的部分，这简直是荒唐至极(是时候重新思考移动优先的含义了:)。由于流量(导航)在移动格式的屏幕上可能会比PC格式更大，尽管功能可能是相同的，所以对适当的API的需求是不可能有更多的压力的。
I agree with Jeremy's observation that Business logic should be kept separate and exposed as fine grained REST APIS e.g use a Express.js framework based server with MySQL/MongoDB/Redis or any other commercial data store. So, the REST API can be used across Mobile/Phablet/Mini Tablet UI (with Ionic) and Desktop/Laptop UIs (with Bootstrap + AngularJS.). Of course I am a fan of JS, OP can use any language of choice for the server.
我同意Jeremy的观点，即业务逻辑应该保持独立，并作为细粒度REST api e公开。g使用表达。使用MySQL/MongoDB/Redis或任何其他商业数据存储的基于js框架的服务器。因此，REST API可以跨移动/平板/迷你平板UI(带有Ionic)和桌面/笔记本UI(带有Bootstrap + AngularJS)使用。当然我是JS的粉丝，OP可以为服务器选择任何语言。
#5
0
The framework is for mobile hybrid app only although it would work as a normal HTML app.
该框架只适用于移动混合应用程序，尽管它可以作为一个普通的HTML应用程序。
#6
0
I would recommend using ionic for mobile and especially if you are using ionic2 use same code for the desktop in angular2 with just minor alterations
我建议使用ionic来移动，特别是如果你使用ionic2在angular2的桌面使用相同的代码，只是稍微改变一下。